diff --git a/web/components/contract/contract-tabs.tsx b/web/components/contract/contract-tabs.tsx
index bd3204ed..33a3c05a 100644
--- a/web/components/contract/contract-tabs.tsx
+++ b/web/components/contract/contract-tabs.tsx
@@ -23,13 +23,15 @@ import {
HOUSE_LIQUIDITY_PROVIDER_ID,
} from 'common/antes'
import { buildArray } from 'common/util/array'
+import { ContractComment } from 'common/comment'
export function ContractTabs(props: {
contract: Contract
bets: Bet[]
userBets: Bet[]
+ comments: ContractComment[]
}) {
- const { contract, bets, userBets } = props
+ const { contract, bets, userBets, comments } = props
const yourTrades = (
@@ -42,7 +44,7 @@ export function ContractTabs(props: {
const tabs = buildArray(
{
title: 'Comments',
- content: ,
+ content: ,
},
{
title: capitalize(PAST_BETS),
@@ -61,10 +63,11 @@ export function ContractTabs(props: {
const CommentsTabContent = memo(function CommentsTabContent(props: {
contract: Contract
+ comments: ContractComment[]
}) {
const { contract } = props
const tips = useTipTxns({ contractId: contract.id })
- const comments = useComments(contract.id)
+ const comments = useComments(contract.id) ?? props.comments
if (comments == null) {
return
}
diff --git a/web/lib/firebase/comments.ts b/web/lib/firebase/comments.ts
index db4e8ede..733a1e06 100644
--- a/web/lib/firebase/comments.ts
+++ b/web/lib/firebase/comments.ts
@@ -131,7 +131,7 @@ function getCommentsOnPostCollection(postId: string) {
}
export async function listAllComments(contractId: string) {
- return await getValues(
+ return await getValues(
query(getCommentsCollection(contractId), orderBy('createdTime', 'desc'))
)
}
diff --git a/web/pages/[username]/[contractSlug].tsx b/web/pages/[username]/[contractSlug].tsx
index 1dde2f95..93b53447 100644
--- a/web/pages/[username]/[contractSlug].tsx
+++ b/web/pages/[username]/[contractSlug].tsx
@@ -46,6 +46,8 @@ import { BetSignUpPrompt } from 'web/components/sign-up-prompt'
import { PlayMoneyDisclaimer } from 'web/components/play-money-disclaimer'
import BetButton from 'web/components/bet-button'
import { BetsSummary } from 'web/components/bet-summary'
+import { listAllComments } from 'web/lib/firebase/comments'
+import { ContractComment } from 'common/comment'
export const getStaticProps = fromPropz(getStaticPropz)
export async function getStaticPropz(props: {
@@ -55,10 +57,15 @@ export async function getStaticPropz(props: {
const contract = (await getContractFromSlug(contractSlug)) || null
const contractId = contract?.id
const bets = contractId ? await listAllBets(contractId) : []
+ const comments = contractId ? await listAllComments(contractId) : []
return {
- // Limit the data sent to the client. Client will still load all bets directly.
- props: { contract, bets: bets.slice(0, 5000) },
+ props: {
+ contract,
+ // Limit the data sent to the client. Client will still load all bets/comments directly.
+ bets: bets.slice(0, 5000),
+ comments: comments.slice(0, 1000),
+ },
revalidate: 5, // regenerate after five seconds
}
}
@@ -70,9 +77,14 @@ export async function getStaticPaths() {
export default function ContractPage(props: {
contract: Contract | null
bets: Bet[]
+ comments: ContractComment[]
backToHome?: () => void
}) {
- props = usePropz(props, getStaticPropz) ?? { contract: null, bets: [] }
+ props = usePropz(props, getStaticPropz) ?? {
+ contract: null,
+ bets: [],
+ comments: [],
+ }
const inIframe = useIsIframe()
if (inIframe) {
@@ -147,7 +159,7 @@ export function ContractPageContent(
contract: Contract
}
) {
- const { backToHome } = props
+ const { backToHome, comments } = props
const contract = useContractWithPreload(props.contract) ?? props.contract
const user = useUser()
usePrefetch(user?.id)
@@ -258,7 +270,12 @@ export function ContractPageContent(
userBets={userBets}
/>
-
+
{!user ? (