open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Render graph with bets from static props immediately

Browse Source
This commit is contained in:
James Grugett 2022-02-10 14:36:15 -06:00
parent bcc011c1fd
commit 9b50d67313
3 changed files with 31 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
web/components/contract-overview.tsx
View File

@ -86,7 +86,7 @@ export const ContractOverview = (props: {
<Spacer h={4} /> <Spacer h={4} />
<ContractProbGraph contract={contract} /> <ContractProbGraph contract={contract} bets={bets} />
<Row className="hidden sm:flex justify-between items-center mt-6 ml-4 gap-4"> <Row className="hidden sm:flex justify-between items-center mt-6 ml-4 gap-4">
{folds.length === 0 ? ( {folds.length === 0 ? (

22
web/components/contract-prob-graph.tsx
View File

@ -1,26 +1,26 @@
import { DatumValue } from '@nivo/core' import { DatumValue } from '@nivo/core'
import { ResponsiveLine } from '@nivo/line' import { ResponsiveLine } from '@nivo/line'
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { Bet } from '../../common/bet'
import { getProbability } from '../../common/calculate' 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 { useWindowSize } from '../hooks/use-window-size'
import { withoutAnteBets } from '../lib/firebase/bets'
import { Contract } from '../lib/firebase/contracts' import { Contract } from '../lib/firebase/contracts'
export function ContractProbGraph(props: { contract: Contract }) { export function ContractProbGraph(props: { contract: Contract; bets: Bet[] }) {
const { contract } = props const { contract } = props
const { id, phantomShares, resolutionTime, closeTime } = contract const { phantomShares, resolutionTime, closeTime } = contract
let bets = useBets(id) ?? [] const bets = useBetsWithoutAntes(contract, props.bets)
bets = withoutAnteBets(contract, bets)
const startProb = getProbability(phantomShares) const startProb = getProbability(phantomShares)
const times = [ const times = bets
contract.createdTime, ? [contract.createdTime, ...bets.map((bet) => bet.createdTime)].map(
...bets.map((bet) => bet.createdTime), (time) => new Date(time)
].map((time) => new Date(time)) )
const probs = [startProb, ...bets.map((bet) => bet.probAfter)] : []
const probs = bets ? [startProb, ...bets.map((bet) => bet.probAfter)] : []
const isClosed = !!closeTime && Date.now() > closeTime const isClosed = !!closeTime && Date.now() > closeTime
const latestTime = dayjs( const latestTime = dayjs(

20
web/hooks/use-bets.ts
View File

@ -1,5 +1,6 @@
import { useEffect, useState } from 'react' 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) => { export const useBets = (contractId: string) => {
const [bets, setBets] = useState<Bet[] | undefined>() const [bets, setBets] = useState<Bet[] | undefined>()
@ -10,3 +11,20 @@ export const useBets = (contractId: string) => {
return bets return bets
} }
export const useBetsWithoutAntes = (
contract: Contract,
initialBets?: Bet[]
) => {
const [bets, setBets] = useState<Bet[] | undefined>(
withoutAnteBets(contract, initialBets)
)
useEffect(() => {
return listenForBets(contract.id, (bets) => {
setBets(withoutAnteBets(contract, bets))
})
}, [contract])
return bets
}