diff --git a/web/components/contract-overview.tsx b/web/components/contract-overview.tsx
index 3528a727..abee76f2 100644
--- a/web/components/contract-overview.tsx
+++ b/web/components/contract-overview.tsx
@@ -86,7 +86,7 @@ export const ContractOverview = (props: {
-
+
{folds.length === 0 ? (
diff --git a/web/components/contract-prob-graph.tsx b/web/components/contract-prob-graph.tsx
index fceffd97..13e6c48d 100644
--- a/web/components/contract-prob-graph.tsx
+++ b/web/components/contract-prob-graph.tsx
@@ -1,26 +1,26 @@
import { DatumValue } from '@nivo/core'
import { ResponsiveLine } from '@nivo/line'
import dayjs from 'dayjs'
+import { Bet } from '../../common/bet'
import { getProbability } from '../../common/calculate'
-import { useBets } from '../hooks/use-bets'
+import { useBetsWithoutAntes } from '../hooks/use-bets'
import { useWindowSize } from '../hooks/use-window-size'
-import { withoutAnteBets } from '../lib/firebase/bets'
import { Contract } from '../lib/firebase/contracts'
-export function ContractProbGraph(props: { contract: Contract }) {
+export function ContractProbGraph(props: { contract: Contract; bets: Bet[] }) {
const { contract } = props
- const { id, phantomShares, resolutionTime, closeTime } = contract
+ const { phantomShares, resolutionTime, closeTime } = contract
- let bets = useBets(id) ?? []
- bets = withoutAnteBets(contract, bets)
+ const bets = useBetsWithoutAntes(contract, props.bets)
const startProb = getProbability(phantomShares)
- const times = [
- contract.createdTime,
- ...bets.map((bet) => bet.createdTime),
- ].map((time) => new Date(time))
- const probs = [startProb, ...bets.map((bet) => bet.probAfter)]
+ const times = bets
+ ? [contract.createdTime, ...bets.map((bet) => bet.createdTime)].map(
+ (time) => new Date(time)
+ )
+ : []
+ const probs = bets ? [startProb, ...bets.map((bet) => bet.probAfter)] : []
const isClosed = !!closeTime && Date.now() > closeTime
const latestTime = dayjs(
diff --git a/web/hooks/use-bets.ts b/web/hooks/use-bets.ts
index 6ab9eb21..4d892ff6 100644
--- a/web/hooks/use-bets.ts
+++ b/web/hooks/use-bets.ts
@@ -1,5 +1,6 @@
import { useEffect, useState } from 'react'
-import { Bet, listenForBets } from '../lib/firebase/bets'
+import { Contract } from '../../common/contract'
+import { Bet, listenForBets, withoutAnteBets } from '../lib/firebase/bets'
export const useBets = (contractId: string) => {
const [bets, setBets] = useState()
@@ -10,3 +11,20 @@ export const useBets = (contractId: string) => {
return bets
}
+
+export const useBetsWithoutAntes = (
+ contract: Contract,
+ initialBets?: Bet[]
+) => {
+ const [bets, setBets] = useState(
+ withoutAnteBets(contract, initialBets)
+ )
+
+ useEffect(() => {
+ return listenForBets(contract.id, (bets) => {
+ setBets(withoutAnteBets(contract, bets))
+ })
+ }, [contract])
+
+ return bets
+}