Extract duplicate date formatting functions to shared utilities

- Created frontend/app/utils/date.ts with formatDate, formatTime, formatDateTime, formatDisplayDate
- Created frontend/e2e/helpers/date.ts with formatDateLocal, getTomorrowDateStr
- Updated all frontend pages and e2e tests to use shared utilities
- Removed duplicate date formatting code from 6 files

frontend/app/admin/appointments/page.tsx

@@ -7,23 +7,11 @@ import { api } from "../../api";
 import { Header } from "../../components/Header";
 import { useRequireAuth } from "../../hooks/useRequireAuth";
 import { components } from "../../generated/api";
+import { formatDateTime } from "../../utils/date";
 
 type AppointmentResponse = components["schemas"]["AppointmentResponse"];
 type PaginatedAppointments = components["schemas"]["PaginatedResponse_AppointmentResponse_"];
 
-// Helper to format datetime
-function formatDateTime(isoString: string): string {
-  const d = new Date(isoString);
-  return d.toLocaleString("en-US", {
-    weekday: "short",
-    month: "short",
-    day: "numeric",
-    hour: "2-digit",
-    minute: "2-digit",
-    hour12: false,
-  });
-}
-
 // Helper to get status display
 function getStatusDisplay(status: string): { text: string; bgColor: string; textColor: string } {
   switch (status) {

frontend/app/admin/availability/page.tsx

@@ -8,6 +8,7 @@ import { Header } from "../../components/Header";
 import { useRequireAuth } from "../../hooks/useRequireAuth";
 import { components } from "../../generated/api";
 import constants from "../../../../shared/constants.json";
+import { formatDate, formatDisplayDate } from "../../utils/date";
 
 const { slotDurationMinutes, maxAdvanceDays } = constants.booking;
 
@@ -15,14 +16,6 @@ type AvailabilityDay = components["schemas"]["AvailabilityDay"];
 type AvailabilityResponse = components["schemas"]["AvailabilityResponse"];
 type TimeSlot = components["schemas"]["TimeSlot"];
 
-// Helper to format date as YYYY-MM-DD in local timezone
-function formatDate(d: Date): string {
-  const year = d.getFullYear();
-  const month = String(d.getMonth() + 1).padStart(2, "0");
-  const day = String(d.getDate()).padStart(2, "0");
-  return `${year}-${month}-${day}`;
-}
-
 // Helper to get next N days starting from tomorrow
 function getDateRange(): Date[] {
   const dates: Date[] = [];
@@ -223,10 +216,6 @@ export default function AdminAvailabilityPage() {
     }
   };
 
-  const formatDisplayDate = (d: Date): string => {
-    return d.toLocaleDateString("en-US", { weekday: "short", month: "short", day: "numeric" });
-  };
-
   const formatSlotTime = (slot: TimeSlot): string => {
     return `${slot.start_time.slice(0, 5)} - ${slot.end_time.slice(0, 5)}`;
   };

frontend/app/appointments/page.tsx

@@ -7,22 +7,10 @@ import { api } from "../api";
 import { Header } from "../components/Header";
 import { useRequireAuth } from "../hooks/useRequireAuth";
 import { components } from "../generated/api";
+import { formatDateTime } from "../utils/date";
 
 type AppointmentResponse = components["schemas"]["AppointmentResponse"];
 
-// Helper to format datetime
-function formatDateTime(isoString: string): string {
-  const d = new Date(isoString);
-  return d.toLocaleString("en-US", {
-    weekday: "short",
-    month: "short",
-    day: "numeric",
-    hour: "2-digit",
-    minute: "2-digit",
-    hour12: false,
-  });
-}
-
 // Helper to get status display
 function getStatusDisplay(status: string): { text: string; bgColor: string; textColor: string } {
   switch (status) {

frontend/app/booking/page.tsx

@@ -8,6 +8,7 @@ import { Header } from "../components/Header";
 import { useRequireAuth } from "../hooks/useRequireAuth";
 import { components } from "../generated/api";
 import constants from "../../../shared/constants.json";
+import { formatDate, formatTime } from "../utils/date";
 
 const { slotDurationMinutes, maxAdvanceDays, minAdvanceDays, noteMaxLength } = constants.booking;
 
@@ -15,24 +16,6 @@ type BookableSlot = components["schemas"]["BookableSlot"];
 type AvailableSlotsResponse = components["schemas"]["AvailableSlotsResponse"];
 type AppointmentResponse = components["schemas"]["AppointmentResponse"];
 
-// Helper to format date as YYYY-MM-DD in local timezone
-function formatDate(d: Date): string {
-  const year = d.getFullYear();
-  const month = String(d.getMonth() + 1).padStart(2, "0");
-  const day = String(d.getDate()).padStart(2, "0");
-  return `${year}-${month}-${day}`;
-}
-
-// Helper to format time from ISO string
-function formatTime(isoString: string): string {
-  const d = new Date(isoString);
-  return d.toLocaleTimeString("en-US", { 
-    hour: "2-digit", 
-    minute: "2-digit",
-    hour12: false,
-  });
-}
-
 // Get date range for booking (tomorrow to +30 days)
 function getBookableDates(): Date[] {
   const dates: Date[] = [];

frontend/app/utils/date.ts

@@ -0,0 +1,48 @@
+/**
+ * Shared date formatting utilities.
+ */
+
+/**
+ * Format date as YYYY-MM-DD in local timezone.
+ */
+export function formatDate(d: Date): string {
+  const year = d.getFullYear();
+  const month = String(d.getMonth() + 1).padStart(2, "0");
+  const day = String(d.getDate()).padStart(2, "0");
+  return `${year}-${month}-${day}`;
+}
+
+/**
+ * Format time from ISO string to HH:MM format.
+ */
+export function formatTime(isoString: string): string {
+  const d = new Date(isoString);
+  return d.toLocaleTimeString("en-US", { 
+    hour: "2-digit", 
+    minute: "2-digit",
+    hour12: false,
+  });
+}
+
+/**
+ * Format datetime from ISO string to a readable format.
+ */
+export function formatDateTime(isoString: string): string {
+  const d = new Date(isoString);
+  return d.toLocaleString("en-US", {
+    weekday: "short",
+    month: "short",
+    day: "numeric",
+    hour: "2-digit",
+    minute: "2-digit",
+    hour12: false,
+  });
+}
+
+/**
+ * Format date for display (e.g., "Mon, Jan 15").
+ */
+export function formatDisplayDate(d: Date): string {
+  return d.toLocaleDateString("en-US", { weekday: "short", month: "short", day: "numeric" });
+}
+