import React from 'react' import { useRouter } from 'next/router' import { useContract } from '../../hooks/use-contract' import { Header } from '../../components/header' import { ContractOverview } from '../../components/contract-overview' import { BetPanel } from '../../components/bet-panel' import { Col } from '../../components/layout/col' import { useUser } from '../../hooks/use-user' import { ResolutionPanel } from '../../components/resolution-panel' import clsx from 'clsx' import { ContractBetsTable, MyBetsSummary } from '../../components/bets-list' import { useBets } from '../../hooks/use-bets' import { Title } from '../../components/title' import { Spacer } from '../../components/layout/spacer' import { Contract } from '../../lib/firebase/contracts' import { User } from '../../lib/firebase/users' export default function ContractPage() { const user = useUser() const router = useRouter() const { contractId } = router.query as { contractId: string } const contract = useContract(contractId) if (contract === 'loading') { return
} if (!contract) { return