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 getStaticProps({ 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: true,
// }
// }
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 && (
)}
)}
)
}