import React, { useState } from 'react' import { compute, Contract, deleteContract, setContract, } from '../lib/firebase/contracts' import { Col } from './layout/col' import { Spacer } from './layout/spacer' import { ContractProbGraph } from './contract-prob-graph' import { ContractDetails } from './contracts-list' import router from 'next/router' import { useUser } from '../hooks/use-user' import { Row } from './layout/row' import dayjs from 'dayjs' import { Title } from './title' function ContractDescription(props: { contract: Contract isCreator: boolean }) { const { contract, isCreator } = props const [editing, setEditing] = useState(false) const editStatement = () => `EDIT (${dayjs().format('MMM D, H:mma')}): ` const [description, setDescription] = useState(editStatement()) // Append the new description (after a newline) async function saveDescription(e: any) { e.preventDefault() setEditing(false) contract.description = `${contract.description}\n${description}`.trim() await setContract(contract) setDescription(editStatement()) } return (
{contract.description}
{isCreator && !contract.resolution && (editing ? (
) : ( ))}
) } export const ContractOverview = (props: { contract: Contract className?: string }) => { const { contract, className } = props const { resolution, creatorId } = contract const { probPercent, volume } = compute(contract) const user = useUser() const isCreator = user?.id === creatorId const resolutionColor = { YES: 'text-primary', NO: 'text-red-400', CANCEL: 'text-yellow-400', '': '', // Empty if unresolved }[contract.resolution || ''] return (
{contract.question}
{resolution ? (
Resolved
{resolution}
) : ( {probPercent}
chance
)} {((isCreator && !contract.resolution) || contract.description) && ( )} {/* Show a delete button for contracts without any trading */} {isCreator && volume === 0 && ( <> )} ) }