diff --git a/web/hooks/use-contracts.ts b/web/hooks/use-contracts.ts index 6b2a5a9a..c99940d5 100644 --- a/web/hooks/use-contracts.ts +++ b/web/hooks/use-contracts.ts @@ -8,10 +8,12 @@ import { getUserBetContracts, getUserBetContractsQuery, trendingContractsQuery, + getContractsQuery, } from 'web/lib/firebase/contracts' import { useQueryClient } from 'react-query' import { MINUTE_MS } from 'common/util/time' import { query, limit } from 'firebase/firestore' +import { Sort } from 'web/components/contract-search' export const useContracts = () => { const [contracts, setContracts] = useState() @@ -31,6 +33,18 @@ export const useTrendingContracts = (maxContracts: number) => { return result.data } +export const useContractsQuery = ( + sort: Sort, + maxContracts: number, + filters: { groupSlug?: string } = {} +) => { + const result = useFirestoreQueryData( + ['contracts-query', sort, maxContracts, filters], + getContractsQuery(sort, maxContracts, filters) + ) + return result.data +} + export const useInactiveContracts = () => { const [contracts, setContracts] = useState() diff --git a/web/lib/firebase/contracts.ts b/web/lib/firebase/contracts.ts index 89af8235..58cb417f 100644 --- a/web/lib/firebase/contracts.ts +++ b/web/lib/firebase/contracts.ts @@ -24,6 +24,7 @@ import { Bet } from 'common/bet' import { Comment } from 'common/comment' import { ENV_CONFIG } from 'common/envs/constants' import { getBinaryProb } from 'common/contract-details' +import { Sort } from 'web/components/contract-search' export const contracts = coll('contracts') @@ -320,6 +321,50 @@ export const getTopGroupContracts = async ( return await getValues(creatorContractsQuery) } +const sortToField = { + newest: 'createdTime', + score: 'popularityScore', + 'most-traded': 'volume', + '24-hour-vol': 'volume24Hours', + 'prob-change-day': 'probChanges.day', + 'last-updated': 'lastUpdated', + liquidity: 'totalLiquidity', + 'close-date': 'closeTime', + 'resolve-date': 'resolutionTime', + 'prob-descending': 'prob', + 'prob-ascending': 'prob', +} as const + +const sortToDirection = { + newest: 'desc', + score: 'desc', + 'most-traded': 'desc', + '24-hour-vol': 'desc', + 'prob-change-day': 'desc', + 'last-updated': 'desc', + liquidity: 'desc', + 'close-date': 'asc', + 'resolve-date': 'desc', + 'prob-ascending': 'asc', + 'prob-descending': 'desc', +} as const + +export const getContractsQuery = ( + sort: Sort, + maxItems: number, + filters: { groupSlug?: string } = {} +) => { + const { groupSlug } = filters + return query( + contracts, + where('isResolved', '==', false), + where('visibility', '==', 'public'), + ...(groupSlug ? [where('groupSlugs', 'array-contains', groupSlug)] : []), + orderBy(sortToField[sort], sortToDirection[sort]), + limit(maxItems) + ) +} + export const getRecommendedContracts = async ( contract: Contract, excludeBettorId: string, diff --git a/web/pages/experimental/home/index.tsx b/web/pages/experimental/home/index.tsx index 9802224b..bf4a17e4 100644 --- a/web/pages/experimental/home/index.tsx +++ b/web/pages/experimental/home/index.tsx @@ -40,6 +40,8 @@ import { GroupCard } from 'web/pages/groups' import { chooseRandomSubset } from 'common/util/random' import { MenuButton } from 'web/components/nav/menu' import { hasCompletedStreakToday } from 'web/components/profile/betting-streak-modal' +import { useContractsQuery } from 'web/hooks/use-contracts' +import { ContractsGrid } from 'web/components/contract/contracts-grid' export default function Home() { const user = useUser() @@ -158,6 +160,8 @@ function GroupSection(props: { }) { const { group, user } = props + const contracts = useContractsQuery('score', 4, { groupSlug: group.slug }) + return ( @@ -180,14 +184,7 @@ function GroupSection(props: { ]} /> - + ) }