From 0cd61eb214b4e62d1cf2b52e53ec79e5289d48b2 Mon Sep 17 00:00:00 2001
From: Austin Chen <akrolsmir@gmail.com>
Date: Mon, 22 Aug 2022 10:48:21 -0700
Subject: [PATCH] DX: Link to Firestore console from "..."

---
 common/envs/constants.ts                      |  4 ++++
 .../contract/contract-info-dialog.tsx         | 19 ++++++++++++++++++-
 web/hooks/use-admin.ts                        |  4 ++++
 web/pages/admin.tsx                           |  3 ++-
 4 files changed, 28 insertions(+), 2 deletions(-)

diff --git a/common/envs/constants.ts b/common/envs/constants.ts
index 48f9bf63..89d040e8 100644
--- a/common/envs/constants.ts
+++ b/common/envs/constants.ts
@@ -44,3 +44,7 @@ export const CORS_ORIGIN_VERCEL = new RegExp(
 )
 // Any localhost server on any port
 export const CORS_ORIGIN_LOCALHOST = /^http:\/\/localhost:\d+$/
+
+export function firestoreConsolePath(contractId: string) {
+  return `https://console.firebase.google.com/project/${PROJECT_ID}/firestore/data/~2Fcontracts~2F${contractId}`
+}
diff --git a/web/components/contract/contract-info-dialog.tsx b/web/components/contract/contract-info-dialog.tsx
index be24d0b5..63c9ac72 100644
--- a/web/components/contract/contract-info-dialog.tsx
+++ b/web/components/contract/contract-info-dialog.tsx
@@ -13,6 +13,9 @@ import { Col } from '../layout/col'
 import { Modal } from '../layout/modal'
 import { Title } from '../title'
 import { InfoTooltip } from '../info-tooltip'
+import { useAdmin, useDev } from 'web/hooks/use-admin'
+import { SiteLink } from '../site-link'
+import { firestoreConsolePath } from 'common/envs/constants'
 
 export const contractDetailsButtonClassName =
   'group flex items-center rounded-md px-3 py-2 text-sm font-medium cursor-pointer hover:bg-gray-100 text-gray-400 hover:text-gray-500'
@@ -21,10 +24,12 @@ export function ContractInfoDialog(props: { contract: Contract; bets: Bet[] }) {
   const { contract, bets } = props
 
   const [open, setOpen] = useState(false)
+  const isDev = useDev()
+  const isAdmin = useAdmin()
 
   const formatTime = (dt: number) => dayjs(dt).format('MMM DD, YYYY hh:mm a z')
 
-  const { createdTime, closeTime, resolutionTime, mechanism, outcomeType } =
+  const { createdTime, closeTime, resolutionTime, mechanism, outcomeType, id } =
     contract
 
   const tradersCount = uniqBy(
@@ -121,6 +126,18 @@ export function ContractInfoDialog(props: { contract: Contract; bets: Bet[] }) {
                 </td>
                 <td>{contractPool(contract)}</td>
               </tr>
+
+              {/* Show a path to Firebase if user is an admin, or we're on localhost */}
+              {(isAdmin || isDev) && (
+                <tr>
+                  <td>[DEV] Firestore</td>
+                  <td>
+                    <SiteLink href={firestoreConsolePath(id)}>
+                      Console link
+                    </SiteLink>
+                  </td>
+                </tr>
+              )}
             </tbody>
           </table>
 
diff --git a/web/hooks/use-admin.ts b/web/hooks/use-admin.ts
index 551c588b..aa566171 100644
--- a/web/hooks/use-admin.ts
+++ b/web/hooks/use-admin.ts
@@ -5,3 +5,7 @@ export const useAdmin = () => {
   const privateUser = usePrivateUser()
   return isAdmin(privateUser?.email || '')
 }
+
+export const useDev = () => {
+  return process.env.NODE_ENV === 'development'
+}
diff --git a/web/pages/admin.tsx b/web/pages/admin.tsx
index 81f23ba9..209b38a3 100644
--- a/web/pages/admin.tsx
+++ b/web/pages/admin.tsx
@@ -10,6 +10,7 @@ import { mapKeys } from 'lodash'
 import { useAdmin } from 'web/hooks/use-admin'
 import { contractPath } from 'web/lib/firebase/contracts'
 import { redirectIfLoggedOut } from 'web/lib/firebase/server-auth'
+import { firestoreConsolePath } from 'common/envs/constants'
 
 export const getServerSideProps = redirectIfLoggedOut('/')
 
@@ -198,7 +199,7 @@ function ContractsTable() {
             html(`<a
               class="hover:underline hover:decoration-indigo-400 hover:decoration-2"
               target="_blank"
-              href="https://console.firebase.google.com/project/mantic-markets/firestore/data/~2Fcontracts~2F${cell}">${cell}</a>`),
+              href="${firestoreConsolePath(cell as string)}">${cell}</a>`),
         },
       ]}
       search={true}