Generify most of the customizable brand stuff

common/envs/prod.ts

@@ -11,6 +11,7 @@ export type EnvConfig = {
   moneyMoniker: string // e.g. 'M$'
   faviconPath?: string // Should be a file in /public
   navbarLogoPath?: string
+  newQuestionPlaceholders: string[]
 }
 
 type FirebaseConfig = {
@@ -40,8 +41,15 @@ export const PROD_CONFIG: EnvConfig = {
     'taowell@gmail.com', // Stephen
     'manticmarkets@gmail.com', // Manifold
   ],
-  moneyMoniker: 'M$',
   visibility: 'PUBLIC',
+
+  moneyMoniker: 'M$',
   navbarLogoPath: '',
   faviconPath: '/favicon.ico',
+  newQuestionPlaceholders: [
+    'Will anyone I know get engaged this year?',
+    'Will humans set foot on Mars by the end of 2030?',
+    'Will any cryptocurrency eclipse Bitcoin by market cap this year?',
+    'Will the Democrats win the 2024 presidential election?',
+  ],
 }

common/envs/theoremone.ts

@@ -16,4 +16,11 @@ export const THEOREMONE_CONFIG: EnvConfig = {
   moneyMoniker: 'T$',
   visibility: 'PRIVATE',
   faviconPath: '/theoremone/logo.ico',
+  navbarLogoPath: '/theoremone/TheoremOne-Logo.svg',
+  newQuestionPlaceholders: [
+    'Will we have at least 5 new team members by the end of this quarter?',
+    'Will we meet or exceed our goals this sprint?',
+    'Will we sign on 3 or more new clients this month?',
+    'Will Paul shave his beard by the end of the month?',
+  ],
 }

common/util/format.ts

@@ -1,3 +1,5 @@
+import { ENV_CONFIG } from '../access'
+
 const formatter = new Intl.NumberFormat('en-US', {
   style: 'currency',
   currency: 'USD',
@@ -6,7 +8,9 @@ const formatter = new Intl.NumberFormat('en-US', {
 })
 
 export function formatMoney(amount: number) {
-  return 'T$ ' + formatter.format(amount).replace('$', '')
+  return (
+    ENV_CONFIG.moneyMoniker + ' ' + formatter.format(amount).replace('$', '')
+  )
 }
 
 export function formatWithCommas(amount: number) {

web/components/feed-create.tsx

@@ -9,6 +9,7 @@ import { Contract } from '../../common/contract'
 import { Col } from './layout/col'
 import clsx from 'clsx'
 import { Row } from './layout/row'
+import { ENV_CONFIG } from '../../common/access'
 
 export function FeedPromo(props: { hotContracts: Contract[] }) {
   const { hotContracts } = props
@@ -72,20 +73,10 @@ export default function FeedCreate(props: {
   const [isExpanded, setIsExpanded] = useState(false)
   const inputRef = useRef<HTMLTextAreaElement | null>()
 
-  const placeholders = [
+  const placeholders = ENV_CONFIG.newQuestionPlaceholders
-    // 'Will anyone I know get engaged this year?',
-    // 'Will humans set foot on Mars by the end of 2030?',
-    // 'Will any cryptocurrency eclipse Bitcoin by market cap this year?',
-    // 'Will the Democrats win the 2024 presidential election?',
-    'Will we have at least 5 new team members by the end of this quarter?',
-    'Will we meet or exceed our goals this sprint?',
-    'Will we sign on 3 or more new clients this month?',
-    'Will Paul shave his beard by the end of the month?',
-  ]
   // Rotate through a new placeholder each day
   // Easter egg idea: click your own name to shuffle the placeholder
   // const daysSinceEpoch = Math.floor(Date.now() / 1000 / 60 / 60 / 24)
-
   const [randIndex] = useState(
     Math.floor(Math.random() * 1e10) % placeholders.length
   )

web/components/manifold-logo.tsx

@@ -2,6 +2,7 @@ import Link from 'next/link'
 import clsx from 'clsx'
 
 import { useUser } from '../hooks/use-user'
+import { ENV_CONFIG } from '../../common/access'
 
 export function ManifoldLogo(props: {
   className?: string
@@ -20,7 +21,30 @@ export function ManifoldLogo(props: {
           width={45}
           height={45}
         />
-        <img src={'/theoremone/TheoremOne-Logo.svg'} width={245} height={45} />
+        {ENV_CONFIG.navbarLogoPath ? (
+          <img src={ENV_CONFIG.navbarLogoPath} width={245} height={45} />
+        ) : (
+          <>
+            <div
+              className={clsx(
+                'font-major-mono mt-1 text-lg lowercase sm:hidden',
+                darkBackground && 'text-white'
+              )}
+            >
+              Manifold
+              <br />
+              Markets
+            </div>
+            <div
+              className={clsx(
+                'font-major-mono mt-1 hidden lowercase sm:flex sm:text-2xl md:whitespace-nowrap',
+                darkBackground && 'text-white'
+              )}
+            >
+              Manifold Markets
+            </div>
+          </>
+        )}
       </a>
     </Link>
   )

web/lib/firebase/init.ts

@@ -1,13 +1,11 @@
 import { getFirestore } from '@firebase/firestore'
 import { initializeApp, getApps, getApp } from 'firebase/app'
-import { FIREBASE_CONFIGS } from '../../../common/access'
+import { FIREBASE_CONFIG } from '../../../common/access'
 
 const ENV = process.env.NEXT_PUBLIC_FIREBASE_ENV ?? 'PROD'
 // TODO: Move this to access.ts
 export const IS_PRIVATE_MANIFOLD = !['PROD', 'DEV'].includes(ENV)
-// @ts-ignore
-const firebaseConfig = FIREBASE_CONFIGS[ENV]
 // Initialize Firebase
-export const app = getApps().length ? getApp() : initializeApp(firebaseConfig)
+export const app = getApps().length ? getApp() : initializeApp(FIREBASE_CONFIG)
 
 export const db = getFirestore(app)

web/pages/_document.tsx

@@ -1,10 +1,11 @@
 import { Html, Head, Main, NextScript } from 'next/document'
+import { ENV_CONFIG } from '../../common/access'
 
 export default function Document() {
   return (
     <Html data-theme="mantic" className="min-h-screen">
       <Head>
-        <link rel="icon" href="/theoremone/logo.ico" />
+        <link rel="icon" href={ENV_CONFIG.faviconPath} />
 
         <link rel="preconnect" href="https://fonts.googleapis.com" />
         <link