diff --git a/web/hooks/use-algo-feed.ts b/web/hooks/use-algo-feed.ts index 0a14779d..f424d40f 100644 --- a/web/hooks/use-algo-feed.ts +++ b/web/hooks/use-algo-feed.ts @@ -7,15 +7,16 @@ import { useTimeSinceFirstRender } from './use-time-since-first-render' import { trackLatency } from '../lib/firebase/tracking' import { User } from '../../common/user' import { getUserFeed } from '../lib/firebase/users' +import { useUpdatedContracts } from './use-contracts' + +type feed = { + contract: Contract + recentBets: Bet[] + recentComments: Comment[] +}[] export const useAlgoFeed = (user: User | null | undefined) => { - const [feed, setFeed] = useState< - { - contract: Contract - recentBets: Bet[] - recentComments: Comment[] - }[] - >() + const [feed, setFeed] = useState() const getTime = useTimeSinceFirstRender() @@ -28,7 +29,18 @@ export const useAlgoFeed = (user: User | null | undefined) => { console.log('feed load time', getTime()) }) } - }, [user, getTime]) + }, [user?.id]) - return feed + return useUpdateFeed(feed) +} + +const useUpdateFeed = (feed: feed | undefined) => { + const contracts = useUpdatedContracts(feed?.map((item) => item.contract)) + + return feed && contracts + ? feed.map(({ contract, ...other }, i) => ({ + ...other, + contract: contracts[i], + })) + : undefined } diff --git a/web/hooks/use-contracts.ts b/web/hooks/use-contracts.ts index c6d2be0e..3135d522 100644 --- a/web/hooks/use-contracts.ts +++ b/web/hooks/use-contracts.ts @@ -1,8 +1,9 @@ import _ from 'lodash' -import { useEffect, useState } from 'react' +import { useEffect, useRef, useState } from 'react' import { Contract, listenForActiveContracts, + listenForContract, listenForContracts, listenForHotContracts, listenForInactiveContracts, @@ -71,3 +72,34 @@ export const useHotContracts = () => { return hotContracts } + +export const useUpdatedContracts = (contracts: Contract[] | undefined) => { + const [__, triggerUpdate] = useState(0) + const contractDict = useRef<{ [id: string]: Contract }>({}) + + useEffect(() => { + if (contracts === undefined) return + + contractDict.current = _.fromPairs(contracts.map((c) => [c.id, c])) + + const disposes = contracts.map((contract) => { + const { id } = contract + + return listenForContract(id, (contract) => { + const curr = contractDict.current[id] + if (!_.isEqual(curr, contract)) { + contractDict.current[id] = contract as Contract + triggerUpdate((n) => n + 1) + } + }) + }) + + return () => { + disposes.forEach((dispose) => dispose()) + } + }, [!!contracts]) + + return contracts && Object.keys(contractDict.current).length > 0 + ? contracts.map((c) => contractDict.current[c.id]) + : undefined +}