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 { resolution } = contract
const resolutionColor =
resolution === 'YES'
? 'text-primary'
: resolution === 'NO'
? 'text-red-400'
: resolution === 'CANCEL'
? 'text-yellow-400'
: ''
return (
{/* Left side of card */}
{/* Right side of card */}
{contract.resolution || (
)}
)
}
export function ContractsGrid(props: { contracts: Contract[] }) {
const { contracts } = props
return (
{contracts.map((contract) => (
))}
{/* TODO: Show placeholder if empty */}
)
}
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
}