From 8b20924ba8e71c59577270add33686c689fa46c7 Mon Sep 17 00:00:00 2001
From: natib21 <yaschalew10@gmail.com>
Date: Sat, 4 Jul 2026 02:45:10 +0000
Subject: [PATCH] fix

---
 .../src/pages/operations/FirstMilePage.tsx        | 15 ++++++++++-----
 .../src/pages/operations/LastMilePage.tsx         | 15 ++++++++++-----
 2 files changed, 20 insertions(+), 10 deletions(-)

diff --git a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
index 56d84470b..9f5efd993 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
@@ -20,6 +20,7 @@ import type { ColumnDef } from "@edr/ui-common";
 import { DataTable, DataTableFooter, usePagination } from "@edr/ui-common";
 import {
   ActionIcon,
+  Autocomplete,
   Badge,
   Box,
   Button,
@@ -1307,17 +1308,21 @@ const FirstMilePage = () => {
                   clearable
                   disabled={assignVehicleOptions.length === 0}
                 />
-                <TextInput
+                <Autocomplete
                   style={{ flex: 1 }}
                   label={i === 0 ? "Container no." : undefined}
                   placeholder="Container number"
+                  data={(activeRecord ? bookingContainerNumbers(activeRecord) : []).filter(
+                    (n) =>
+                      n === row.containerNumber ||
+                      !vehicleRows.some((r, idx) => idx !== i && r.containerNumber === n),
+                  )}
                   value={row.containerNumber}
-                  onChange={(e) => {
-                    const value = e.currentTarget.value;
+                  onChange={(value) =>
                     setVehicleRows((prev) =>
                       prev.map((x, idx) => (idx === i ? { ...x, containerNumber: value } : x)),
-                    );
-                  }}
+                    )
+                  }
                 />
                 {vehicleRows.length > 1 && (
                   <ActionIcon
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 a43790346..5ee5f05b4 100644
--- a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
@@ -19,6 +19,7 @@ import { DataTable, DataTableFooter, usePagination } from "@edr/ui-common";
 import {
   ActionIcon,
   Alert,
+  Autocomplete,
   Badge,
   Box,
   Button,
@@ -1666,17 +1667,21 @@ const LastMilePage = () => {
                   clearable
                   disabled={assignVehicleOptions.length === 0}
                 />
-                <TextInput
+                <Autocomplete
                   style={{ flex: 1 }}
                   label={i === 0 ? "Container no." : undefined}
                   placeholder="Container number"
+                  data={(activeRecord ? bookingContainerNumbers(activeRecord) : []).filter(
+                    (n) =>
+                      n === row.containerNumber ||
+                      !vehicleRows.some((r, idx) => idx !== i && r.containerNumber === n),
+                  )}
                   value={row.containerNumber}
-                  onChange={(e) => {
-                    const value = e.currentTarget.value;
+                  onChange={(value) =>
                     setVehicleRows((prev) =>
                       prev.map((x, idx) => (idx === i ? { ...x, containerNumber: value } : x)),
-                    );
-                  }}
+                    )
+                  }
                 />
                 {vehicleRows.length > 1 && (
                   <ActionIcon