Fixed timezone issue and also added unit tests to verify

Author: thomasyzy7

course-matrix/frontend/__tests__/convertTimestampToLocaleTime.test.ts

@@ -0,0 +1,31 @@
+import { convertTimestampToLocaleTime } from "../src/utils/convert-timestamp-to-locale-time";
+import { describe, expect, it, test } from "@jest/globals";
+
+describe("convertTimestampToLocaleTime", () => {
+  test("should convert a valid timestamp string to a locale time string", () => {
+    const timestamp = "2025-03-28T12:00:00Z";
+    const result = convertTimestampToLocaleTime(timestamp);
+    expect(result).toBe("3/28/2025, 8:00:00 AM");
+    expect(result.length).toBeGreaterThan(0); // Ensures it returns a non-empty string
+  });
+
+  test("should convert a valid numeric timestamp to a locale time string", () => {
+    const timestamp = 1711622400000; // Equivalent to 2025-03-28T12:00:00Z in milliseconds
+    const result = convertTimestampToLocaleTime(timestamp);
+    expect(result).toBe("3/28/2024, 6:40:00 AM");
+    expect(result.length).toBeGreaterThan(0);
+  });
+
+  test("convert to locale time date is different", () => {
+    const timestamp = "2025-03-28 02:33:02.589+00"; 
+    const result = convertTimestampToLocaleTime(timestamp);
+    expect(result).toBe("3/27/2025, 10:33:02 PM");
+    expect(result.length).toBeGreaterThan(0);
+  });
+
+  test("should return 'Invalid Date' for an invalid timestamp", () => {
+    const timestamp = "invalid";
+    const result = convertTimestampToLocaleTime(timestamp);
+    expect(result).toBe("Invalid Date");
+  });
+});

course-matrix/frontend/src/pages/Home/TimetableCard.tsx

@@ -16,6 +16,7 @@ import {
 } from "@/api/timetableApiSlice";
 import { Link } from "react-router-dom";
 import { TimetableModel } from "@/models/models";
+import {convertTimestampToLocaleTime} from "../../utils/convert-timestamp-to-locale-time";
 
 interface TimetableCardProps {
   refetch: () => void;
@@ -43,21 +44,14 @@ const TimetableCard = ({
 }: TimetableCardProps) => {
   const [updateTimetable] = useUpdateTimetableMutation();
 
-  const lastEditedDateArray = lastEditedDate
-    .toISOString()
-    .split("T")[0]
-    .split("-");
-  const lastEditedYear = lastEditedDateArray[0];
-  const lastEditedMonth = lastEditedDateArray[1];
-  const lastEditedDay = lastEditedDateArray[2];
-  const lastEditedDateTimestamp =
-    lastEditedMonth + "/" + lastEditedDay + "/" + lastEditedYear;
 
   const [timetableCardTitle, setTimetableCardTitle] = useState(title);
   const [isEditingTitle, setIsEditingTitle] = useState(false);
   const { data } = useGetTimetableQuery(timetableId);
   const [toggled, setToggled] = useState(favorite);
 
+  
+
   const handleSave = async () => {
     try {
       await updateTimetable({
@@ -161,7 +155,7 @@ const TimetableCard = ({
       </CardHeader>
       <CardContent className="-mt-3">
         <CardDescription className="flex justify-between text-xs">
-          <div>Last edited {lastEditedDateTimestamp}</div>
+          <div>Last edited {convertTimestampToLocaleTime(lastEditedDate.toISOString()).split(",")[0]}</div>
           <div>Owned by: {owner}</div>
         </CardDescription>
       </CardContent>

course-matrix/frontend/src/utils/convert-timestamp-to-locale-time.ts

@@ -0,0 +1,6 @@
+
+
+export function convertTimestampToLocaleTime(timestampz: string | number): string {
+  const date = new Date(timestampz);
+  return date.toLocaleString(); // Uses system's default locale
+}