Browse Source

Update tooltip

pull/307/head
Tilen Komel 1 year ago
parent
commit
44b8dd308a
  1. 27
      src/components/generic/TimeAgo.tsx

27
src/components/generic/TimeAgo.tsx

@ -1,3 +1,10 @@
import {
Tooltip,
TooltipContent,
TooltipPortal,
TooltipProvider,
TooltipTrigger,
} from "@radix-ui/react-tooltip";
import type { JSX } from "react";
export interface TimeAgoProps {
@ -38,8 +45,22 @@ const getTimeAgo = (
export const TimeAgo = ({ timestamp }: TimeAgoProps): JSX.Element => {
return (
<span title={new Date(timestamp).toLocaleString()}>
{getTimeAgo(timestamp)}
</span>
<TooltipProvider>
<Tooltip>
<TooltipTrigger>
<span>{getTimeAgo(timestamp)}</span>
</TooltipTrigger>
<TooltipPortal>
<TooltipContent
className="rounded-md bg-slate-800 px-3 py-1.5 text-sm text-white shadow-md animate-in fade-in-0 zoom-in-95"
side="top"
align="center"
sideOffset={5}
>
{new Date(timestamp).toLocaleString()}
</TooltipContent>
</TooltipPortal>
</Tooltip>
</TooltipProvider>
);
};

Loading…
Cancel
Save