style: ui fixes

apps/edr-freight-web/backoffice/src/pages/fleet/DriverDetailPage.tsx

@@ -43,17 +43,13 @@ import {
   fetchViewableFile,
 } from "@/services/files.service";
 import { useToast } from "@/hooks/use-toast";
+import { formatDateTime } from "@/lib/format";
 
 const fmtDate = (iso?: string | null) => {
   if (!iso) return "—";
   const d = new Date(iso);
   return Number.isNaN(d.getTime()) ? "—" : d.toLocaleDateString();
 };
-const fmtDateTime = (iso?: string | null) => {
-  if (!iso) return "—";
-  const d = new Date(iso);
-  return Number.isNaN(d.getTime()) ? "—" : d.toLocaleString();
-};
 const meta = (e: FleetHistoryEvent, k: string) => {
   const v = e.metadata?.[k];
   return typeof v === "string" && v ? v : null;
@@ -400,7 +396,7 @@ const VehiclesTab = ({ driverId }: { driverId: string }) => {
             {rows.map((r) => (
               <Table.Tr key={r.id}>
                 <Table.Td>{r.plate}</Table.Td>
-                <Table.Td>{fmtDateTime(r.at)}</Table.Td>
+                <Table.Td>{formatDateTime(r.at)}</Table.Td>
               </Table.Tr>
             ))}
           </Table.Tbody>
@@ -425,7 +421,7 @@ const HistoryTab = ({ driverId }: { driverId: string }) => {
                 .join(" · ")}
             </Text>
           )}
-          <Text size="xs" c="dimmed" mt={2}>{fmtDateTime(e.createdAt)}</Text>
+          <Text size="xs" c="dimmed" mt={2}>{formatDateTime(e.createdAt)}</Text>
         </Timeline.Item>
       ))}
     </Timeline>
@@ -471,7 +467,7 @@ const TripsTab = ({ driverId }: { driverId: string }) => {
                   <Table.Td>{t.booking}</Table.Td>
                   <Table.Td>{t.vehicle}</Table.Td>
                   <Table.Td>{t.status}</Table.Td>
-                  <Table.Td>{fmtDateTime(t.at)}</Table.Td>
+                  <Table.Td>{formatDateTime(t.at)}</Table.Td>
                 </Table.Tr>
               ))}
             </Table.Tbody>

apps/edr-freight-web/backoffice/src/pages/fleet/TrackingPage.tsx

@@ -35,6 +35,7 @@ import {
   type GpsDevice,
 } from "@/services/gps-tracking.service";
 import { freightBrand } from "@/theme/freight-brand";
+import { formatDateTime } from "@/lib/format";
 
 // Maps JavaScript API keys are public client-side keys — lock them down by
 // HTTP-referrer in the Google Cloud console. No fallback: a hardcoded default
@@ -51,11 +52,6 @@ const deviceLabel = (d: GpsDevice) =>
     ? [d.vehicle.code, d.vehicle.plateNumber].filter(Boolean).join(" · ")
     : d.name || d.imei;
 
-const fmtTime = (iso?: string | null) => {
-  if (!iso) return "—";
-  const d = new Date(iso);
-  return Number.isNaN(d.getTime()) ? "—" : d.toLocaleString();
-};
 
 const StatBox = ({ label, value }: { label: string; value: string }) => (
   <Box p="sm" style={{ backgroundColor: "#f8f9fa", borderRadius: 8 }}>
@@ -530,7 +526,7 @@ export function TrackingPage() {
                       Last fix
                     </Text>
                     <Text fw={500} size="sm">
-                      {fmtTime(selected.lastFixAt)}
+                      {formatDateTime(selected.lastFixAt)}
                     </Text>
                   </div>
                   {selected.vehicleId && (
@@ -580,7 +576,7 @@ export function TrackingPage() {
                               </Text>
                               <Text size="xs" c="dimmed">
                                 {toNum(d.lastSpeed) ?? 0} km/h ·{" "}
-                                {fmtTime(d.lastFixAt)}
+                                {formatDateTime(d.lastFixAt)}
                               </Text>
                             </Stack>
                           </Table.Td>

apps/edr-freight-web/backoffice/src/pages/fleet/VehicleDetailPage.tsx

@@ -42,6 +42,7 @@ import {
 } from "@/services/vehicles.service";
 import { driversService } from "@/services/drivers.service";
 import { fleetHistoryService } from "@/services/fleet-history.service";
+import { formatDateTime } from "@/lib/format";
 
 interface MaintenanceCost {
   id: string;
@@ -77,11 +78,6 @@ const fmtDate = (iso?: string | null) => {
   const d = new Date(iso);
   return Number.isNaN(d.getTime()) ? "—" : d.toLocaleDateString();
 };
-const fmtDateTime = (iso?: string | null) => {
-  if (!iso) return "—";
-  const d = new Date(iso);
-  return Number.isNaN(d.getTime()) ? "—" : d.toLocaleString();
-};
 const money = (n?: number | null) =>
   n == null ? "—" : `ETB ${Number(n).toLocaleString(undefined, { maximumFractionDigits: 2 })}`;
 
@@ -359,7 +355,7 @@ const DriverTab = ({
               {drivers.map((d) => (
                 <Table.Tr key={d.id}>
                   <Table.Td>{d.name}</Table.Td>
-                  <Table.Td>{fmtDateTime(d.at)}</Table.Td>
+                  <Table.Td>{formatDateTime(d.at)}</Table.Td>
                 </Table.Tr>
               ))}
             </Table.Tbody>
@@ -388,7 +384,7 @@ const HistoryTab = ({ vehicleId }: { vehicleId: string }) => {
                 .join(" · ")}
             </Text>
           )}
-          <Text size="xs" c="dimmed" mt={2}>{fmtDateTime(e.createdAt)}</Text>
+          <Text size="xs" c="dimmed" mt={2}>{formatDateTime(e.createdAt)}</Text>
         </Timeline.Item>
       ))}
     </Timeline>