From 9976c1481ac79bbe93979895a06be10f6c95531e Mon Sep 17 00:00:00 2001
From: Gabriel Kaszewski <gabrielkaszewski@gmail.com>
Date: Fri, 15 May 2026 03:19:24 +0200
Subject: [PATCH] feat(frontend): show precise date on hover over relative
 timestamps

---
 thoughts-frontend/components/thought-card.tsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/thoughts-frontend/components/thought-card.tsx b/thoughts-frontend/components/thought-card.tsx
index 29c22a8..64e2152 100644
--- a/thoughts-frontend/components/thought-card.tsx
+++ b/thoughts-frontend/components/thought-card.tsx
@@ -8,7 +8,7 @@ import {
 } from "@/components/ui/card";
 import { UserAvatar } from "./user-avatar";
 import { deleteThought, Me, Thought } from "@/lib/api";
-import { formatDistanceToNow } from "date-fns";
+import { format, formatDistanceToNow } from "date-fns";
 import { useAuth } from "@/hooks/use-auth";
 import { useState } from "react";
 import { useRouter } from "next/navigation";
@@ -121,9 +121,13 @@ export function ThoughtCard({
               <span className="font-bold">
                 {author.displayName || author.username}
               </span>
-              <span className="text-sm text-muted-foreground text-shadow-sm">
+              <time
+                dateTime={new Date(thought.createdAt).toISOString()}
+                title={format(new Date(thought.createdAt), "PPP p")}
+                className="text-sm text-muted-foreground text-shadow-sm"
+              >
                 {timeAgo}
-              </span>
+              </time>
             </div>
           </Link>
           <DropdownMenu>