import Link from 'next/link' import { Col } from '../components/layout/col' import { Row } from '../components/layout/row' import { useEffect, useState } from 'react' import { useUser } from '../hooks/use-user' import { compute, Contract, listContracts } from '../lib/firebase/contracts' import { formatMoney } from '../lib/util/format' export function ContractDetails(props: { contract: Contract }) { const { contract } = props const { volume, createdDate, resolvedDate } = compute(contract) return (
By {contract.creatorName}
{resolvedDate ? `${createdDate} - ${resolvedDate}` : createdDate}
{formatMoney(volume)} pot
) } function ContractCard(props: { contract: Contract }) { const { contract } = props const { probPercent } = compute(contract) const resolutionColor = { YES: 'text-primary', NO: 'text-red-400', CANCEL: 'text-yellow-400', '': '', // Empty if unresolved }[contract.resolution || ''] const resolutionText = { YES: 'YES', NO: 'NO', CANCEL: 'N/A', '': '', }[contract.resolution || ''] return (
  • {/* Left side of card */}

    {contract.question}

    {/* Right side of card */} {resolutionText || (
    {probPercent}
    chance
    )}
  • ) } export function ContractsGrid(props: { contracts: Contract[] }) { const { contracts } = props return ( ) } export function ContractsList(props: {}) { const creator = useUser() const [contracts, setContracts] = useState([]) useEffect(() => { if (creator?.id) { // TODO: stream changes from firestore listContracts(creator.id).then(setContracts) } }, [creator]) return }