From 5d1a2aa3195521e4fee6429dad70242f6a4b21d6 Mon Sep 17 00:00:00 2001
From: natib21 <yaschalew10@gmail.com>
Date: Fri, 3 Jul 2026 20:11:30 +0000
Subject: [PATCH] mile

---
 .../src/pages/operations/LastMilePage.tsx     | 34 ++++++++++++++++---
 1 file changed, 30 insertions(+), 4 deletions(-)

diff --git a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
index a66dda5de..fa3f71e9c 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
@@ -1552,11 +1552,12 @@ const LastMilePage = () => {
                   label={i === 0 ? "Container no." : undefined}
                   placeholder="Container number"
                   value={row.containerNumber}
-                  onChange={(e) =>
+                  onChange={(e) => {
+                    const value = e.currentTarget.value;
                     setVehicleRows((prev) =>
-                      prev.map((x, idx) => (idx === i ? { ...x, containerNumber: e.currentTarget.value } : x)),
-                    )
-                  }
+                      prev.map((x, idx) => (idx === i ? { ...x, containerNumber: value } : x)),
+                    );
+                  }}
                 />
                 {vehicleRows.length > 1 && (
                   <ActionIcon
@@ -1618,6 +1619,31 @@ const LastMilePage = () => {
       >
         <Stack gap="md">
           {activeRecord && <BookingInfo record={activeRecord} />}
+          {activeRecord && (activeRecord.vehicleAssignments?.length ?? 0) > 0 && (
+            <Card withBorder padding="md" radius="md">
+              <Text fw={600} size="sm" mb="sm">Assigned vehicles</Text>
+              <Stack gap="xs">
+                {activeRecord.vehicleAssignments!.map((a) => {
+                  const v = a.vehicle;
+                  const label = v
+                    ? [v.code, v.plateNumber].filter(Boolean).join(" · ")
+                    : a.vehicleId;
+                  return (
+                    <Group key={a.id} justify="space-between" wrap="nowrap">
+                      <Text size="sm">{label}</Text>
+                      {a.containerNumber ? (
+                        <Badge size="sm" variant="light" color="blue">
+                          {a.containerNumber}
+                        </Badge>
+                      ) : (
+                        <Text size="xs" c="dimmed">No container no.</Text>
+                      )}
+                    </Group>
+                  );
+                })}
+              </Stack>
+            </Card>
+          )}
           {activeRecord && (
             <Card withBorder padding="md" radius="md">
               <Text fw={600} size="sm" mb="sm">Delivery steps</Text>