diff --git a/web/components/contract-card.tsx b/web/components/contract-card.tsx index 3e39d1c7..d40089d7 100644 --- a/web/components/contract-card.tsx +++ b/web/components/contract-card.tsx @@ -13,6 +13,7 @@ import { Col } from './layout/col' import { parseTags } from '../lib/util/parse' import dayjs from 'dayjs' import { TrendingUpIcon } from '@heroicons/react/solid' +import { DateTimeTooltip } from './datetime-tooltip' export function ContractCard(props: { contract: Contract @@ -143,14 +144,26 @@ export function ContractDetails(props: { contract: Contract }) { />
- {resolvedDate ? `${createdDate} - ${resolvedDate}` : createdDate} + + {createdDate} + + {resolvedDate && contract.resolutionTime ? ( + <> + {' - '} + + {resolvedDate} + + + ) : null}
{!resolvedDate && closeTime && ( <>
{closeTime > Date.now() ? 'Closes' : 'Closed'}{' '} - {dayjs(closeTime).format('MMM D, YYYY')} + + {dayjs(closeTime).format('MMM D, YYYY')} +
)} diff --git a/web/components/contract-feed.tsx b/web/components/contract-feed.tsx index c74efbb2..4a25e4c6 100644 --- a/web/components/contract-feed.tsx +++ b/web/components/contract-feed.tsx @@ -32,6 +32,7 @@ import { ResolutionOrChance } from './contract-card' import { SiteLink } from './site-link' import { Col } from './layout/col' import { UserLink } from './user-page' +import { DateTimeTooltip } from './datetime-tooltip' dayjs.extend(relativeTime) function FeedComment(props: { activityItem: any }) { @@ -75,12 +76,11 @@ function FeedComment(props: { activityItem: any }) { function Timestamp(props: { time: number }) { const { time } = props return ( - - {dayjs(time).fromNow()} - + + + {dayjs(time).fromNow()} + + ) } diff --git a/web/components/datetime-tooltip.tsx b/web/components/datetime-tooltip.tsx new file mode 100644 index 00000000..522d4da1 --- /dev/null +++ b/web/components/datetime-tooltip.tsx @@ -0,0 +1,23 @@ +import dayjs from 'dayjs' +import utc from 'dayjs/plugin/utc' +import timezone from 'dayjs/plugin/timezone' +import advanced from 'dayjs/plugin/advancedFormat' + +dayjs.extend(utc) +dayjs.extend(timezone) +dayjs.extend(advanced) + +export function DateTimeTooltip(props: { + time: number + children?: React.ReactNode +}) { + const { time } = props + return ( + + {props.children} + + ) +}