import React from 'react'
import { useRouter } from 'next/router'
import Head from 'next/head'
import clsx from 'clsx'
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 { Contract, getContract } from '../../lib/firebase/contracts'
export async function getServerSideProps({ params }: { params: any }) {
console.log('params', params)
const contract = await getContract(params.contractId)
return {
props: {
contract: contract || null,
},
}
}
// export async function getStaticPaths() {
// return {
// paths: [],
// fallback: 'blocking',
// }
// }
export default function ContractPage({ contract }: { contract: Contract }) {
const user = useUser()
const router = useRouter()
const { contractId } = router.query as { contractId: string }
// const contract = useContract(contractId)
// if (contract === 'loading') {
// return
// }
// if (!contract) {
// return Contract not found...
// }
if (contract === null) {
return Contract not found...
}
if (!contract) return
const { creatorId, isResolved } = contract
const isCreator = user?.id === creatorId
return (
{contract.question}
{!isResolved && (
<>
{isCreator && (
)}
)}
)
}