From 4ec59be46f0dbbaf4cac1b757181217b34b197f9 Mon Sep 17 00:00:00 2001
From: Boa <iansphilips@gmail.com>
Date: Thu, 28 Apr 2022 17:01:50 -0600
Subject: [PATCH 01/14] Free daily market (#107)

* Allow users a free daily market

* Show confetti on recent created market

* remove unused import

* remove comment

* Did create market -> hook, capitalize buttons

* Check for confetti with interval

* Just check once

* Capitalize create market button on feed
---
 functions/src/create-contract.ts            | 12 +++++++--
 web/components/feed-create.tsx              |  2 +-
 web/components/nav/sidebar.tsx              | 20 ++++++++++++---
 web/hooks/use-has-created-contract-today.ts | 27 +++++++++++++++++++++
 web/package.json                            |  1 +
 web/pages/[username]/[contractSlug].tsx     | 23 ++++++++++++++++++
 web/pages/create.tsx                        | 18 ++++++++++----
 yarn.lock                                   | 12 +++++++++
 8 files changed, 104 insertions(+), 11 deletions(-)
 create mode 100644 web/hooks/use-has-created-contract-today.ts

diff --git a/functions/src/create-contract.ts b/functions/src/create-contract.ts
index 16a416b1..e45e7497 100644
--- a/functions/src/create-contract.ts
+++ b/functions/src/create-contract.ts
@@ -1,7 +1,6 @@
 import * as functions from 'firebase-functions'
 import * as admin from 'firebase-admin'
 import * as _ from 'lodash'
-
 import { chargeUser, getUser } from './utils'
 import {
   Binary,
@@ -109,7 +108,16 @@ export const createContract = functions
         tags ?? []
       )
 
-      if (ante) await chargeUser(creator.id, ante)
+      // uses utc time on server:
+      const today = new Date().setHours(0, 0, 0, 0)
+      const userContractsCreatedTodaySnapshot = await firestore
+        .collection(`contracts`)
+        .where('creatorId', '==', userId)
+        .where('createdTime', '>=', today)
+        .get()
+      const isFree = userContractsCreatedTodaySnapshot.size === 0
+
+      if (!isFree && ante) await chargeUser(creator.id, ante)
 
       await contractRef.create(contract)
 
diff --git a/web/components/feed-create.tsx b/web/components/feed-create.tsx
index d184e035..0a0c6902 100644
--- a/web/components/feed-create.tsx
+++ b/web/components/feed-create.tsx
@@ -141,7 +141,7 @@ export default function FeedCreate(props: {
       {/* Show a fake "Create Market" button, which gets replaced with the NewContract one*/}
       {!isExpanded && (
         <div className="flex justify-end sm:-mt-4">
-          <button className="btn btn-sm" disabled>
+          <button className="btn btn-sm capitalize" disabled>
             Create Market
           </button>
         </div>
diff --git a/web/components/nav/sidebar.tsx b/web/components/nav/sidebar.tsx
index 67e8ae29..576cea87 100644
--- a/web/components/nav/sidebar.tsx
+++ b/web/components/nav/sidebar.tsx
@@ -19,6 +19,7 @@ import { firebaseLogin, firebaseLogout } from '../../lib/firebase/users'
 import { ManifoldLogo } from './manifold-logo'
 import { MenuButton } from './menu'
 import { getNavigationOptions, ProfileSummary } from './profile-menu'
+import { useHasCreatedContractToday } from '../../hooks/use-has-created-contract-today'
 
 const navigation = [
   { name: 'Home', href: '/home', icon: HomeIcon },
@@ -96,6 +97,7 @@ export default function Sidebar() {
   const user = useUser()
   let folds = useFollowedFolds(user) || []
   folds = _.sortBy(folds, 'followCount').reverse()
+  const deservesDailyFreeMarket = !useHasCreatedContractToday(user)
 
   const navigationOptions = user === null ? signedOutNavigation : navigation
   const mobileNavigationOptions =
@@ -159,10 +161,22 @@ export default function Sidebar() {
         />
       </div>
 
+      {deservesDailyFreeMarket ? (
+        <div className=" text-primary mt-4 text-center">
+          Use your daily free market! 🎉
+        </div>
+      ) : (
+        <div />
+      )}
+
       {user && (
-        <Link href={'/create'}>
-          <button className="btn btn-primary btn-md mt-4">Create Market</button>
-        </Link>
+        <div className={'aligncenter flex justify-center'}>
+          <Link href={'/create'}>
+            <button className="btn btn-primary btn-md mt-4 capitalize">
+              Create Market
+            </button>
+          </Link>
+        </div>
       )}
     </nav>
   )
diff --git a/web/hooks/use-has-created-contract-today.ts b/web/hooks/use-has-created-contract-today.ts
new file mode 100644
index 00000000..653049d2
--- /dev/null
+++ b/web/hooks/use-has-created-contract-today.ts
@@ -0,0 +1,27 @@
+import { listContracts } from '../lib/firebase/contracts'
+import { useEffect, useState } from 'react'
+import dayjs from 'dayjs'
+import { User } from '../../common/user'
+
+export const useHasCreatedContractToday = (user: User | null | undefined) => {
+  const [hasCreatedContractToday, setHasCreatedContractToday] = useState(false)
+
+  useEffect(() => {
+    // Uses utc time like the server.
+    const todayAtMidnight = dayjs.utc().startOf('day').valueOf()
+
+    async function listUserContractsForToday() {
+      if (!user) return
+
+      const contracts = await listContracts(user.id)
+      const todayContracts = contracts.filter(
+        (contract) => contract.createdTime > todayAtMidnight
+      )
+      setHasCreatedContractToday(todayContracts.length > 0)
+    }
+
+    listUserContractsForToday()
+  }, [user])
+
+  return hasCreatedContractToday
+}
diff --git a/web/package.json b/web/package.json
index 04f11245..84077a19 100644
--- a/web/package.json
+++ b/web/package.json
@@ -30,6 +30,7 @@
     "lodash": "4.17.21",
     "next": "12.1.2",
     "react": "17.0.2",
+    "react-confetti": "^6.0.1",
     "react-dom": "17.0.2",
     "react-expanding-textarea": "2.3.5"
   },
diff --git a/web/pages/[username]/[contractSlug].tsx b/web/pages/[username]/[contractSlug].tsx
index 642de0ca..6e6e4523 100644
--- a/web/pages/[username]/[contractSlug].tsx
+++ b/web/pages/[username]/[contractSlug].tsx
@@ -33,6 +33,8 @@ import { ContractTabs } from '../../components/contract/contract-tabs'
 import { FirstArgument } from '../../../common/util/types'
 import { DPM, FreeResponse, FullContract } from '../../../common/contract'
 import { contractTextDetails } from '../../components/contract/contract-details'
+import { useWindowSize } from '../../hooks/use-window-size'
+import Confetti from 'react-confetti'
 
 export const getStaticProps = fromPropz(getStaticPropz)
 export async function getStaticPropz(props: {
@@ -86,9 +88,21 @@ export function ContractPageContent(props: FirstArgument<typeof ContractPage>) {
   const { backToHome } = props
 
   const user = useUser()
+  const { width, height } = useWindowSize()
 
   const contract = useContractWithPreload(props.contract)
   const { bets, comments } = props
+  const [showConfetti, setShowConfetti] = useState(false)
+
+  useEffect(() => {
+    const shouldSeeConfetti = !!(
+      user &&
+      contract &&
+      contract.creatorId === user.id &&
+      Date.now() - contract.createdTime < 10 * 1000
+    )
+    setShowConfetti(shouldSeeConfetti)
+  }, [contract, user])
 
   // Sort for now to see if bug is fixed.
   comments.sort((c1, c2) => c1.createdTime - c2.createdTime)
@@ -119,6 +133,15 @@ export function ContractPageContent(props: FirstArgument<typeof ContractPage>) {
 
   return (
     <Page rightSidebar={rightSidebar}>
+      {showConfetti && (
+        <Confetti
+          width={width ? width : 500}
+          height={height ? height : 500}
+          recycle={false}
+          numberOfPieces={300}
+        />
+      )}
+
       {ogCardProps && (
         <SEO
           title={question}
diff --git a/web/pages/create.tsx b/web/pages/create.tsx
index 4a4a07b5..68a92260 100644
--- a/web/pages/create.tsx
+++ b/web/pages/create.tsx
@@ -18,6 +18,7 @@ import { TagsList } from '../components/tags-list'
 import { Row } from '../components/layout/row'
 import { MAX_DESCRIPTION_LENGTH, outcomeType } from '../../common/contract'
 import { formatMoney } from '../../common/util/format'
+import { useHasCreatedContractToday } from '../hooks/use-has-created-contract-today'
 
 export default function Create() {
   const [question, setQuestion] = useState('')
@@ -70,6 +71,9 @@ export function NewContract(props: { question: string; tag?: string }) {
   const tags = parseWordsAsTags(tagText)
 
   const [ante, setAnte] = useState(FIXED_ANTE)
+
+  const deservesDailyFreeMarket = !useHasCreatedContractToday(creator)
+
   // useEffect(() => {
   //   if (ante === null && creator) {
   //     const initialAnte = creator.balance < 100 ? MINIMUM_ANTE : 100
@@ -246,10 +250,14 @@ export function NewContract(props: { question: string; tag?: string }) {
             text={`Cost to create your market. This amount is used to subsidize trading.`}
           />
         </label>
-
-        <div className="label-text text-neutral pl-1">{formatMoney(ante)}</div>
-
-        {ante > balance && (
+        {deservesDailyFreeMarket ? (
+          <div className="label-text text-primary pl-1">FREE</div>
+        ) : (
+          <div className="label-text text-neutral pl-1">
+            {formatMoney(ante)}
+          </div>
+        )}
+        {!deservesDailyFreeMarket && ante > balance && (
           <div className="mb-2 mt-2 mr-auto self-center whitespace-nowrap text-xs font-medium tracking-wide">
             <span className="mr-2 text-red-500">Insufficient balance</span>
             <button
@@ -278,7 +286,7 @@ export function NewContract(props: { question: string; tag?: string }) {
         <button
           type="submit"
           className={clsx(
-            'btn btn-primary',
+            'btn btn-primary capitalize',
             isSubmitting && 'loading disabled'
           )}
           disabled={isSubmitting || !isValid}
diff --git a/yarn.lock b/yarn.lock
index 06c92ced..852ccf89 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4441,6 +4441,13 @@ raw-body@2.4.2, raw-body@^2.2.0:
     iconv-lite "0.4.24"
     unpipe "1.0.0"
 
+react-confetti@^6.0.1:
+  version "6.0.1"
+  resolved "https://registry.yarnpkg.com/react-confetti/-/react-confetti-6.0.1.tgz#d4f57b5a021dd908a6243b8f63b6009b00818d10"
+  integrity sha512-ZpOTBrqSNhWE4rRXCZ6E6U+wGd7iYHF5MGrqwikoiBpgBq9Akdu0DcLW+FdFnLjyZYC+VfAiV2KeFgYRMyMrkA==
+  dependencies:
+    tween-functions "^1.2.0"
+
 react-dom@17.0.2:
   version "17.0.2"
   resolved "https://registry.yarnpkg.com/react-dom/-/react-dom-17.0.2.tgz#ecffb6845e3ad8dbfcdc498f0d0a939736502c23"
@@ -5154,6 +5161,11 @@ tsutils@^3.21.0:
   dependencies:
     tslib "^1.8.1"
 
+tween-functions@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/tween-functions/-/tween-functions-1.2.0.tgz#1ae3a50e7c60bb3def774eac707acbca73bbc3ff"
+  integrity sha1-GuOlDnxguz3vd06scHrLynO7w/8=
+
 type-check@^0.4.0, type-check@~0.4.0:
   version "0.4.0"
   resolved "https://registry.yarnpkg.com/type-check/-/type-check-0.4.0.tgz#07b8203bfa7056c0657050e3ccd2c37730bab8f1"

From 9e275a18f1e7244697c97711d982a9324607da5d Mon Sep 17 00:00:00 2001
From: Ian Philips <iansphilips@gmail.com>
Date: Thu, 28 Apr 2022 19:31:43 -0600
Subject: [PATCH 02/14] use Date instead of dayjs

---
 web/hooks/use-has-created-contract-today.ts | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/hooks/use-has-created-contract-today.ts b/web/hooks/use-has-created-contract-today.ts
index 653049d2..3e9d6efe 100644
--- a/web/hooks/use-has-created-contract-today.ts
+++ b/web/hooks/use-has-created-contract-today.ts
@@ -1,6 +1,5 @@
 import { listContracts } from '../lib/firebase/contracts'
 import { useEffect, useState } from 'react'
-import dayjs from 'dayjs'
 import { User } from '../../common/user'
 
 export const useHasCreatedContractToday = (user: User | null | undefined) => {
@@ -8,7 +7,8 @@ export const useHasCreatedContractToday = (user: User | null | undefined) => {
 
   useEffect(() => {
     // Uses utc time like the server.
-    const todayAtMidnight = dayjs.utc().startOf('day').valueOf()
+    const utcTimeString = new Date().toISOString()
+    const todayAtMidnight = new Date(utcTimeString).setUTCHours(0, 0, 0, 0)
 
     async function listUserContractsForToday() {
       if (!user) return

From 760681f95844e26630972329831c060d1d4a5413 Mon Sep 17 00:00:00 2001
From: Ian Philips <iansphilips@gmail.com>
Date: Thu, 28 Apr 2022 19:39:55 -0600
Subject: [PATCH 03/14] Default has created one to prevent flash

---
 web/hooks/use-has-created-contract-today.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/web/hooks/use-has-created-contract-today.ts b/web/hooks/use-has-created-contract-today.ts
index 3e9d6efe..43fe42f9 100644
--- a/web/hooks/use-has-created-contract-today.ts
+++ b/web/hooks/use-has-created-contract-today.ts
@@ -3,7 +3,7 @@ import { useEffect, useState } from 'react'
 import { User } from '../../common/user'
 
 export const useHasCreatedContractToday = (user: User | null | undefined) => {
-  const [hasCreatedContractToday, setHasCreatedContractToday] = useState(false)
+  const [hasCreatedContractToday, setHasCreatedContractToday] = useState(true)
 
   useEffect(() => {
     // Uses utc time like the server.

From 2ddd95e9049daaa97426b8b89c2eb9a35f2064f4 Mon Sep 17 00:00:00 2001
From: Marshall Polaris <marshall@pol.rs>
Date: Thu, 28 Apr 2022 22:39:39 -0700
Subject: [PATCH 04/14] Make tags page filter on server side (#108)

---
 web/lib/firebase/contracts.ts | 12 ++++++++++++
 web/pages/tag/[tag].tsx       | 36 +++++++++++++++--------------------
 2 files changed, 27 insertions(+), 21 deletions(-)

diff --git a/web/lib/firebase/contracts.ts b/web/lib/firebase/contracts.ts
index 1646bd09..f41d6902 100644
--- a/web/lib/firebase/contracts.ts
+++ b/web/lib/firebase/contracts.ts
@@ -115,6 +115,18 @@ export async function listContracts(creatorId: string): Promise<Contract[]> {
   return snapshot.docs.map((doc) => doc.data() as Contract)
 }
 
+export async function listTaggedContractsCaseInsensitive(
+  tag: string
+): Promise<Contract[]> {
+  const q = query(
+    contractCollection,
+    where('lowercaseTags', 'array-contains', tag.toLowerCase()),
+    orderBy('createdTime', 'desc')
+  )
+  const snapshot = await getDocs(q)
+  return snapshot.docs.map((doc) => doc.data() as Contract)
+}
+
 export async function listAllContracts(): Promise<Contract[]> {
   const q = query(contractCollection, orderBy('createdTime', 'desc'))
   const snapshot = await getDocs(q)
diff --git a/web/pages/tag/[tag].tsx b/web/pages/tag/[tag].tsx
index df9fd943..34c8f138 100644
--- a/web/pages/tag/[tag].tsx
+++ b/web/pages/tag/[tag].tsx
@@ -1,39 +1,33 @@
+import { useEffect, useState } from 'react'
 import { useRouter } from 'next/router'
 import { SearchableGrid } from '../../components/contract/contracts-list'
 import { Page } from '../../components/page'
 import { Title } from '../../components/title'
 import { useContracts } from '../../hooks/use-contracts'
-import { Contract, listAllContracts } from '../../lib/firebase/contracts'
-
-export async function getStaticProps() {
-  const contracts = await listAllContracts().catch((_) => [])
-  return {
-    props: {
-      contracts,
-    },
-
-    revalidate: 60, // regenerate after a minute
-  }
-}
-
-export async function getStaticPaths() {
-  return { paths: [], fallback: 'blocking' }
-}
+import {
+  Contract,
+  listTaggedContractsCaseInsensitive,
+} from '../../lib/firebase/contracts'
 
 export default function TagPage(props: { contracts: Contract[] }) {
   const router = useRouter()
   const { tag } = router.query as { tag: string }
 
-  const contracts = useContracts()
+  // mqp: i wrote this in a panic to make the page literally work at all so if you
+  // want to e.g. listen for new contracts you may want to fix it up
+  const [contracts, setContracts] = useState<Contract[] | 'loading'>('loading')
+  useEffect(() => {
+    if (tag != null) {
+      listTaggedContractsCaseInsensitive(tag).then(setContracts)
+    }
+  }, [tag])
 
-  const taggedContracts = (contracts ?? props.contracts).filter((contract) =>
-    contract.lowercaseTags.includes(tag.toLowerCase())
-  )
+  if (contracts === 'loading') return <></>
 
   return (
     <Page>
       <Title text={`#${tag}`} />
-      <SearchableGrid contracts={taggedContracts} />
+      <SearchableGrid contracts={contracts} />
     </Page>
   )
 }

From ca8420d61be323b3317a27484bbca1dfa1b6d770 Mon Sep 17 00:00:00 2001
From: Ian Philips <iansphilips@gmail.com>
Date: Fri, 29 Apr 2022 07:34:36 -0600
Subject: [PATCH 05/14] Allow free daily market with M-zsh

---
 functions/src/create-contract.ts | 19 +++++++++----------
 web/pages/create.tsx             |  2 +-
 2 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/functions/src/create-contract.ts b/functions/src/create-contract.ts
index e45e7497..781337f7 100644
--- a/functions/src/create-contract.ts
+++ b/functions/src/create-contract.ts
@@ -72,11 +72,19 @@ export const createContract = functions
         return { status: 'error', message: 'Invalid initial probability' }
 
       const ante = FIXED_ANTE // data.ante
+      // uses utc time on server:
+      const today = new Date().setHours(0, 0, 0, 0)
+      const userContractsCreatedTodaySnapshot = await firestore
+        .collection(`contracts`)
+        .where('creatorId', '==', userId)
+        .where('createdTime', '>=', today)
+        .get()
+      const isFree = userContractsCreatedTodaySnapshot.size === 0
 
       if (
         ante === undefined ||
         ante < MINIMUM_ANTE ||
-        ante > creator.balance ||
+        (ante > creator.balance && !isFree) ||
         isNaN(ante) ||
         !isFinite(ante)
       )
@@ -108,15 +116,6 @@ export const createContract = functions
         tags ?? []
       )
 
-      // uses utc time on server:
-      const today = new Date().setHours(0, 0, 0, 0)
-      const userContractsCreatedTodaySnapshot = await firestore
-        .collection(`contracts`)
-        .where('creatorId', '==', userId)
-        .where('createdTime', '>=', today)
-        .get()
-      const isFree = userContractsCreatedTodaySnapshot.size === 0
-
       if (!isFree && ante) await chargeUser(creator.id, ante)
 
       await contractRef.create(contract)
diff --git a/web/pages/create.tsx b/web/pages/create.tsx
index 68a92260..ab614167 100644
--- a/web/pages/create.tsx
+++ b/web/pages/create.tsx
@@ -99,7 +99,7 @@ export function NewContract(props: { question: string; tag?: string }) {
     ante !== undefined &&
     ante !== null &&
     ante >= MINIMUM_ANTE &&
-    ante <= balance &&
+    (ante <= balance || deservesDailyFreeMarket) &&
     // closeTime must be in the future
     closeTime &&
     closeTime > Date.now()

From 7e9007aad1c7d481752292f555c683cf23554b88 Mon Sep 17 00:00:00 2001
From: James Grugett <jahooma@gmail.com>
Date: Fri, 29 Apr 2022 09:53:51 -0400
Subject: [PATCH 06/14] Fetch markets client side on explore page (to avoid
 vercel 5MB limit for static props)

---
 web/pages/markets.tsx | 29 +++++++++--------------------
 1 file changed, 9 insertions(+), 20 deletions(-)

diff --git a/web/pages/markets.tsx b/web/pages/markets.tsx
index 6149c8b5..81032199 100644
--- a/web/pages/markets.tsx
+++ b/web/pages/markets.tsx
@@ -2,26 +2,16 @@ import {
   ContractsGrid,
   SearchableGrid,
 } from '../components/contract/contracts-list'
+import { LoadingIndicator } from '../components/loading-indicator'
 import { Page } from '../components/page'
 import { SEO } from '../components/SEO'
 import { Title } from '../components/title'
 import { useContracts } from '../hooks/use-contracts'
-import { Contract, listAllContracts } from '../lib/firebase/contracts'
-
-export async function getStaticProps() {
-  const contracts = await listAllContracts().catch((_) => [])
-  return {
-    props: {
-      contracts,
-    },
-
-    revalidate: 60, // regenerate after a minute
-  }
-}
+import { Contract } from '../lib/firebase/contracts'
 
 // TODO: Rename endpoint to "Explore"
-export default function Markets(props: { contracts: Contract[] }) {
-  const contracts = useContracts() ?? props.contracts ?? []
+export default function Markets() {
+  const contracts = useContracts()
 
   return (
     <Page>
@@ -30,12 +20,11 @@ export default function Markets(props: { contracts: Contract[] }) {
         description="Discover what's new, trending, or soon-to-close. Or search among our hundreds of markets."
         url="/markets"
       />
-      {/* <HotMarkets contracts={hotContracts} />
-      <Spacer h={10} />
-      <ClosingSoonMarkets contracts={closingSoonContracts} />
-      <Spacer h={10} /> */}
-
-      <SearchableGrid contracts={contracts} />
+      {contracts === undefined ? (
+        <LoadingIndicator />
+      ) : (
+        <SearchableGrid contracts={contracts} />
+      )}
     </Page>
   )
 }

From fa8ebe36bd8dd6dfd512ebc2e0283fd938e3ca83 Mon Sep 17 00:00:00 2001
From: James Grugett <jahooma@gmail.com>
Date: Fri, 29 Apr 2022 10:05:32 -0400
Subject: [PATCH 07/14] Move loading indicator into SearchableGrid.

---
 web/components/contract/contracts-list.tsx | 9 ++++++---
 web/pages/markets.tsx                      | 7 +------
 web/pages/tag/[tag].tsx                    | 7 ++-----
 3 files changed, 9 insertions(+), 14 deletions(-)

diff --git a/web/components/contract/contracts-list.tsx b/web/components/contract/contracts-list.tsx
index d6bef2e7..dab8613d 100644
--- a/web/components/contract/contracts-list.tsx
+++ b/web/components/contract/contracts-list.tsx
@@ -18,6 +18,7 @@ import {
   useQueryAndSortParams,
 } from '../../hooks/use-sort-and-query-params'
 import { Answer } from '../../../common/answer'
+import { LoadingIndicator } from '../loading-indicator'
 
 export function ContractsGrid(props: {
   contracts: Contract[]
@@ -213,7 +214,7 @@ function TagContractsGrid(props: { contracts: Contract[] }) {
 const MAX_CONTRACTS_DISPLAYED = 99
 
 export function SearchableGrid(props: {
-  contracts: Contract[]
+  contracts: Contract[] | undefined
   byOneCreator?: boolean
   querySortOptions?: {
     defaultSort: Sort
@@ -230,7 +231,7 @@ export function SearchableGrid(props: {
     return queryWords.every((word) => corpus.toLowerCase().includes(word))
   }
 
-  let matches = contracts.filter(
+  let matches = (contracts ?? []).filter(
     (c) =>
       check(c.question) ||
       check(c.description) ||
@@ -324,7 +325,9 @@ export function SearchableGrid(props: {
         </select>
       </div>
 
-      {sort === 'tag' ? (
+      {contracts === undefined ? (
+        <LoadingIndicator />
+      ) : sort === 'tag' ? (
         <TagContractsGrid contracts={matches} />
       ) : !byOneCreator && sort === 'creator' ? (
         <CreatorContractsGrid contracts={matches} />
diff --git a/web/pages/markets.tsx b/web/pages/markets.tsx
index 81032199..23ff2adf 100644
--- a/web/pages/markets.tsx
+++ b/web/pages/markets.tsx
@@ -2,7 +2,6 @@ import {
   ContractsGrid,
   SearchableGrid,
 } from '../components/contract/contracts-list'
-import { LoadingIndicator } from '../components/loading-indicator'
 import { Page } from '../components/page'
 import { SEO } from '../components/SEO'
 import { Title } from '../components/title'
@@ -20,11 +19,7 @@ export default function Markets() {
         description="Discover what's new, trending, or soon-to-close. Or search among our hundreds of markets."
         url="/markets"
       />
-      {contracts === undefined ? (
-        <LoadingIndicator />
-      ) : (
-        <SearchableGrid contracts={contracts} />
-      )}
+      <SearchableGrid contracts={contracts} />
     </Page>
   )
 }
diff --git a/web/pages/tag/[tag].tsx b/web/pages/tag/[tag].tsx
index 34c8f138..cabc6c80 100644
--- a/web/pages/tag/[tag].tsx
+++ b/web/pages/tag/[tag].tsx
@@ -3,27 +3,24 @@ import { useRouter } from 'next/router'
 import { SearchableGrid } from '../../components/contract/contracts-list'
 import { Page } from '../../components/page'
 import { Title } from '../../components/title'
-import { useContracts } from '../../hooks/use-contracts'
 import {
   Contract,
   listTaggedContractsCaseInsensitive,
 } from '../../lib/firebase/contracts'
 
-export default function TagPage(props: { contracts: Contract[] }) {
+export default function TagPage() {
   const router = useRouter()
   const { tag } = router.query as { tag: string }
 
   // mqp: i wrote this in a panic to make the page literally work at all so if you
   // want to e.g. listen for new contracts you may want to fix it up
-  const [contracts, setContracts] = useState<Contract[] | 'loading'>('loading')
+  const [contracts, setContracts] = useState<Contract[] | undefined>()
   useEffect(() => {
     if (tag != null) {
       listTaggedContractsCaseInsensitive(tag).then(setContracts)
     }
   }, [tag])
 
-  if (contracts === 'loading') return <></>
-
   return (
     <Page>
       <Title text={`#${tag}`} />

From c59e444d0ad5d70bd744b259d369a67597c54e10 Mon Sep 17 00:00:00 2001
From: mantikoros <sgrugett@gmail.com>
Date: Fri, 29 Apr 2022 13:30:27 -0400
Subject: [PATCH 08/14] Manifold CLA

---
 functions/.github/CONTRIBUTING.md | 27 +++++++++++++++++++++++++++
 1 file changed, 27 insertions(+)
 create mode 100644 functions/.github/CONTRIBUTING.md

diff --git a/functions/.github/CONTRIBUTING.md b/functions/.github/CONTRIBUTING.md
new file mode 100644
index 00000000..4651b133
--- /dev/null
+++ b/functions/.github/CONTRIBUTING.md
@@ -0,0 +1,27 @@
+# Manifold CLA
+
+**Manifold Markets Contributor License Agreement**
+
+(Thanks to Beeminder and Discourse.org whose CLA we modeled this on!)
+
+## Unofficial Summary
+
+- Manifold can use your contributions
+- Manifold can sell things involving your contributions
+- You’re legally able to agree to the above
+- You’re the one who created these contributions
+- Manifold decides what gets included in Manifold
+- Manifold does not promise any support
+
+## Official Agreement
+
+The document below clarifies the terms under which You (the copyright owner or legal entity authorized by the copyright owner), may make "The Contributions" (software, bug fixes, configuration changes, documentation, or any other materials) to "The Work" (Manifold Markets). This license protects You, "The Company" (Manifold Markets, Inc.) and licensees; it does not change your rights to use your own contributions for any other purpose.
+
+You and "The Company" (Manifold Markets, Inc.) agree:
+
+- You grant to "The Company" (Manifold Markets, Inc.) a non-exclusive, irrevocable, worldwide, royalty-free, sublicenseable, relicenseable, transferable license under all of Your relevant intellectual property rights, to use, copy, prepare derivative works of, distribute and publicly perform and display "The Contributions" on any licensing terms, including without limitation: (a) open source licenses like the GNU General Public (v2.0) license; and (b) binary, proprietary, or commercial licenses. Except for the licenses granted herein, You reserve all right, title, and interest in and to "The Contributions".
+- You grant to "The Company" a non-exclusive, irrevocable (except as stated in this section), worldwide, royalty-free, sublicenseable, transferable patent license to make, have made, use, offer to sell, sell, import, and otherwise transfer "The Work", where such license applies only to those patent claims licensable by You that are necessarily infringed by Your Contribution(s) alone or by combination of Your Contribution(s) with "The Work" to which such Contribution(s) was submitted. If any entity institutes patent litigation against You or any other entity (including a cross-claim or counterclaim in a lawsuit) alleging that your Contribution, or "The Work" to which you have contributed, constitutes direct or contributory patent infringement, then any patent licenses granted to that entity under this Agreement for that Contribution or Work shall terminate as of the date such litigation is filed.
+- You are able to grant us these rights. You represent that You are legally entitled to grant the above license(s). If Your employer has rights to intellectual property that You create, You represent that You have received permission to make "The Contributions" on behalf of that employer, or that Your employer has waived such rights for "The Contributions".
+- "The Contributions" are your original work. You represent that "The Contributions" are Your original works of authorship, and to Your knowledge, no other person claims, or has the right to claim, any right in any invention or patent related to "The Contributions". You also represent that You are not legally obligated, whether by entering into an agreement or otherwise, in any way that conflicts with the terms of this license. For example, if you have signed an agreement requiring you to assign the intellectual property rights in "The Contributions" to an employer or customer, that would conflict with the terms of this license.
+- We, as authoritative representatives of "The Company" determine the code that is in "The Work". You understand that the decision to include "The Contribution(s)" in any project or source repository is entirely that of "The Company", and this agreement does not guarantee that "The Contributions" will be included in any product.
+- No Implied Warranties. "The Company" acknowledges that, except as explicitly described in this Agreement, the Contribution is provided on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING, WITHOUT LIMITATION, ANY WARRANTIES OR CONDITIONS OF TITLE, NON-INFRINGEMENT, MERCHANTABILITY, OR FITNESS FOR A PARTICULAR PURPOSE.

From be7e4a5c03927b6cb431109f31af1f5d6f77c514 Mon Sep 17 00:00:00 2001
From: mantikoros <sgrugett@gmail.com>
Date: Fri, 29 Apr 2022 13:39:52 -0400
Subject: [PATCH 09/14] Manifold CLA: readme message, move to top level

---
 {functions/.github => .github}/CONTRIBUTING.md | 0
 README.md                                      | 2 ++
 2 files changed, 2 insertions(+)
 rename {functions/.github => .github}/CONTRIBUTING.md (100%)

diff --git a/functions/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md
similarity index 100%
rename from functions/.github/CONTRIBUTING.md
rename to .github/CONTRIBUTING.md
diff --git a/README.md b/README.md
index 56dceae0..98387abe 100644
--- a/README.md
+++ b/README.md
@@ -37,6 +37,8 @@ Also: Our docs are currently in [a separate repo](https://github.com/manifoldmar
 
 Since we are just now open-sourcing things, we will see how things go. Feel free to open issues, submit PRs, and chat about the process on [Discord][discord]. We would prefer [small PRs][small-prs] that we can effectively evaluate and review -- maybe check in with us first if you are thinking to work on a big change.
 
+By contributing to this codebase, you are agreeing to the terms of the [Manifold CLA](https://github.com/manifoldmarkets/manifold/.github/CONTRIBUTING.md).
+
 If you need additional access to any infrastructure in order to work on something (e.g. Vercel, Firebase) let us know about that on Discord as well.
 
 [vercel]: https://vercel.com/

From f078ce4fa9b8b607f2c783e708df58bc46f0ac1e Mon Sep 17 00:00:00 2001
From: mantikoros <sgrugett@gmail.com>
Date: Fri, 29 Apr 2022 13:40:44 -0400
Subject: [PATCH 10/14] CLA: fix link

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index 98387abe..b480f60c 100644
--- a/README.md
+++ b/README.md
@@ -37,7 +37,7 @@ Also: Our docs are currently in [a separate repo](https://github.com/manifoldmar
 
 Since we are just now open-sourcing things, we will see how things go. Feel free to open issues, submit PRs, and chat about the process on [Discord][discord]. We would prefer [small PRs][small-prs] that we can effectively evaluate and review -- maybe check in with us first if you are thinking to work on a big change.
 
-By contributing to this codebase, you are agreeing to the terms of the [Manifold CLA](https://github.com/manifoldmarkets/manifold/.github/CONTRIBUTING.md).
+By contributing to this codebase, you are agreeing to the terms of the [Manifold CLA](https://github.com/manifoldmarkets/manifold/blob/main/.github/CONTRIBUTING.md).
 
 If you need additional access to any infrastructure in order to work on something (e.g. Vercel, Firebase) let us know about that on Discord as well.
 

From c2832039b8ee81b9b21970f1066e9960afa588eb Mon Sep 17 00:00:00 2001
From: Austin Chen <akrolsmir@gmail.com>
Date: Fri, 29 Apr 2022 13:45:10 -0400
Subject: [PATCH 11/14] Link to beeminder & discourse

---
 .github/CONTRIBUTING.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/CONTRIBUTING.md b/.github/CONTRIBUTING.md
index 4651b133..0d4dbd32 100644
--- a/.github/CONTRIBUTING.md
+++ b/.github/CONTRIBUTING.md
@@ -2,7 +2,7 @@
 
 **Manifold Markets Contributor License Agreement**
 
-(Thanks to Beeminder and Discourse.org whose CLA we modeled this on!)
+(Thanks to [Beeminder](http://bmndr.co/cla) and [Discourse.org](https://cla-assistant.io/discourse/discourse) whose CLAs we modeled this on!)
 
 ## Unofficial Summary
 

From 5f86637ca56d16889bc3edd09d979196d825637e Mon Sep 17 00:00:00 2001
From: mantikoros <sgrugett@gmail.com>
Date: Fri, 29 Apr 2022 15:53:13 -0400
Subject: [PATCH 12/14] raise ante to M$100

---
 common/antes.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/common/antes.ts b/common/antes.ts
index 9a3f48c6..a443f508 100644
--- a/common/antes.ts
+++ b/common/antes.ts
@@ -5,7 +5,7 @@ import { User } from './user'
 import { LiquidityProvision } from './liquidity-provision'
 import { noFees } from './fees'
 
-export const FIXED_ANTE = 50
+export const FIXED_ANTE = 100
 
 // deprecated
 export const PHANTOM_ANTE = 0.001

From 5cb6ee3bca43a4ad071e1146a00805a75c482a5b Mon Sep 17 00:00:00 2001
From: mantikoros <sgrugett@gmail.com>
Date: Fri, 29 Apr 2022 15:58:01 -0400
Subject: [PATCH 13/14] daily free markets' liquidity provided by
 @ManifoldMarkets

---
 common/antes.ts                          | 6 ++++--
 functions/src/create-contract.ts         | 5 ++++-
 functions/src/scripts/migrate-to-cfmm.ts | 2 +-
 3 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/common/antes.ts b/common/antes.ts
index a443f508..c77308f4 100644
--- a/common/antes.ts
+++ b/common/antes.ts
@@ -11,8 +11,10 @@ export const FIXED_ANTE = 100
 export const PHANTOM_ANTE = 0.001
 export const MINIMUM_ANTE = 50
 
+export const HOUSE_LIQUIDITY_PROVIDER_ID = 'IPTOzEqrpkWmEzh6hwvAyY9PqFb2' // @ManifoldMarkets' id
+
 export function getCpmmInitialLiquidity(
-  creator: User,
+  providerId: string,
   contract: FullContract<CPMM, Binary>,
   anteId: string,
   amount: number
@@ -21,7 +23,7 @@ export function getCpmmInitialLiquidity(
 
   const lp: LiquidityProvision = {
     id: anteId,
-    userId: creator.id,
+    userId: providerId,
     contractId: contract.id,
     createdTime,
     isAnte: true,
diff --git a/functions/src/create-contract.ts b/functions/src/create-contract.ts
index 781337f7..ae7b0ad8 100644
--- a/functions/src/create-contract.ts
+++ b/functions/src/create-contract.ts
@@ -22,6 +22,7 @@ import {
   getAnteBets,
   getCpmmInitialLiquidity,
   getFreeAnswerAnte,
+  HOUSE_LIQUIDITY_PROVIDER_ID,
   MINIMUM_ANTE,
 } from '../../common/antes'
 import { getNoneAnswer } from '../../common/answer'
@@ -144,8 +145,10 @@ export const createContract = functions
             .collection(`contracts/${contract.id}/liquidity`)
             .doc()
 
+          const providerId = isFree ? HOUSE_LIQUIDITY_PROVIDER_ID : creator.id
+
           const lp = getCpmmInitialLiquidity(
-            creator,
+            providerId,
             contract as FullContract<CPMM, Binary>,
             liquidityDoc.id,
             ante
diff --git a/functions/src/scripts/migrate-to-cfmm.ts b/functions/src/scripts/migrate-to-cfmm.ts
index cd9177a3..874011ca 100644
--- a/functions/src/scripts/migrate-to-cfmm.ts
+++ b/functions/src/scripts/migrate-to-cfmm.ts
@@ -106,7 +106,7 @@ async function recalculateContract(contractRef: DocRef, isCommit = false) {
     const liquidityDocRef = contractRef.collection('liquidity').doc()
 
     const lp = getCpmmInitialLiquidity(
-      { id: 'IPTOzEqrpkWmEzh6hwvAyY9PqFb2' } as User, // use @ManifoldMarkets' id
+      'IPTOzEqrpkWmEzh6hwvAyY9PqFb2', // use @ManifoldMarkets' id
       {
         ...contract,
         ...contractUpdate,

From 78997c1e45afcbb8b10dc7198306af4eb342d253 Mon Sep 17 00:00:00 2001
From: Boa <iansphilips@gmail.com>
Date: Fri, 29 Apr 2022 15:11:04 -0600
Subject: [PATCH 14/14] Show comments position (#110)

* Add betting activity back to feed

* Show position in bin. markets, no comments on bets

* Degroup bets on Bets tab

* Show users position or recent bet with comments

* Add tooltip on answer to FR comments

* Style improvements

* Only use bets by current user for comment input
---
 web/components/feed/activity-items.ts   |  91 ++++---
 web/components/feed/feed-items.tsx      | 328 +++++++++++++++++-------
 web/components/outcome-label.tsx        |  34 ++-
 web/pages/[username]/[contractSlug].tsx |   2 +-
 4 files changed, 308 insertions(+), 147 deletions(-)

diff --git a/web/components/feed/activity-items.ts b/web/components/feed/activity-items.ts
index a12c4e0a..7879b637 100644
--- a/web/components/feed/activity-items.ts
+++ b/web/components/feed/activity-items.ts
@@ -31,6 +31,8 @@ type BaseActivityItem = {
 
 export type CommentInputItem = BaseActivityItem & {
   type: 'commentInput'
+  betsByCurrentUser: Bet[]
+  comments: Comment[]
 }
 
 export type DescriptionItem = BaseActivityItem & {
@@ -48,12 +50,13 @@ export type BetItem = BaseActivityItem & {
   bet: Bet
   hideOutcome: boolean
   smallAvatar: boolean
+  hideComment?: boolean
 }
 
 export type CommentItem = BaseActivityItem & {
   type: 'comment'
   comment: Comment
-  bet: Bet | undefined
+  betsBySameUser: Bet[]
   hideOutcome: boolean
   truncate: boolean
   smallAvatar: boolean
@@ -129,7 +132,7 @@ function groupBets(
           type: 'comment' as const,
           id: bet.id,
           comment,
-          bet,
+          betsBySameUser: [bet],
           contract,
           hideOutcome,
           truncate: abbreviated,
@@ -280,7 +283,7 @@ function groupBetsAndComments(
       id: comment.id,
       contract: contract,
       comment,
-      bet: undefined,
+      betsBySameUser: [],
       truncate: abbreviated,
       hideOutcome: true,
       smallAvatar,
@@ -308,6 +311,27 @@ function groupBetsAndComments(
   return abbrItems
 }
 
+function getCommentsWithPositions(
+  bets: Bet[],
+  comments: Comment[],
+  contract: Contract
+) {
+  const betsByUserId = _.groupBy(bets, (bet) => bet.userId)
+
+  const items = comments.map((comment) => ({
+    type: 'comment' as const,
+    id: comment.id,
+    contract: contract,
+    comment,
+    betsBySameUser: bets.length === 0 ? [] : betsByUserId[comment.userId] ?? [],
+    truncate: true,
+    hideOutcome: false,
+    smallAvatar: false,
+  }))
+
+  return items
+}
+
 export function getAllContractActivityItems(
   contract: Contract,
   bets: Bet[],
@@ -361,6 +385,8 @@ export function getAllContractActivityItems(
       type: 'commentInput',
       id: 'commentInput',
       contract,
+      betsByCurrentUser: [],
+      comments: [],
     })
   } else {
     items.push(
@@ -385,6 +411,8 @@ export function getAllContractActivityItems(
       type: 'commentInput',
       id: 'commentInput',
       contract,
+      betsByCurrentUser: [],
+      comments: [],
     })
   }
 
@@ -432,24 +460,13 @@ export function getRecentContractActivityItems(
       )
     )
   } else {
-    const onlyUsersBetsOrBetsWithComments = bets.filter((bet) =>
-      comments.some(
-        (comment) => comment.betId === bet.id || bet.userId === user?.id
-      )
-    )
     items.push(
-      ...groupBetsAndComments(
-        onlyUsersBetsOrBetsWithComments,
-        comments,
-        contract,
-        user?.id,
-        {
-          hideOutcome: false,
-          abbreviated: true,
-          smallAvatar: false,
-          reversed: true,
-        }
-      )
+      ...groupBetsAndComments(bets, comments, contract, user?.id, {
+        hideOutcome: false,
+        abbreviated: true,
+        smallAvatar: false,
+        reversed: true,
+      })
     )
   }
 
@@ -471,37 +488,29 @@ export function getSpecificContractActivityItems(
   switch (mode) {
     case 'bets':
       items.push(
-        ...groupBets(bets, comments, contract, user?.id, {
+        ...bets.map((bet) => ({
+          type: 'bet' as const,
+          id: bet.id,
+          bet,
+          contract,
           hideOutcome: false,
-          abbreviated: false,
           smallAvatar: false,
-          reversed: false,
-        })
+          hideComment: true,
+        }))
       )
       break
 
     case 'comments':
-      const onlyBetsWithComments = bets.filter((bet) =>
-        comments.some((comment) => comment.betId === bet.id)
-      )
-      items.push(
-        ...groupBetsAndComments(
-          onlyBetsWithComments,
-          comments,
-          contract,
-          user?.id,
-          {
-            hideOutcome: false,
-            abbreviated: false,
-            smallAvatar: false,
-            reversed: false,
-          }
-        )
-      )
+      items.push(...getCommentsWithPositions(bets, comments, contract))
+
       items.push({
         type: 'commentInput',
         id: 'commentInput',
         contract,
+        betsByCurrentUser: user
+          ? bets.filter((bet) => bet.userId === user.id)
+          : [],
+        comments: comments,
       })
       break
   }
diff --git a/web/components/feed/feed-items.tsx b/web/components/feed/feed-items.tsx
index 7518c998..584907d9 100644
--- a/web/components/feed/feed-items.tsx
+++ b/web/components/feed/feed-items.tsx
@@ -39,7 +39,13 @@ import BetRow from '../bet-row'
 import { Avatar } from '../avatar'
 import { Answer } from '../../../common/answer'
 import { ActivityItem } from './activity-items'
-import { FreeResponse, FullContract } from '../../../common/contract'
+import {
+  Binary,
+  CPMM,
+  DPM,
+  FreeResponse,
+  FullContract,
+} from '../../../common/contract'
 import { BuyButton } from '../yes-no-selector'
 import { getDpmOutcomeProbability } from '../../../common/calculate-dpm'
 import { AnswerBetPanel } from '../answers/answer-bet-panel'
@@ -50,6 +56,7 @@ import { trackClick } from '../../lib/firebase/tracking'
 import { firebaseLogin } from '../../lib/firebase/users'
 import { DAY_MS } from '../../../common/util/time'
 import NewContractBadge from '../new-contract-badge'
+import { calculateCpmmSale } from '../../../common/calculate-cpmm'
 
 export function FeedItems(props: {
   contract: Contract
@@ -123,21 +130,38 @@ function FeedItem(props: { item: ActivityItem }) {
 export function FeedComment(props: {
   contract: Contract
   comment: Comment
-  bet: Bet | undefined
+  betsBySameUser: Bet[]
   hideOutcome: boolean
   truncate: boolean
   smallAvatar: boolean
 }) {
-  const { contract, comment, bet, hideOutcome, truncate, smallAvatar } = props
-  let money: string | undefined
-  let outcome: string | undefined
-  let bought: string | undefined
-  if (bet) {
-    outcome = bet.outcome
-    bought = bet.amount >= 0 ? 'bought' : 'sold'
-    money = formatMoney(Math.abs(bet.amount))
-  }
+  const {
+    contract,
+    comment,
+    betsBySameUser,
+    hideOutcome,
+    truncate,
+    smallAvatar,
+  } = props
   const { text, userUsername, userName, userAvatarUrl, createdTime } = comment
+  let outcome: string | undefined,
+    bought: string | undefined,
+    money: string | undefined
+
+  const matchedBet = betsBySameUser.find((bet) => bet.id === comment.betId)
+  if (matchedBet) {
+    outcome = matchedBet.outcome
+    bought = matchedBet.amount >= 0 ? 'bought' : 'sold'
+    money = formatMoney(Math.abs(matchedBet.amount))
+  }
+
+  // Only calculated if they don't have a matching bet
+  const { userPosition, userPositionMoney, yesFloorShares, noFloorShares } =
+    getBettorsPosition(
+      contract,
+      comment.createdTime,
+      matchedBet ? [] : betsBySameUser
+    )
 
   return (
     <>
@@ -155,18 +179,33 @@ export function FeedComment(props: {
               username={userUsername}
               name={userName}
             />{' '}
-            {bought} {money}
-            {!hideOutcome && (
+            {!matchedBet && userPosition > 0 && (
               <>
-                {' '}
-                of{' '}
-                <OutcomeLabel
-                  outcome={outcome ? outcome : ''}
-                  contract={contract}
-                  truncate="short"
-                />
+                {'with ' + userPositionMoney + ' '}
+                <>
+                  {' of '}
+                  <OutcomeLabel
+                    outcome={yesFloorShares > noFloorShares ? 'YES' : 'NO'}
+                    contract={contract}
+                    truncate="short"
+                  />
+                </>
               </>
             )}
+            <>
+              {bought} {money}
+              {outcome && !hideOutcome && (
+                <>
+                  {' '}
+                  of{' '}
+                  <OutcomeLabel
+                    outcome={outcome ? outcome : ''}
+                    contract={contract}
+                    truncate="short"
+                  />
+                </>
+              )}
+            </>
             <RelativeTimestamp time={createdTime} />
           </p>
         </div>
@@ -180,20 +219,12 @@ export function FeedComment(props: {
   )
 }
 
-function RelativeTimestamp(props: { time: number }) {
-  const { time } = props
-  return (
-    <DateTimeTooltip time={time}>
-      <span className="ml-1 whitespace-nowrap text-gray-400">
-        {fromNow(time)}
-      </span>
-    </DateTimeTooltip>
-  )
-}
-
-export function CommentInput(props: { contract: Contract }) {
-  // see if we can comment input on any bet:
-  const { contract } = props
+export function CommentInput(props: {
+  contract: Contract
+  betsByCurrentUser: Bet[]
+  comments: Comment[]
+}) {
+  const { contract, betsByCurrentUser, comments } = props
   const user = useUser()
   const [comment, setComment] = useState('')
 
@@ -206,14 +237,50 @@ export function CommentInput(props: { contract: Contract }) {
     setComment('')
   }
 
+  // Should this be oldest bet or most recent bet?
+  const mostRecentCommentableBet = betsByCurrentUser
+    .filter(
+      (bet) =>
+        canCommentOnBet(bet.userId, bet.createdTime, user) &&
+        !comments.some((comment) => comment.betId == bet.id)
+    )
+    .sort((b1, b2) => b1.createdTime - b2.createdTime)
+    .pop()
+
+  if (mostRecentCommentableBet) {
+    return (
+      <FeedBet
+        contract={contract}
+        bet={mostRecentCommentableBet}
+        hideOutcome={false}
+        smallAvatar={false}
+      />
+    )
+  }
+  const { userPosition, userPositionMoney, yesFloorShares, noFloorShares } =
+    getBettorsPosition(contract, Date.now(), betsByCurrentUser)
+
   return (
     <>
-      <Row className={'flex w-full gap-2 pt-5'}>
+      <Row className={'flex w-full gap-2 pt-3'}>
         <div>
           <Avatar avatarUrl={user?.avatarUrl} username={user?.username} />
         </div>
         <div className={'min-w-0 flex-1 py-1.5'}>
           <div className="text-sm text-gray-500">
+            {user && userPosition > 0 && (
+              <>
+                {'You with ' + userPositionMoney + ' '}
+                <>
+                  {' of '}
+                  <OutcomeLabel
+                    outcome={yesFloorShares > noFloorShares ? 'YES' : 'NO'}
+                    contract={contract}
+                    truncate="short"
+                  />
+                </>
+              </>
+            )}
             <div className="mt-2">
               <Textarea
                 value={comment}
@@ -244,18 +311,76 @@ export function CommentInput(props: { contract: Contract }) {
   )
 }
 
+function RelativeTimestamp(props: { time: number }) {
+  const { time } = props
+  return (
+    <DateTimeTooltip time={time}>
+      <span className="ml-1 whitespace-nowrap text-gray-400">
+        {fromNow(time)}
+      </span>
+    </DateTimeTooltip>
+  )
+}
+
+function getBettorsPosition(
+  contract: Contract,
+  createdTime: number,
+  bets: Bet[]
+) {
+  let yesFloorShares = 0,
+    yesShares = 0,
+    noShares = 0,
+    noFloorShares = 0
+
+  const emptyReturn = {
+    userPosition: 0,
+    userPositionMoney: 0,
+    yesFloorShares,
+    noFloorShares,
+  }
+
+  // TODO: show which of the answers was their majority stake at time of comment for FR?
+  if (contract.outcomeType != 'BINARY') {
+    return emptyReturn
+  }
+  if (bets.length === 0) {
+    return emptyReturn
+  }
+
+  // Calculate the majority shares they had when they made the comment
+  const betsBefore = bets.filter((prevBet) => prevBet.createdTime < createdTime)
+  const [yesBets, noBets] = _.partition(
+    betsBefore ?? [],
+    (bet) => bet.outcome === 'YES'
+  )
+  yesShares = _.sumBy(yesBets, (bet) => bet.shares)
+  noShares = _.sumBy(noBets, (bet) => bet.shares)
+  yesFloorShares = Math.floor(yesShares)
+  noFloorShares = Math.floor(noShares)
+
+  const userPosition = yesFloorShares || noFloorShares
+  const { saleValue } = calculateCpmmSale(
+    contract as FullContract<CPMM, Binary>,
+    yesShares || noShares,
+    yesFloorShares > noFloorShares ? 'YES' : 'NO'
+  )
+  const userPositionMoney = formatMoney(Math.abs(saleValue))
+  return { userPosition, userPositionMoney, yesFloorShares, noFloorShares }
+}
+
 export function FeedBet(props: {
   contract: Contract
   bet: Bet
   hideOutcome: boolean
   smallAvatar: boolean
+  hideComment?: boolean
   bettor?: User // If set: reveal bettor identity
 }) {
-  const { contract, bet, hideOutcome, smallAvatar, bettor } = props
+  const { contract, bet, hideOutcome, smallAvatar, bettor, hideComment } = props
   const { id, amount, outcome, createdTime, userId } = bet
   const user = useUser()
   const isSelf = user?.id === userId
-  const canComment = canCommentOnBet(userId, createdTime, user)
+  const canComment = canCommentOnBet(userId, createdTime, user) && !hideComment
 
   const [comment, setComment] = useState('')
   async function submitComment() {
@@ -268,71 +393,76 @@ export function FeedBet(props: {
 
   return (
     <>
-      <div>
-        {isSelf ? (
-          <Avatar
-            className={clsx(smallAvatar && 'ml-1')}
-            size={smallAvatar ? 'sm' : undefined}
-            avatarUrl={user.avatarUrl}
-            username={user.username}
-          />
-        ) : bettor ? (
-          <Avatar
-            className={clsx(smallAvatar && 'ml-1')}
-            size={smallAvatar ? 'sm' : undefined}
-            avatarUrl={bettor.avatarUrl}
-            username={bettor.username}
-          />
-        ) : (
-          <div className="relative px-1">
-            <div className="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200">
-              <UserIcon className="h-5 w-5 text-gray-500" aria-hidden="true" />
-            </div>
-          </div>
-        )}
-      </div>
-      <div className={'min-w-0 flex-1 py-1.5'}>
-        <div className="text-sm text-gray-500">
-          <span>{isSelf ? 'You' : bettor ? bettor.name : 'A trader'}</span>{' '}
-          {bought} {money}
-          {!hideOutcome && (
-            <>
-              {' '}
-              of{' '}
-              <OutcomeLabel
-                outcome={outcome}
-                contract={contract}
-                truncate="short"
-              />
-            </>
-          )}
-          <RelativeTimestamp time={createdTime} />
-          {(canComment || comment) && (
-            <div className="mt-2">
-              <Textarea
-                value={comment}
-                onChange={(e) => setComment(e.target.value)}
-                className="textarea textarea-bordered w-full resize-none"
-                placeholder="Add a comment..."
-                rows={3}
-                maxLength={MAX_COMMENT_LENGTH}
-                onKeyDown={(e) => {
-                  if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
-                    submitComment()
-                  }
-                }}
-              />
-              <button
-                className="btn btn-outline btn-sm text-transform: mt-1 capitalize"
-                onClick={submitComment}
-                disabled={!canComment}
-              >
-                Comment
-              </button>
+      <Row className={'flex w-full gap-2 pt-3'}>
+        <div>
+          {isSelf ? (
+            <Avatar
+              className={clsx(smallAvatar && 'ml-1')}
+              size={smallAvatar ? 'sm' : undefined}
+              avatarUrl={user.avatarUrl}
+              username={user.username}
+            />
+          ) : bettor ? (
+            <Avatar
+              className={clsx(smallAvatar && 'ml-1')}
+              size={smallAvatar ? 'sm' : undefined}
+              avatarUrl={bettor.avatarUrl}
+              username={bettor.username}
+            />
+          ) : (
+            <div className="relative px-1">
+              <div className="flex h-8 w-8 items-center justify-center rounded-full bg-gray-200">
+                <UserIcon
+                  className="h-5 w-5 text-gray-500"
+                  aria-hidden="true"
+                />
+              </div>
             </div>
           )}
         </div>
-      </div>
+        <div className={'min-w-0 flex-1 py-1.5'}>
+          <div className="text-sm text-gray-500">
+            <span>{isSelf ? 'You' : bettor ? bettor.name : 'A trader'}</span>{' '}
+            {bought} {money}
+            {!hideOutcome && (
+              <>
+                {' '}
+                of{' '}
+                <OutcomeLabel
+                  outcome={outcome}
+                  contract={contract}
+                  truncate="short"
+                />
+              </>
+            )}
+            <RelativeTimestamp time={createdTime} />
+            {(canComment || comment) && (
+              <div className="mt-2">
+                <Textarea
+                  value={comment}
+                  onChange={(e) => setComment(e.target.value)}
+                  className="textarea textarea-bordered w-full resize-none"
+                  placeholder="Add a comment..."
+                  rows={3}
+                  maxLength={MAX_COMMENT_LENGTH}
+                  onKeyDown={(e) => {
+                    if (e.key === 'Enter' && (e.ctrlKey || e.metaKey)) {
+                      submitComment()
+                    }
+                  }}
+                />
+                <button
+                  className="btn btn-outline btn-sm text-transform: mt-1 capitalize"
+                  onClick={submitComment}
+                  disabled={!canComment}
+                >
+                  Comment
+                </button>
+              </div>
+            )}
+          </div>
+        </div>
+      </Row>
     </>
   )
 }
diff --git a/web/components/outcome-label.tsx b/web/components/outcome-label.tsx
index 0901dd4e..b2bc2f03 100644
--- a/web/components/outcome-label.tsx
+++ b/web/components/outcome-label.tsx
@@ -1,4 +1,3 @@
-import clsx from 'clsx'
 import { Answer } from '../../common/answer'
 import { getProbability } from '../../common/calculate'
 import {
@@ -11,6 +10,7 @@ import {
   FullContract,
 } from '../../common/contract'
 import { formatPercent } from '../../common/util/format'
+import { ClientRender } from './client-render'
 
 export function OutcomeLabel(props: {
   contract: Contract
@@ -72,11 +72,13 @@ export function FreeResponseOutcomeLabel(props: {
   const chosen = answers?.find((answer) => answer.id === resolution)
   if (!chosen) return <AnswerNumberLabel number={resolution} />
   return (
-    <AnswerLabel
-      answer={chosen}
-      truncate={truncate}
-      className={answerClassName}
-    />
+    <FreeResponseAnswerToolTip text={chosen.text}>
+      <AnswerLabel
+        answer={chosen}
+        truncate={truncate}
+        className={answerClassName}
+      />
+    </FreeResponseAnswerToolTip>
   )
 }
 
@@ -126,3 +128,23 @@ export function AnswerLabel(props: {
 
   return <span className={className}>{truncated}</span>
 }
+
+function FreeResponseAnswerToolTip(props: {
+  text: string
+  children?: React.ReactNode
+}) {
+  const { text } = props
+  return (
+    <>
+      <ClientRender>
+        <span
+          className="tooltip hidden cursor-default sm:inline-block"
+          data-tip={text}
+        >
+          {props.children}
+        </span>
+      </ClientRender>
+      <span className="whitespace-nowrap sm:hidden">{props.children}</span>
+    </>
+  )
+}
diff --git a/web/pages/[username]/[contractSlug].tsx b/web/pages/[username]/[contractSlug].tsx
index 6e6e4523..29786703 100644
--- a/web/pages/[username]/[contractSlug].tsx
+++ b/web/pages/[username]/[contractSlug].tsx
@@ -287,7 +287,7 @@ function ContractTopTrades(props: {
             <FeedComment
               contract={contract}
               comment={commentsById[topCommentId]}
-              bet={betsById[topCommentId]}
+              betsBySameUser={[betsById[topCommentId]]}
               hideOutcome={false}
               truncate={false}
               smallAvatar={false}