import { ContractsGrid, SearchableGrid, } from '../components/contract/contracts-list' import { Page } from '../components/page' import { SEO } from '../components/SEO' import { Title } from '../components/title' import { useContracts } from '../hooks/use-contracts' import { Contract } from '../lib/firebase/contracts' // TODO: Rename endpoint to "Explore" export default function Markets() { const contracts = useContracts() return ( ) } export const HotMarkets = (props: { contracts: Contract[] }) => { const { contracts } = props if (contracts.length === 0) return <> return (
<ContractsGrid contracts={contracts} showHotVolume /> </div> ) } export const ClosingSoonMarkets = (props: { contracts: Contract[] }) => { const { contracts } = props if (contracts.length === 0) return <></> return ( <div className="w-full rounded-lg border-2 border-green-100 bg-green-50 p-6 shadow-md"> <Title className="!mt-0" text="⏰ Closing soon" /> <ContractsGrid contracts={contracts} showCloseTime /> </div> ) }