From f153f2936b70eefa508bfb9e121b290dae103308 Mon Sep 17 00:00:00 2001
From: natib21 <yaschalew10@gmail.com>
Date: Fri, 3 Jul 2026 23:30:05 +0000
Subject: [PATCH] fix

---
 .../src/pages/fleet/DriverDetailPage.tsx      | 28 +++++++++++++++++--
 1 file changed, 25 insertions(+), 3 deletions(-)

diff --git a/apps/edr-freight-web/backoffice/src/pages/fleet/DriverDetailPage.tsx b/apps/edr-freight-web/backoffice/src/pages/fleet/DriverDetailPage.tsx
index 190dc8b85..dfdf822e4 100644
--- a/apps/edr-freight-web/backoffice/src/pages/fleet/DriverDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/DriverDetailPage.tsx
@@ -27,6 +27,7 @@ import {
 } from "lucide-react";
 
 import { driversService } from "@/services/drivers.service";
+import { vehiclesService } from "@/services/vehicles.service";
 import { fleetHistoryService, type FleetHistoryEvent } from "@/services/fleet-history.service";
 
 const fmtDate = (iso?: string | null) => {
@@ -160,11 +161,31 @@ const useDriverHistory = (driverId: string) =>
     queryFn: () => fleetHistoryService.driver(driverId),
   });
 
+/** id → "code · plate" map so events without a stored plate still show a name. */
+const useVehicleMap = () => {
+  const { data } = useQuery({
+    queryKey: ["vehicles-all"],
+    queryFn: () => vehiclesService.getAll({}).then((r) => r.data),
+  });
+  return useMemo(() => {
+    const m = new Map<string, string>();
+    for (const v of data ?? []) {
+      m.set(v.id, [v.code, v.plateNumber].filter(Boolean).join(" · ") || v.id);
+    }
+    return m;
+  }, [data]);
+};
+
 const VehiclesTab = ({ driverId }: { driverId: string }) => {
   const { data = [], isLoading } = useDriverHistory(driverId);
+  const vmap = useVehicleMap();
   const rows = data
     .filter((e) => e.eventType === "DRIVER_ASSIGNED")
-    .map((e) => ({ id: e.id, plate: meta(e, "vehiclePlate") || e.vehicleId || "Vehicle", at: e.createdAt }));
+    .map((e) => ({
+      id: e.id,
+      plate: meta(e, "vehiclePlate") || (e.vehicleId ? vmap.get(e.vehicleId) : null) || "Vehicle",
+      at: e.createdAt,
+    }));
   if (isLoading) return <Loading />;
   return (
     <Stack gap={4}>
@@ -214,6 +235,7 @@ const HistoryTab = ({ driverId }: { driverId: string }) => {
 
 const TripsTab = ({ driverId }: { driverId: string }) => {
   const { data = [], isLoading } = useDriverHistory(driverId);
+  const vmap = useVehicleMap();
   const trips = useMemo(
     () =>
       data
@@ -222,11 +244,11 @@ const TripsTab = ({ driverId }: { driverId: string }) => {
           id: e.id,
           mile: meta(e, "mile") === "LAST" ? "Last-mile" : "First-mile",
           booking: meta(e, "bookingRef") ?? "—",
-          vehicle: meta(e, "vehiclePlate") ?? "—",
+          vehicle: meta(e, "vehiclePlate") || (e.vehicleId ? vmap.get(e.vehicleId) : null) || "—",
           status: e.label ?? "—",
           at: e.createdAt,
         })),
-    [data],
+    [data, vmap],
   );
   if (isLoading) return <Loading />;
   return (