30 lines
848 B
TypeScript
30 lines
848 B
TypeScript
'use client'
|
|
import Tooltip from "@components/tooltip"
|
|
import { timeAgo } from "@lib/time-ago"
|
|
import { useMemo, useState, useEffect } from "react"
|
|
import Badge from "../badge"
|
|
|
|
const CreatedAgoBadge = ({ createdAt }: { createdAt: string | Date }) => {
|
|
const createdDate = useMemo(() => new Date(createdAt), [createdAt])
|
|
const [time, setTimeAgo] = useState(timeAgo(createdDate))
|
|
|
|
useEffect(() => {
|
|
const interval = setInterval(() => {
|
|
setTimeAgo(timeAgo(createdDate))
|
|
}, 1000)
|
|
return () => clearInterval(interval)
|
|
}, [createdDate])
|
|
|
|
const formattedTime = `${createdDate.toLocaleDateString()} ${createdDate.toLocaleTimeString()}`
|
|
return (
|
|
// TODO: investigate tooltip not showing
|
|
<Tooltip content={formattedTime}>
|
|
<Badge type="secondary">
|
|
{" "}
|
|
<>{time}</>
|
|
</Badge>
|
|
</Tooltip>
|
|
)
|
|
}
|
|
|
|
export default CreatedAgoBadge
|