From 4012c1dacd2e37095e85412461d52db59951cc46 Mon Sep 17 00:00:00 2001
From: bhumika-cell <bhumikahunachyali777@gmail.com>
Date: Tue, 16 Jun 2026 20:18:26 +0530
Subject: [PATCH] feat: display note creation and last updated timestamps

---
 frontend/src/components/NoteCard.jsx  | 13 +++++++------
 frontend/src/lib/utils.js             | 12 +++++++++++-
 frontend/src/pages/NoteDetailPage.jsx | 10 ++++++++++
 3 files changed, 28 insertions(+), 7 deletions(-)

diff --git a/frontend/src/components/NoteCard.jsx b/frontend/src/components/NoteCard.jsx
index af53af4..e0eddb8 100644
--- a/frontend/src/components/NoteCard.jsx
+++ b/frontend/src/components/NoteCard.jsx
@@ -1,7 +1,7 @@
 
 import { PenSquareIcon, Trash2Icon } from "lucide-react";
 import { Link, useNavigate } from "react-router-dom";
-import { formatDate } from "../lib/utils";
+import { formatDateTime } from "../lib/utils";
 import api from "../lib/axios";
 import toast from "react-hot-toast";
 
@@ -53,12 +53,13 @@ const NoteCard = ({ note, setNotes }) => {
           {/* Footer */}
           <div className="flex items-center justify-between mt-2">
             {/* Date */}
-            <div className="flex items-center gap-1.5">
-              <svg className="w-3.5 h-3.5 text-gray-400 dark:text-gray-500" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                <path strokeLinecap="round" strokeLinejoin="round" strokeWidth="2" d="M8 7V3m8 4V3m-9 8h10M5 21h14a2 2 0 002-2V7a2 2 0 00-2-2H5a2 2 0 00-2 2v12a2 2 0 002 2z" />
-              </svg>
+            <div className="flex flex-col gap-1">
               <span className="text-xs text-gray-400 dark:text-gray-500">
-                {formatDate(new Date(note.createdAt))}
+                Created: {formatDateTime(new Date(note.createdAt))}
+              </span>
+
+              <span className="text-xs text-gray-400 dark:text-gray-500">
+                Updated: {formatDateTime(new Date(note.updatedAt))}
               </span>
             </div>
             
diff --git a/frontend/src/lib/utils.js b/frontend/src/lib/utils.js
index e95791d..9e75136 100644
--- a/frontend/src/lib/utils.js
+++ b/frontend/src/lib/utils.js
@@ -4,4 +4,14 @@ export function formatDate(date) {
     day: "numeric",
     year: "numeric",
   });
-} 
\ No newline at end of file
+}
+
+export function formatDateTime(date) {
+  return date.toLocaleString("en-US", {
+    month: "short",
+    day: "numeric",
+    year: "numeric",
+    hour: "numeric",
+    minute: "2-digit",
+  });
+}
\ No newline at end of file
diff --git a/frontend/src/pages/NoteDetailPage.jsx b/frontend/src/pages/NoteDetailPage.jsx
index 14ae32f..55943aa 100644
--- a/frontend/src/pages/NoteDetailPage.jsx
+++ b/frontend/src/pages/NoteDetailPage.jsx
@@ -127,6 +127,16 @@ const NoteDetailPage = () => {
                 />
               </div>
 
+              {/* Timestamp Info */}
+              <div className="mb-4 text-sm text-gray-500 dark:text-gray-400">
+                <p>
+                  Created: {new Date(note.createdAt).toLocaleString()}
+                </p>
+                <p>
+                  Last Updated: {new Date(note.updatedAt).toLocaleString()}
+                </p>
+              </div>
+
               {/* Content Textarea */}
               <div className="mb-6">
                 <label className="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">