merge conflict

2026-08-29 21:08:12 +00:00 · 2026-06-29 12:45:40 +03:00
parent 2ad384e63b f3e27fb607
commit 1c01c792fc
202 changed files with 16895 additions and 3799 deletions
--- a/apps/edr-freight-web/backoffice/src/App.tsx
+++ b/apps/edr-freight-web/backoffice/src/App.tsx
@@ -83,6 +83,7 @@ import WarehouseInventoryPage from "./pages/warehouses/WarehouseInventoryPage";
 import WarehouseInvoicesPage from "./pages/warehouses/WarehouseInvoicesPage";
 import WarehouseListPage from "./pages/warehouses/WarehouseListPage";
 import WarehouseRulesPage from "./pages/warehouses/WarehouseRulesPage";
+import { HealthCheck } from "./features/health/HealthCheck";

 const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
  {
@@ -94,7 +95,7 @@ const buildSidebarSections = (demoItems: SidebarItem[]): SidebarSection[] => [
        icon: <LayoutDashboard />,
      },
      {
-        label: "UM",
+        label: "User Management",
        href: "/um",
        icon: <Users />,
      },
@@ -386,6 +387,7 @@ const App = () => {
  return (
    <Routes>
      <Route path="/um/*" element={<UserManagementHostPage />} />
+      <Route path="/health" element={<HealthCheck />} />
      <Route path="/" element={<Navigate to="/dashboard/overview" replace />} />
      <Route path="/dashboard" element={<Navigate to="/dashboard/overview" replace />} />
      <Route path="/dashboard" element={<DashboardShell />}>
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/FeePreviewModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/FeePreviewModal.tsx
@@ -134,15 +134,23 @@ export function FeePreviewModal({ opened, onClose, inventoryId }: FeePreviewModa
    const pdfWindow = window.open('', '_blank');
    try {
      const releasedItem = await gateClear.mutateAsync(inventoryId) as WarehouseInventoryItem;
-      const documentResponse = await warehouseService.downloadReleaseDocument(inventoryId);
-      const filename = `release-${releasedItem?.booking?.reference ?? releasedItem?.bookingId ?? inventoryId}.pdf`;
-      const opened = openPdfBlob(documentResponse.data, filename, pdfWindow);
-      toast({
-        title: 'Gate clearance recorded',
-        description: opened
-          ? 'The release PDF opened in a browser tab.'
-          : 'The browser blocked the preview tab, so the PDF was downloaded.',
-      });
+      try {
+        const documentResponse = await warehouseService.downloadReleaseDocument(inventoryId);
+        const filename = `release-${releasedItem?.booking?.reference ?? releasedItem?.bookingId ?? inventoryId}.pdf`;
+        const opened = openPdfBlob(documentResponse.data, filename, pdfWindow);
+        toast({
+          title: 'Gate clearance recorded',
+          description: opened
+            ? 'The release PDF opened in a browser tab.'
+            : 'The browser blocked the preview tab, so the PDF was downloaded.',
+        });
+      } catch (documentError) {
+        pdfWindow?.close();
+        toast({
+          title: 'Gate clearance recorded',
+          description: `Release paper could not be opened: ${extractErrorMessage(documentError)}`,
+        });
+      }
      onClose();
    } catch (error) {
      pdfWindow?.close();
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/InterchangeDocumentDetailPanel.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/InterchangeDocumentDetailPanel.tsx
@@ -69,6 +69,8 @@ export function InterchangeDocumentDetailPanel({ id }: { id: string }) {
        />
        <DetailField label="Generated At" value={formatDate(document.generatedAt)} />
        <DetailField label="Acknowledged At" value={formatDate(document.acknowledgedAt)} />
+        <DetailField label="Signed by EDR" value={document.generatedBy} />
+        <DetailField label="Signed by Djibouti Port" value={document.acknowledgedBy} />
        <DetailField label="Customs Ref" value={document.customsReference} />
        <DetailField label="Manifest Ref" value={document.manifestReference} />
      </SimpleGrid>
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/InventoryDetailModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/InventoryDetailModal.tsx
@@ -24,6 +24,15 @@ function DetailRow({ label, value }: { label: string; value: React.ReactNode })
 }

 export function InventoryDetailModal({ opened, onClose, item }: InventoryDetailModalProps) {
+  const bookingReference = item?.booking?.reference ?? '-';
+  const inventorySummary = [
+    item?.status?.replace(/_/g, ' '),
+    item?.releaseOrderReference ? `Release ${item.releaseOrderReference}` : null,
+    item?.warehouse ? `${item.warehouse.name} (${item.warehouse.code})` : null,
+  ]
+    .filter(Boolean)
+    .join(' / ');
+
  return (
    <Modal opened={opened} onClose={onClose} title="Inventory detail" centered size="xl">
      {!item ? (
@@ -33,10 +42,10 @@ export function InventoryDetailModal({ opened, onClose, item }: InventoryDetailM
          <Group justify="space-between" align="flex-start">
            <Stack gap={2}>
              <Text size="lg" fw={800}>
-                {item.booking?.reference ?? item.bookingId ?? item.id}
+                {bookingReference}
              </Text>
              <Text size="sm" c="dimmed">
-                Inventory ID: {item.id}
+                {inventorySummary || 'Inventory information'}
              </Text>
            </Stack>
            <InventoryStatusBadge status={item.status} />
@@ -51,12 +60,12 @@ export function InventoryDetailModal({ opened, onClose, item }: InventoryDetailM

          <Divider label="Booking & item" labelPosition="left" />
          <SimpleGrid cols={{ base: 1, sm: 3 }}>
+            <DetailRow label="Booking reference" value={bookingReference} />
            <DetailRow label="Booking status" value={item.booking?.status ?? '-'} />
            <DetailRow label="Payment status" value={item.booking?.paymentStatus ?? '-'} />
            <DetailRow label="Trade direction" value={item.booking?.tradeDirection ?? '-'} />
-            <DetailRow label="Container ID" value={item.containerId ?? '-'} />
-            <DetailRow label="Cargo ID" value={item.cargoId ?? '-'} />
-            <DetailRow label="Goods ID" value={item.goodsId ?? '-'} />
+            <DetailRow label="Inventory status" value={item.status.replace(/_/g, ' ')} />
+            <DetailRow label="Release reference" value={item.releaseOrderReference ?? '-'} />
            <DetailRow label="Quantity" value={formatNumber(item.quantity)} />
            <DetailRow label="Weight" value={`${formatNumber(item.weight)} kg`} />
            <DetailRow label="Volume" value={item.volume == null ? '-' : formatNumber(item.volume)} />
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/ReceiveInventoryModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/ReceiveInventoryModal.tsx
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/ReleaseOrderModal.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/ReleaseOrderModal.tsx
@@ -1,6 +1,6 @@
 import { useEffect, useState } from 'react';
-import { Alert, Button, Group, Modal, Stack, Text, TextInput } from '@mantine/core';
-import { Info } from 'lucide-react';
+import { Alert, Button, Group, Modal, NumberInput, Select, Stack, Text, TextInput } from '@mantine/core';
+import { Info, Scale } from 'lucide-react';

 import { useMutation } from '@tanstack/react-query';

@@ -17,23 +17,115 @@ interface ReleaseOrderModalProps {
  item: WarehouseInventoryItem | null;
 }

+const REGISTERED_FIRST_LAST_MILE_TRUCKS = [
+  ['03-ET A45843', '43495'], ['03-ET A45866', '43470'], ['03-ET A45853', '43508'], ['03-ET A45849', '43414'],
+  ['03-ET A45845', '43492'], ['03-ET A45820', '43487'], ['03-ET A45842', '43478'], ['03-ET A45841', '43515'],
+  ['03-ET A45832', '43504'], ['03-ET A45856', '43510'], ['03-ET A45865', '43490'], ['03-ET A45855', '43485'],
+  ['03-ET A45840', '43499'], ['03-ET A45867', '43493'], ['03-ET A45833', '43466'], ['03-ET A45858', '43496'],
+  ['03-ET A45819', '43474'], ['03-ET A45834', '43502'], ['03-ET A45868', '43469'], ['03-ET A45831', '43488'],
+  ['03-ET A45828', '43479'], ['03-ET A45850', '43505'], ['03-ET A45823', '43480'], ['03-ET A45838', '43472'],
+  ['03-ET A45854', '43500'], ['03-ET A45839', '43486'], ['03-ET A45861', '43513'], ['03-ET A45830', '43501'],
+  ['03-ET A45826', '43498'], ['03-ET A45836', '43467'], ['03-ET A45822', '43512'], ['03-ET A45821', '43210'],
+  ['03-ET A45837', '43475'], ['03-ET A45860', '43497'], ['03-ET A45863', '43477'], ['03-ET A45825', '43483'],
+  ['03-ET A45829', '43473'], ['03-ET A45824', '43491'], ['03-ET A45857', '43481'], ['03-ET A45851', '43509'],
+  ['03-ET A45827', '43468'], ['03-ET A45859', '43887'], ['03-ET A45846', '43471'], ['03-ET A45847', '43511'],
+  ['03-ET A45852', '43484'], ['03-ET A45844', '43476'], ['03-ET A45835', '43482'], ['03-ET A45864', '43503'],
+  ['03-ET A45848', '43494'], ['03-ET A45862', '43465'], ['03-ET A39105', '41218'], ['03-ET A39098', '41220'],
+  ['03-ET A29900', '41865'], ['03-ET A39097', '41226'], ['03-ET A39104', '41225'], ['03-ET A39103', '41223'],
+  ['03-ET A39106', '41221'], ['03-ET A39107', '41215'], ['03-ET A39094', '41222'], ['03-ET A39099', '41216'],
+  ['03-ET A39092', '41224'], ['03-ET A31801', '41214'],
+].map(([powerPlate, trailerPlate], index) => ({
+  value: powerPlate,
+  label: `${index + 1}. ${powerPlate} / ${trailerPlate}`,
+  trailerPlate,
+}));
+
+const toIsoDateTime = (value: string) => {
+  if (!value) return undefined;
+  const date = new Date(value);
+  return Number.isNaN(date.getTime()) ? undefined : date.toISOString();
+};
+
 export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalProps) {
  const { toast } = useToast();
  const releaseMutation = useMutation(api.warehouses.release.mutationOptions());
  const [reference, setReference] = useState('');
+  const [truckPlateNumber, setTruckPlateNumber] = useState('');
+  const [trailerPlateNumber, setTrailerPlateNumber] = useState('');
+  const [driverName, setDriverName] = useState('');
+  const [driverLicense, setDriverLicense] = useState('');
+  const [driverPhone, setDriverPhone] = useState('');
+  const [truckType, setTruckType] = useState('');
+  const [containerNumber, setContainerNumber] = useState('');
+  const [gateInTime, setGateInTime] = useState('');
+  const [tareWeight, setTareWeight] = useState<number | ''>('');
+  const [grossWeight, setGrossWeight] = useState<number | ''>('');
+  const [netWeight, setNetWeight] = useState<number | ''>('');
+  const [gateOutTime, setGateOutTime] = useState('');
  const [downloading, setDownloading] = useState(false);

  useEffect(() => {
-    if (opened) setReference(item?.releaseOrderReference ?? '');
+    if (opened) {
+      setReference(item?.releaseOrderReference ?? '');
+      setTruckPlateNumber('');
+      setTrailerPlateNumber('');
+      setDriverName('');
+      setDriverLicense('');
+      setDriverPhone('');
+      setTruckType('');
+      setContainerNumber('');
+      setGateInTime('');
+      setTareWeight('');
+      setGrossWeight('');
+      setNetWeight(item?.weight != null ? Number(item.weight) : '');
+      setGateOutTime('');
+    }
  }, [opened, item]);

+  const computedNetWeight =
+    tareWeight !== '' && grossWeight !== '' ? Number((Number(grossWeight) - Number(tareWeight)).toFixed(3)) : null;
+  const weightMismatch =
+    computedNetWeight != null && netWeight !== '' && Math.abs(Number(netWeight) - computedNetWeight) > 0.001;
+
  const handleSubmit = async () => {
    if (!item) return;
+    if (!truckPlateNumber.trim() || !driverName.trim()) {
+      toast({ variant: 'destructive', title: 'Truck plate and driver name are required' });
+      return;
+    }
+    if (tareWeight === '' || grossWeight === '') {
+      toast({ variant: 'destructive', title: 'Tare and gross weight are required' });
+      return;
+    }
+    if (weightMismatch) {
+      toast({
+        variant: 'destructive',
+        title: 'Weight mismatch',
+        description: 'Gate clearance is blocked. Reassign the item to warehouse if it cannot exit.',
+      });
+      return;
+    }
    const pdfWindow = window.open('', '_blank');
    try {
      const released = await releaseMutation.mutateAsync({
        id: item.id,
-        payload: { reference: reference.trim() || undefined },
+        payload: {
+          reference: reference.trim() || undefined,
+          bookingId: item.bookingId ?? undefined,
+          customerId: undefined,
+          truckPlateNumber: truckPlateNumber.trim(),
+          trailerPlateNumber: trailerPlateNumber.trim() || undefined,
+          driverName: driverName.trim(),
+          driverLicense: driverLicense.trim() || undefined,
+          driverPhone: driverPhone.trim() || undefined,
+          truckType: truckType.trim() || undefined,
+          containerNumber: containerNumber.trim() || undefined,
+          gateInTime: toIsoDateTime(gateInTime),
+          tareWeight: Number(tareWeight),
+          grossWeight: Number(grossWeight),
+          netWeight: netWeight === '' ? computedNetWeight ?? undefined : Number(netWeight),
+          gateOutTime: toIsoDateTime(gateOutTime),
+        },
      });
      setDownloading(true);
      const response = await warehouseService.downloadReleaseDocument(item.id);
@@ -56,12 +148,12 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
  };

  return (
-    <Modal opened={opened} onClose={onClose} title="Issue release exit paper" centered size="md">
+    <Modal opened={opened} onClose={onClose} title="Exit inspection and release paper" centered size="lg">
      <Stack gap="md">
        <Alert icon={<Info size={16} />} color="orange" variant="light">
          <Text size="sm">
-            Creates the warehouse release document with booking, customer, cargo and location details. The
-            printed paper authorizes the goods to leave the warehouse gate.
+            Save the exit inspection before generating the exit paper. Gate clearance is blocked when
+            recorded net weight does not equal gross weight minus tare weight.
          </Text>
        </Alert>
        <TextInput
@@ -70,12 +162,69 @@ export function ReleaseOrderModal({ opened, onClose, item }: ReleaseOrderModalPr
          value={reference}
          onChange={(e) => setReference(e.currentTarget.value)}
        />
+        <Select
+          label="Registered first / last-mile truck"
+          placeholder="Select truck or type plate manually below"
+          searchable
+          clearable
+          data={REGISTERED_FIRST_LAST_MILE_TRUCKS}
+          value={REGISTERED_FIRST_LAST_MILE_TRUCKS.some((truck) => truck.value === truckPlateNumber) ? truckPlateNumber : null}
+          onChange={(value) => {
+            const truck = REGISTERED_FIRST_LAST_MILE_TRUCKS.find((row) => row.value === value);
+            setTruckPlateNumber(truck?.value ?? '');
+            setTrailerPlateNumber(truck?.trailerPlate ?? '');
+          }}
+        />
+        <Group grow>
+          <TextInput
+            label="Truck plate number"
+            required
+            value={truckPlateNumber}
+            onChange={(e) => setTruckPlateNumber(e.currentTarget.value)}
+          />
+          <TextInput
+            label="Trailer plate number"
+            value={trailerPlateNumber}
+            onChange={(e) => setTrailerPlateNumber(e.currentTarget.value)}
+          />
+        </Group>
+        <Group grow>
+          <TextInput label="Driver name" required value={driverName} onChange={(e) => setDriverName(e.currentTarget.value)} />
+          <TextInput label="Driver license" value={driverLicense} onChange={(e) => setDriverLicense(e.currentTarget.value)} />
+        </Group>
+        <Group grow>
+          <TextInput label="Driver phone" value={driverPhone} onChange={(e) => setDriverPhone(e.currentTarget.value)} />
+          <TextInput label="Truck type" value={truckType} onChange={(e) => setTruckType(e.currentTarget.value)} />
+        </Group>
+        <Group grow>
+          <TextInput label="Container number" value={containerNumber} onChange={(e) => setContainerNumber(e.currentTarget.value)} />
+          <TextInput label="Gate in time" type="datetime-local" value={gateInTime} onChange={(e) => setGateInTime(e.currentTarget.value)} />
+        </Group>
+        <Group grow>
+          <NumberInput label="Tare weight (kg)" required min={0} value={tareWeight} onChange={(v) => setTareWeight(v === '' ? '' : Number(v))} />
+          <NumberInput label="Gross weight (kg)" required min={0} value={grossWeight} onChange={(v) => setGrossWeight(v === '' ? '' : Number(v))} />
+          <NumberInput label="Recorded net weight (kg)" min={0} value={netWeight} onChange={(v) => setNetWeight(v === '' ? '' : Number(v))} />
+        </Group>
+        <Group justify="space-between">
+          <Text size="sm" c={weightMismatch ? 'red' : 'dimmed'}>
+            Computed net: <b>{computedNetWeight == null ? '-' : `${computedNetWeight.toLocaleString()} kg`}</b>
+          </Text>
+          <TextInput label="Gate out time" type="datetime-local" value={gateOutTime} onChange={(e) => setGateOutTime(e.currentTarget.value)} />
+        </Group>
+        {weightMismatch && (
+          <Alert icon={<Scale size={16} />} color="red" variant="light">
+            <Text size="sm">
+              Weight mismatch detected. Exit paper and gate clearance are blocked; use Store or Move to
+              reassign the item back to warehouse handling.
+            </Text>
+          </Alert>
+        )}
        <Group justify="flex-end" mt="sm">
          <Button variant="default" onClick={onClose} disabled={releaseMutation.isPending || downloading}>
            Cancel
          </Button>
          <Button color="orange" onClick={handleSubmit} loading={releaseMutation.isPending || downloading}>
-            Issue & view exit paper
+            Exit Inspection & View Exit Paper
          </Button>
        </Group>
      </Stack>
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/WarehouseInventoryTable.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/WarehouseInventoryTable.tsx
@@ -164,7 +164,7 @@ export function WarehouseInventoryTable({
                        loading={busy}
                        onClick={() => onAdvance(item, nextAction)}
                      >
-                        {humanizeEnum(nextAction.replace(/-/g, '_'))}
+                        {nextAction === 'release' ? 'Exit Inspection' : humanizeEnum(nextAction.replace(/-/g, '_'))}
                      </Button>
                    )}
                    {item.status === 'READY_FOR_PICKUP' && (
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/WarehouseTable.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/WarehouseTable.tsx
@@ -181,7 +181,7 @@ export function WarehouseTable({ warehouses, onView, onEdit }: WarehouseTablePro
          </ActionIcon>
        </Group>
      ),
-    },
+      },
  ];

  return (
--- a/apps/edr-freight-web/backoffice/src/components/warehouses/warehousePdf.ts
+++ b/apps/edr-freight-web/backoffice/src/components/warehouses/warehousePdf.ts
@@ -0,0 +1,273 @@
+import type { WarehouseFeeInvoice, WarehouseInventoryItem } from '@/types/warehouse';
+import type { BookingDetail } from '@/types/booking';
+
+type PdfLine = {
+  text: string;
+  size?: number;
+  bold?: boolean;
+  x?: number;
+  yGap?: number;
+  color?: 'black' | 'green';
+  align?: 'left' | 'center' | 'right';
+};
+
+export interface WarehouseExitPaperContext {
+  invoice: WarehouseFeeInvoice;
+  releasedItem?: WarehouseInventoryItem;
+  inventory?: WarehouseInventoryItem;
+  booking?: BookingDetail | null;
+  releasedAt?: Date;
+}
+
+const escapePdfText = (value: string) =>
+  value.replace(/\\/g, '\\\\').replace(/\(/g, '\\(').replace(/\)/g, '\\)');
+
+const money = (amount: unknown, currency = 'USD') =>
+  `${Number(amount ?? 0).toLocaleString()} ${currency === 'ETB' ? 'Birr (ETB)' : currency}`;
+
+const fmtDate = (value: unknown) => {
+  if (!value) return '-';
+  const date = new Date(value as string | Date);
+  return Number.isNaN(date.getTime()) ? '-' : date.toLocaleString();
+};
+
+const GREEN = '0 0.55 0.32';
+
+const circlePath = (cx: number, cy: number, r: number) => {
+  const k = 0.5522847498;
+  const c = r * k;
+  return [
+    `${cx + r} ${cy} m`,
+    `${cx + r} ${cy + c} ${cx + c} ${cy + r} ${cx} ${cy + r} c`,
+    `${cx - c} ${cy + r} ${cx - r} ${cy + c} ${cx - r} ${cy} c`,
+    `${cx - r} ${cy - c} ${cx - c} ${cy - r} ${cx} ${cy - r} c`,
+    `${cx + c} ${cy - r} ${cx + r} ${cy - c} ${cx + r} ${cy} c`,
+    'h',
+  ].join('\n');
+};
+
+const stampText = (text: string, x: number, y: number, size: number, bold = false) =>
+  `BT\n${GREEN} rg\n/${bold ? 'F2' : 'F1'} ${size} Tf\n${x} ${y} Td\n(${escapePdfText(text)}) Tj\nET`;
+
+const buildCircularSeal = (cx: number, cy: number, label: 'PAID' | 'CLEARED') =>
+  [
+    'q',
+    `${GREEN} RG`,
+    `${GREEN} rg`,
+    '2.2 w',
+    circlePath(cx, cy, 52),
+    'S',
+    '0.9 w',
+    circlePath(cx, cy, 42),
+    'S',
+    stampText('EDR FREIGHT', cx - 33, cy + 24, 9, true),
+    stampText(label, cx - (label === 'CLEARED' ? 36 : 21), cy - 4, label === 'CLEARED' ? 17 : 20, true),
+    stampText(label === 'CLEARED' ? 'GATE RELEASE' : 'WAREHOUSE', cx - (label === 'CLEARED' ? 34 : 32), cy - 25, 8),
+    'Q',
+  ].join('\n');
+
+const estimateTextWidth = (text: string, size: number) => text.length * size * 0.52;
+
+const textX = (text: string, size: number, align: PdfLine['align'] = 'left', x?: number) => {
+  if (typeof x === 'number') return x;
+  if (align === 'center') return Math.max(36, (595 - estimateTextWidth(text, size)) / 2);
+  if (align === 'right') return Math.max(36, 535 - estimateTextWidth(text, size));
+  return 60;
+};
+
+const lineOp = (x1: number, y1: number, x2: number, y2: number, color = '0.65 0.7 0.76') =>
+  `q\n${color} RG\n0.8 w\n${x1} ${y1} m\n${x2} ${y2} l\nS\nQ`;
+
+const textOp = (
+  text: string,
+  x: number,
+  y: number,
+  size = 10,
+  bold = false,
+  color = '0 0 0',
+) => `BT\n${color} rg\n/${bold ? 'F2' : 'F1'} ${size} Tf\n${x} ${y} Td\n(${escapePdfText(text)}) Tj\nET`;
+
+const buildAuthorizationBand = (label: 'PAID' | 'CLEARED') => [
+  lineOp(60, 242, 535, 242),
+  textOp('AUTHORIZED SEAL', 382, 218, 9, true, GREEN),
+  buildCircularSeal(452, 155, label),
+];
+
+const buildWarehouseOfficerSealBand = () => [
+  lineOp(60, 218, 535, 218),
+  textOp('WAREHOUSE OFFICER SEAL', 92, 194, 9, true, GREEN),
+  buildCircularSeal(170, 128, 'CLEARED'),
+  textOp('Officer in charge name / signature / date:', 292, 154, 10),
+  lineOp(292, 132, 535, 132, '0 0 0'),
+  textOp('Customer or driver name / signature / date:', 292, 94, 10),
+  lineOp(292, 72, 535, 72, '0 0 0'),
+];
+
+function buildSimplePdf(lines: PdfLine[], rawOps: string[] = []): Blob {
+  let y = 800;
+  const streamLines = lines.map((line) => {
+    y -= line.yGap ?? 16;
+    const size = line.size ?? 10;
+    const font = line.bold ? '/F2' : '/F1';
+    const color = line.color === 'green' ? `${GREEN} rg` : '0 0 0 rg';
+    return `BT\n${color}\n${font} ${size} Tf\n${textX(line.text, size, line.align, line.x)} ${y} Td\n(${escapePdfText(line.text)}) Tj\nET`;
+  });
+  const stream = [...rawOps, ...streamLines].join('\n');
+  const objects = [
+    '<< /Type /Catalog /Pages 2 0 R >>',
+    '<< /Type /Pages /Kids [3 0 R] /Count 1 >>',
+    '<< /Type /Page /Parent 2 0 R /MediaBox [0 0 595 842] /Resources << /Font << /F1 4 0 R /F2 5 0 R >> >> /Contents 6 0 R >>',
+    '<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica >>',
+    '<< /Type /Font /Subtype /Type1 /BaseFont /Helvetica-Bold >>',
+    `<< /Length ${stream.length} >>\nstream\n${stream}\nendstream`,
+  ];
+
+  let pdf = '%PDF-1.4\n';
+  const offsets = [0];
+  objects.forEach((object, index) => {
+    offsets.push(pdf.length);
+    pdf += `${index + 1} 0 obj\n${object}\nendobj\n`;
+  });
+  const xref = pdf.length;
+  pdf += `xref\n0 ${objects.length + 1}\n0000000000 65535 f \n`;
+  offsets.slice(1).forEach((offset) => {
+    pdf += `${String(offset).padStart(10, '0')} 00000 n \n`;
+  });
+  pdf += `trailer\n<< /Size ${objects.length + 1} /Root 1 0 R >>\nstartxref\n${xref}\n%%EOF\n`;
+  return new Blob([pdf], { type: 'application/pdf' });
+}
+
+export function buildWarehouseInvoicePdf(invoice: WarehouseFeeInvoice, kind: 'INVOICE' | 'RECEIPT') {
+  const paid = kind === 'RECEIPT' || invoice.status === 'PAID';
+  const title = `Warehouse Fee ${kind === 'RECEIPT' ? 'Receipt' : 'Invoice'}`;
+  const bookingReference = firstText(invoice.bookingReference);
+  const customerName = firstText(invoice.customerName);
+  const inventoryReference = firstText(invoice.inventoryReference);
+  const inventoryInfo = firstText(invoice.inventoryInfo, invoice.containerNumber, invoice.cargoDescription);
+  const clearanceStatus = firstText(
+    invoice.clearanceStatus,
+    paid ? 'FEE PAID - READY FOR RELEASE' : 'PENDING PAYMENT',
+  );
+  const lines: PdfLine[] = [
+    { text: 'Ethio-Djibouti Railway S.C.', size: 12, bold: true, yGap: 0, align: 'center' },
+    { text: title, size: 23, bold: true, yGap: 28, align: 'center' },
+    { text: `Document No: ${invoice.invoiceNumber}`, size: 12, bold: true, yGap: 32, align: 'center' },
+    { text: `Status: ${invoice.status.replace(/_/g, ' ')}     Type: ${invoice.invoiceType.replace(/_/g, ' ')}`, align: 'center' },
+    { text: `Booking Reference: ${bookingReference}     Customer: ${customerName}`, align: 'center' },
+    { text: `Inventory Reference: ${inventoryReference}     Inventory Info: ${inventoryInfo}`, align: 'center' },
+    { text: `Clearance: ${clearanceStatus}`, align: 'center' },
+    { text: `Issued: ${fmtDate(invoice.issuedAt)}     Paid At: ${fmtDate(invoice.paidAt)}`, align: 'center' },
+    { text: 'ITEMS', size: 13, bold: true, yGap: 30, align: 'center' },
+    ...(invoice.items ?? []).flatMap((item) => [
+      { text: item.description, bold: true, align: 'center' as const },
+      {
+        text: `${item.feeType.replace(/_/g, ' ')} | Qty ${Number(item.quantity ?? 0).toLocaleString()} | Rate ${money(item.unitRate, item.currency)} | Amount ${money(item.amount, item.currency)}`,
+        yGap: 13,
+        align: 'center' as const,
+      },
+    ]),
+    { text: 'TOTALS', size: 13, bold: true, yGap: 30, align: 'center' },
+    { text: `Subtotal: ${money(invoice.subtotalAmount, invoice.currency)}`, align: 'center' },
+    { text: `Tax: ${money(invoice.taxAmount, invoice.currency)}`, align: 'center' },
+    { text: `Total: ${money(invoice.totalAmount, invoice.currency)}`, bold: true, align: 'center' },
+    { text: `Paid: ${money(invoice.paidAmount, invoice.currency)}`, align: 'center' },
+    { text: `Balance: ${money(invoice.balanceAmount, invoice.currency)}`, bold: true, align: 'center' },
+  ];
+  const authorizationOps = [
+    ...buildAuthorizationBand('PAID'),
+    textOp('Prepared by EDR warehouse finance', 72, 196, 10),
+    textOp('Finance officer name / signature / date:', 72, 164, 10),
+    lineOp(245, 162, 360, 162, '0 0 0'),
+  ];
+  const invoiceOps = [
+    lineOp(60, 242, 535, 242),
+    textOp('Prepared by EDR warehouse finance', 72, 196, 10),
+    textOp('Finance officer name / signature / date:', 72, 164, 10),
+    lineOp(245, 162, 360, 162, '0 0 0'),
+  ];
+  return buildSimplePdf(lines, paid ? authorizationOps : invoiceOps);
+}
+
+const firstText = (...values: Array<unknown>) => {
+  for (const value of values) {
+    if (value !== null && value !== undefined && String(value).trim()) return String(value);
+  }
+  return '-';
+};
+
+const tons = (value: unknown) => {
+  const num = Number(value ?? 0);
+  if (!Number.isFinite(num) || num <= 0) return null;
+  return `${num.toLocaleString(undefined, { maximumFractionDigits: 3 })} ton`;
+};
+
+const containerSummary = (booking?: BookingDetail | null, inventory?: WarehouseInventoryItem) => {
+  const explicitNumber = (inventory as unknown as { containerNumber?: string | null })?.containerNumber;
+  if (explicitNumber) return explicitNumber;
+  const containers = booking?.bookingContainers ?? [];
+  if (!containers.length) return '-';
+  return containers
+    .map((item) => {
+      const type = item.containerType?.code ?? item.containerType?.label ?? item.containerTypeId;
+      return `${item.quantity} x ${type}`;
+    })
+    .join(', ');
+};
+
+export function buildWarehouseExitPaperPdf(input: WarehouseFeeInvoice | WarehouseExitPaperContext, releasedItemArg?: WarehouseInventoryItem) {
+  const context: WarehouseExitPaperContext =
+    'invoice' in input ? input : { invoice: input, releasedItem: releasedItemArg };
+  const { invoice, booking } = context;
+  const releasedItem = context.releasedItem;
+  const inventory = context.inventory ?? releasedItem;
+  const releasedAt = context.releasedAt ?? new Date();
+  const releaseReference = firstText(
+    inventory?.releaseOrderReference,
+    releasedItem?.releaseOrderReference,
+    invoice.inventoryReference,
+    booking?.reference ? `REL-${booking.reference.replace(/^BK-?/i, '')}` : null,
+  );
+  const customerName = firstText(
+    booking?.company?.name,
+    booking?.company?.companyName,
+    booking?.company?.label,
+    booking?.company?.contactPersonName,
+    invoice.customerName,
+  );
+  const weightTons = firstText(tons(booking?.cargoTotalWeightVgm), tons(inventory?.weight));
+  const inventoryInfo = firstText(
+    invoice.inventoryInfo,
+    invoice.containerNumber,
+    invoice.cargoDescription,
+    inventory?.status,
+    releasedItem?.status,
+  );
+  const bookingReference = firstText(
+    booking?.reference,
+    (inventory as unknown as { bookingReference?: string })?.bookingReference,
+    invoice.bookingReference,
+    releasedItem?.booking?.reference,
+  );
+
+  return buildSimplePdf([
+    { text: 'Ethio-Djibouti Railway S.C.', size: 12, bold: true, yGap: 0, align: 'center' },
+    { text: 'Warehouse Release / Exit Paper', size: 23, bold: true, yGap: 28, align: 'center' },
+    { text: '[ GATE CLEARANCE ]', size: 14, bold: true, color: 'green', yGap: 24, align: 'center' },
+    { text: `Release Reference: ${releaseReference}`, bold: true, yGap: 30, align: 'center' },
+    { text: `Invoice No: ${invoice.invoiceNumber}`, align: 'center' },
+    { text: `Booking Reference: ${bookingReference}`, align: 'center' },
+    { text: `Customer: ${customerName}`, align: 'center' },
+    { text: `Inventory Info: ${inventoryInfo}`, align: 'center' },
+    { text: `Warehouse: ${firstText(inventory?.warehouse?.name, inventory?.warehouse?.code)}`, align: 'center' },
+    { text: `Yard: ${firstText(inventory?.yard?.name, inventory?.yard?.code)}`, align: 'center' },
+    { text: `Zone: ${firstText(inventory?.zone?.name, inventory?.zone?.code)}`, align: 'center' },
+    { text: `Booking Container: ${containerSummary(booking, inventory)}`, align: 'center' },
+    { text: `Weight: ${weightTons}`, align: 'center' },
+    { text: `Inventory Status: ${releasedItem?.status ?? inventory?.status ?? 'RELEASED'}`, align: 'center' },
+    { text: `Clearance: ${invoice.clearanceStatus ?? 'CLEARED FOR WAREHOUSE EXIT'}`, bold: true, color: 'green', align: 'center' },
+    { text: `Release Date & Time: ${fmtDate(releasedAt)}`, align: 'center' },
+    { text: 'This sealed document authorizes the listed booking/goods to leave the warehouse gate.', yGap: 30, align: 'center' },
+  ], [
+    ...buildWarehouseOfficerSealBand(),
+  ]);
+}
--- a/apps/edr-freight-web/backoffice/src/constants/URLS.ts
+++ b/apps/edr-freight-web/backoffice/src/constants/URLS.ts
@@ -250,6 +250,24 @@ export const URL_CONSTANTS = {
    PIN_WAGONS: (id: string) => `/train-scheduling/schedules/${id}/pin-wagons`,
    FINALIZE: (id: string) => `/train-scheduling/schedules/${id}/finalize`,
    DISPATCH: (id: string) => `/train-scheduling/schedules/${id}/dispatch`,
+    IMPORT_DJIBOUTI: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti`,
+    IMPORT_DJIBOUTI_DOCUMENTS: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/documents`,
+    IMPORT_DJIBOUTI_GATEPASS_GRANTED: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/gatepass-granted`,
+    IMPORT_DJIBOUTI_READY_FOR_LOADING: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/ready-for-loading`,
+    IMPORT_DJIBOUTI_LOADED_ON_TRAIN: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/loaded-on-train`,
+    IMPORT_DJIBOUTI_DEPART: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/depart`,
+    IMPORT_DJIBOUTI_LOAD_LIST: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/load-list`,
+    IMPORT_DJIBOUTI_LOAD_LIST_DOCUMENT: (id: string) =>
+      `/train-scheduling/schedules/${id}/import-djibouti/load-list/document`,
+    EXPORT_LOAD_LIST_DOCUMENT: (id: string) =>
+      `/train-scheduling/schedules/${id}/export/load-list/document`,
    CHECKPOINTS: (id: string) => `/train-scheduling/schedules/${id}/checkpoints`,
    ARRIVE: (id: string) => `/train-scheduling/schedules/${id}/arrive`,
    RESCHEDULE_PREVIEW: (id: string) =>
@@ -380,6 +398,7 @@ export const URL_CONSTANTS = {
    RECEIVE_BULK: '/warehouse-inventory/receive-bulk',
    LOAD_PASSED_EXPORT: '/warehouse-inventory/load-passed-export',
    BULK_MARK_INSPECTED: '/warehouse-inventory/bulk-mark-inspected',
+    RECEIVED_EXPORT: '/warehouse-inventory/received-export',
    READY_TO_LOAD_EXPORT: '/warehouse-inventory/ready-to-load-export',
    LOADED_EXPORT: '/warehouse-inventory/loaded-export',
    BULK_DISPATCH_EXPORT: '/warehouse-inventory/bulk-dispatch-export',
@@ -416,6 +435,8 @@ export const URL_CONSTANTS = {
  WAREHOUSE_INVOICES: {
    BASE: '/warehouse-fee-invoices',
    BY_ID: (id: string) => `/warehouse-fee-invoices/${id}`,
+    DOCUMENT: (id: string) => `/warehouse-fee-invoices/${id}/document`,
+    RECEIPT: (id: string) => `/warehouse-fee-invoices/${id}/receipt`,
    CANCEL: (id: string) => `/warehouse-fee-invoices/${id}/cancel`,
    PAY: (id: string) => `/warehouse-fee-invoices/${id}/pay`,
    GENERATE: (inventoryId: string) => `/warehouse-inventory/${inventoryId}/generate-fee-invoice`,
@@ -433,6 +454,23 @@ export const URL_CONSTANTS = {
    CANCEL: (id: string) => `/interchange-documents/${id}/cancel`,
  },

+  IMPORT_OPERATIONS: {
+    DJIBOUTI_INCIDENTS: '/import-operations/djibouti-incidents',
+    CUSTOMS: (bookingId: string) => `/import-operations/customs/${bookingId}`,
+    CUSTOMS_DOCUMENTS: (bookingId: string) => `/import-operations/customs/${bookingId}/documents`,
+    CUSTOMS_DECLARATION: (bookingId: string) => `/import-operations/customs/${bookingId}/declaration`,
+    CUSTOMS_NOTIFY_DUTIES_TAXES: (bookingId: string) =>
+      `/import-operations/customs/${bookingId}/notify-duties-taxes`,
+    CUSTOMS_DUTIES_TAXES_PAID: (bookingId: string) =>
+      `/import-operations/customs/${bookingId}/duties-taxes-paid`,
+    CUSTOMS_RISK: (bookingId: string) => `/import-operations/customs/${bookingId}/risk`,
+    CUSTOMS_RELEASE_PERMITTED: (bookingId: string) =>
+      `/import-operations/customs/${bookingId}/release-permitted`,
+    EMPTY_CONTAINER_RETURNS: '/import-operations/empty-container-returns',
+    EMPTY_CONTAINER_RETURN_STATUS: (id: string) =>
+      `/import-operations/empty-container-returns/${id}/status`,
+  },
+
  VEHICLES: {
    BASE: '/vehicles',
    BY_ID: (id: string) => `/vehicles/${id}`,
--- a/apps/edr-freight-web/backoffice/src/hooks/bookings/useBookings.ts
+++ b/apps/edr-freight-web/backoffice/src/hooks/bookings/useBookings.ts
@@ -1,4 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { isAxiosError } from "axios";
 import toast from "react-hot-toast";

 import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
@@ -9,6 +10,16 @@ import {
 } from "@/services/bookings.service";
 import { invalidateBookingDetail } from "@/utils/queryInvalidation";

+const parseApiError = (error: unknown, fallback: string) => {
+  if (isAxiosError(error)) {
+    const message = error.response?.data?.message;
+    if (Array.isArray(message)) return message.join(", ");
+    if (typeof message === "string") return message;
+  }
+  if (error instanceof Error && error.message) return error.message;
+  return fallback;
+};
+
 export function useBookingList(filter?: BookingListFilter, enabled = true) {
  return useQuery({
    queryKey: QUERY_KEYS.BOOKINGS.list(filter),
@@ -84,7 +95,7 @@ export function useBookingMutations(bookingId: string) {
        requiredRole,
      }),
    onSuccess: (data) => onSuccess(data, "Approval step completed"),
-    onError: () => toast.error("Failed to approve step"),
+    onError: (error) => toast.error(parseApiError(error, "Failed to approve step")),
  });

  const rejectStep = useMutation({
@@ -101,7 +112,7 @@ export function useBookingMutations(bookingId: string) {
        reason,
      }),
    onSuccess: (data) => onSuccess(data, "Booking rejected at approval step"),
-    onError: () => toast.error("Failed to reject step"),
+    onError: (error) => toast.error(parseApiError(error, "Failed to reject step")),
  });

  const generateContract = useMutation({
--- a/apps/edr-freight-web/backoffice/src/pages/bookings/NewBookingPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/bookings/NewBookingPage.tsx
@@ -42,19 +42,10 @@ import { useEffect, useMemo, useState } from "react";
 import toast from "react-hot-toast";
 import { useNavigate } from "react-router-dom";

-import { api } from "@/auth/http";
 import Breadcrumbs from "@/components/ui/Breadcrumbs";
-import { URL_CONSTANTS } from "@/constants/URLS";
 import { api as appApi } from "@/services/api";
 import { bookingsService } from "@/services/bookings.service";
-import { unwrap } from "@/utils/endpoint";
-
-interface CompanyOption {
-  id: string;
-  name?: string | null;
-  tin?: string | null;
-  email?: string | null;
-}
+import { customersService } from "@/services/customers.service";

 type FreightType = "CONTAINER" | "BULK";

@@ -219,15 +210,12 @@ export default function NewBookingPage() {
    queryFn: () => bookingsService.getReferenceData() as Promise<ReferenceData>,
  });

-  const { data: companies, isLoading: companiesLoading } = useQuery({
+  const { data: companiesPage, isLoading: companiesLoading } = useQuery({
    queryKey: ["companies", "list"],
-    queryFn: async () => {
-      const res = await api.get(URL_CONSTANTS.COMPANIES.BASE);
-      return unwrap(res.data) as CompanyOption[];
-    },
+    queryFn: () => customersService.list({ page: 1, pageSize: 1000 }),
  });

-  const companyOptions = (companies ?? []).map((c) => ({
+  const companyOptions = (companiesPage?.items ?? []).map((c) => ({
    value: c.id,
    label: c.name || c.email || c.tin || c.id,
  }));
--- a/apps/edr-freight-web/backoffice/src/pages/customers/CustomerDetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/customers/CustomerDetailPage.tsx
@@ -22,7 +22,7 @@ import {
  LayoutGrid,
  Package,
 } from "lucide-react";
-import { useMutation, useQuery } from "@tanstack/react-query";
+import { useQuery } from "@tanstack/react-query";
 import { useMemo } from "react";
 import { useNavigate, useParams } from "react-router-dom";

@@ -85,9 +85,6 @@ export default function CustomerDetailPage() {
      enabled: Boolean(id),
    }),
  );
-  const approveMutation = useMutation(
-    api.customers.setCompanyStatus.mutationOptions(),
-  );
  const bookingsQuery = useQuery(
    api.customers.bookings.queryOptions({
      input: { id: id ?? "" },
@@ -395,28 +392,12 @@ export default function CustomerDetailPage() {
        ]}
        backTo="/dashboard/customers"
        title={company.name}
-        subtitle={`TIN ${company.tin}${
-          company.country ? ` · ${company.country}` : ""
-        }`}
+        subtitle={`TIN ${company.tin}${company.country ? ` · ${company.country}` : ""
+          }`}
        meta={
          <Group gap="xs" wrap="nowrap">
            <CompanyTypeBadge type={company.type} />
            <CompanyStatusBadge status={company.status} />
-            {company.status === "pending" && (
-              <Button
-                size="xs"
-                color="green"
-                loading={approveMutation.isPending}
-                onClick={() =>
-                  approveMutation.mutate({
-                    companyId: company.id,
-                    status: "active",
-                  })
-                }
-              >
-                Approve
-              </Button>
-            )}
          </Group>
        }
      />
@@ -547,9 +528,9 @@ export default function CustomerDetailPage() {
              error={
                bookingsQuery.isError
                  ? {
-                      message: "Failed to load bookings.",
-                      onRetry: () => void bookingsQuery.refetch(),
-                    }
+                    message: "Failed to load bookings.",
+                    onRetry: () => void bookingsQuery.refetch(),
+                  }
                  : undefined
              }
            />
@@ -568,9 +549,9 @@ export default function CustomerDetailPage() {
              error={
                documentsQuery.isError
                  ? {
-                      message: "Failed to load documents.",
-                      onRetry: () => void documentsQuery.refetch(),
-                    }
+                    message: "Failed to load documents.",
+                    onRetry: () => void documentsQuery.refetch(),
+                  }
                  : undefined
              }
            />
@@ -589,9 +570,9 @@ export default function CustomerDetailPage() {
              error={
                paymentsQuery.isError
                  ? {
-                      message: "Failed to load payments.",
-                      onRetry: () => void paymentsQuery.refetch(),
-                    }
+                    message: "Failed to load payments.",
+                    onRetry: () => void paymentsQuery.refetch(),
+                  }
                  : undefined
              }
            />
--- a/apps/edr-freight-web/backoffice/src/pages/dashboard/user-management/UserManagementHostPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/dashboard/user-management/UserManagementHostPage.tsx
@@ -1,23 +1,34 @@
-import { useEffect, useRef } from "react";
-import { createRoot, type Root } from "react-dom/client";
+import { useEffect, useRef } from 'react';
+import { createRoot, type Root } from 'react-dom/client';
 import {
  UserManagementApp,
  type UserManagementRuntimeOptions,
  type UserManagementSessionSeed,
-} from "@tria-plc/iamui";
+} from '@tria-plc/iamui';
+import { iamConfig } from './iamConfig';

-import { getCookie } from "@/auth/cookies";
+function readCookieValue(name: string): string | null {
+  const escaped = name.replace(/([.$?*|{}()[\]\\/+^])/g, '\\$1');
+  const match = document.cookie.match(
+    new RegExp(`(?:^|; )${escaped}=([^;]*)`),
+  );

-import { iamConfig } from "./iamConfig";
+  return match ? decodeURIComponent(match[1]) : null;
+}

 function readInitialSession(): UserManagementSessionSeed | null {
-  const token = getCookie("auth-token");
+  const token =
+    localStorage.getItem('fhc-backoffice-auth-token') ??
+    readCookieValue('auth-token');

  if (!token) {
    return null;
  }

-  const refreshToken = getCookie("refresh-token") ?? undefined;
+  const refreshToken =
+    localStorage.getItem('fhc-backoffice-auth-refresh-token') ??
+    readCookieValue('refresh-token') ??
+    undefined;

  return {
    token,
@@ -47,15 +58,14 @@ export default function UserManagementHostPage() {
      rootRef.current = createRoot(mountNode);
    }

-    const apiBaseUrl = import.meta.env.VITE_BASE_API_URL.replace(/\/+$/, "");
-    const iamApiUrl = "/um-api";
+    const apiBaseUrl = import.meta.env.VITE_BASE_API_URL.replace(/\/+$/, '');
    const runtime: UserManagementRuntimeOptions = {
-      basename: "/um",
+      basename: '/um',
      apiBaseUrl,
-      apiUrl: iamApiUrl,
-      recordApiUrl: iamApiUrl,
-      chronicleUrl: iamApiUrl,
-      auditApiUrl: iamApiUrl,
+      apiUrl: `${apiBaseUrl}/api`,
+      recordApiUrl: `${apiBaseUrl}/api`,
+      chronicleUrl: `${apiBaseUrl}/api`,
+      auditApiUrl: `${apiBaseUrl}/api`,
    };

    rootRef.current.render(
@@ -78,5 +88,5 @@ export default function UserManagementHostPage() {
    };
  }, []);

-  return <div ref={mountRef} style={{ position: "fixed", inset: 0 }} />;
+  return <div ref={mountRef} style={{ position: 'fixed', inset: 0 }} />;
 }
--- a/apps/edr-freight-web/backoffice/src/pages/fleet/config/vehicles.ts
+++ b/apps/edr-freight-web/backoffice/src/pages/fleet/config/vehicles.ts
@@ -59,6 +59,8 @@ export const vehiclesConfig: FleetResourceConfig = {
    { id: "fuelType", header: "Fuel Type", accessorKey: "fuelType", format: "code", size: 110 },
    { id: "capacity", header: "Capacity (tons)", accessorKey: "capacity", format: "number", size: 130 },
    { id: "assignedDriverName", header: "Assigned Driver", accessorKey: "assignedDriverName", format: "code", size: 140 },
+    { id: "estimatedDistanceKm", header: "Est. Distance (KM)", accessorKey: "estimatedDistanceKm", format: "number", size: 150 },
+    { id: "actualDistanceKm", header: "Actual Distance (KM)", accessorKey: "actualDistanceKm", format: "number", size: 150 },
    { id: "status", header: "Status", accessorKey: "status", format: "statusBadge", size: 100 },
  ],
  formFields: [
@@ -72,6 +74,8 @@ export const vehiclesConfig: FleetResourceConfig = {
    { name: "year", label: "Year", type: "number", required: true },
    { name: "fuelType", label: "Fuel Type", type: "select", required: true, options: FUEL_TYPE_OPTIONS },
    { name: "capacity", label: "Capacity", type: "number", required: true },
+    { name: "estimatedDistanceKm", label: "Estimated Distance (KM)", type: "number" },
+    { name: "actualDistanceKm", label: "Actual Distance (KM)", type: "number" },
    { name: "status", label: "Status", type: "select", required: true, options: VEHICLE_STATUS_OPTIONS },
    { name: "description", label: "Description", type: "textarea" },
  ],
@@ -86,6 +90,8 @@ export const vehiclesConfig: FleetResourceConfig = {
    year: new Date().getFullYear(),
    fuelType: "DIESEL",
    capacity: 0,
+    estimatedDistanceKm: "",
+    actualDistanceKm: "",
    status: "ACTIVE",
    description: "",
  },
--- a/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/FirstMilePage.tsx
@@ -22,6 +22,7 @@ import {
  Group,
  Menu,
  Modal,
+  NumberInput,
  Select,
  SimpleGrid,
  Stack,
@@ -67,7 +68,7 @@ type StatusFilter = "ALL" | FirstMileApiStatus | AssignmentStatus;

 const FILTER_OPTIONS: { value: StatusFilter; label: string }[] = [
  { value: "ALL", label: "All" },
-  ...FIRST_MILE_STATUSES.map((s) => ({ value: s as StatusFilter, label: STATUS_META[s].label })),
+  ...FIRST_MILE_STATUSES.filter((s) => s !== "PAYMENT_PENDING").map((s) => ({ value: s as StatusFilter, label: STATUS_META[s].label })),
  { value: "ASSIGNED", label: "Assigned" },
  { value: "UNASSIGNED", label: "Unassigned" },
 ];
@@ -89,12 +90,10 @@ const bookingRef = (r: FirstMileRecord) => r.booking?.reference ?? r.bookingId;
 const customerName = (r: FirstMileRecord) => r.booking?.company?.name ?? "—";
 const pickupLocation = (r: FirstMileRecord) => r.booking?.firstMilePickupAddress ?? "—";
 const cargoDesc = (r: FirstMileRecord) => {
-  const parts = [r.booking?.cargoType?.name ?? r.booking?.cargoFreeText].filter(Boolean);
+  const parts = [r.booking?.cargoType?.label ?? r.booking?.cargoFreeText].filter(Boolean);
  if (r.booking?.cargoTotalWeightVgm) parts.push(`${r.booking.cargoTotalWeightVgm} t`);
  return parts.join(" · ") || "—";
 };
-const priceAmount = (r: FirstMileRecord) =>
-  r.booking?.totalAmount ?? r.advancedPayment;
 // First-mile destination is the origin yard (pickup → origin yard)
 const destinationYardName = (r: FirstMileRecord) =>
  r.booking?.originYard?.label ?? "—";
@@ -142,11 +141,14 @@ const BookingInfo = ({ record }: { record: FirstMileRecord }) => (
        <InfoRow label="Pickup location" value={pickupLocation(record)} />
        <InfoRow label="Destination (origin yard)" value={destinationYardName(record)} />
        <InfoRow label="Cargo" value={cargoDesc(record)} />
-        <InfoRow label="Price" value={formatPrice(priceAmount(record))} />
+        <InfoRow label="Advanced Payment" value={formatPrice(record.advancedPayment)} />
+        <InfoRow label="Post Payment" value={formatPrice(record.remainingPayment)} />
        <InfoRow label="Contact" value={contactPersonName(record)} />
        <InfoRow label="Phone" value={contactPhone(record)} />
        <InfoRow label="Requested date" value={requestedDate(record)} />
        <InfoRow label="Assigned vehicle" value={vehicleLabel(record) ?? "—"} />
+        <InfoRow label="Est. Distance (KM)" value={record.estimatedKm != null ? String(record.estimatedKm) : "—"} />
+        <InfoRow label="Actual Distance (KM)" value={record.exactKm != null ? String(record.exactKm) : "—"} />
      </SimpleGrid>
    </Stack>
  </Card>
@@ -158,10 +160,13 @@ const tripSlipRows = (record: FirstMileRecord): [string, string][] => [
  ["Pickup location", pickupLocation(record)],
  ["Destination yard", destinationYardName(record)],
  ["Cargo", cargoDesc(record)],
-  ["Price", formatPrice(priceAmount(record))],
+  ["Advanced Payment", formatPrice(record.advancedPayment)],
+  ["Post Payment", formatPrice(record.remainingPayment)],
  ["Vehicle", vehicleLabel(record) ?? "Unassigned"],
  ["Contact", `${contactPersonName(record)} · ${contactPhone(record)}`],
  ["Requested date", requestedDate(record)],
+  ["Est. Distance (KM)", record.estimatedKm != null ? String(record.estimatedKm) : "—"],
+  ["Actual Distance (KM)", record.exactKm != null ? String(record.exactKm) : "—"],
  ["Status", STATUS_META[record.status].label],
 ];

@@ -323,6 +328,9 @@ const FirstMilePage = () => {
  const [acceptVehicleValue, setAcceptVehicleValue] = useState<string | null>(null);
  const [bookingSearch, setBookingSearch] = useState("");

+  const [distanceOpen, setDistanceOpen] = useState(false);
+  const [distanceValue, setDistanceValue] = useState("");
+
  const { data: listData, isLoading } = useQuery({
    queryKey: QUERY_KEYS.FIRST_MILE.list(),
    queryFn: async () => {
@@ -347,6 +355,10 @@ const FirstMilePage = () => {
  const paidBookings = paidBookingsData?.items ?? [];

  const records = listData?.data ?? [];
+  const existingFirstMileBookingIds = useMemo(
+    () => new Set(records.map((record) => record.bookingId)),
+    [records],
+  );

  const vehicleOptions = useMemo(
    () =>
@@ -371,10 +383,28 @@ const FirstMilePage = () => {
    },
  });

+  const updateDistanceMutation = useMutation({
+    mutationFn: ({ id, exactKm }: { id: string; exactKm: number }) =>
+      firstMileService.update(id, { exactKm }),
+    onSuccess: () => {
+      void qc.invalidateQueries({ queryKey: QUERY_KEYS.FIRST_MILE.ROOT });
+      if (activeRecord) {
+        toast({ title: "Distance updated", description: `${bookingRef(activeRecord)} → ${distanceValue} km` });
+      }
+      closeDistance();
+    },
+    onError: () => {
+      toast({ title: "Update failed", variant: "destructive" });
+    },
+  });
+
  const acceptMutation = useMutation({
    mutationFn: async ({ reference, vehicleId }: { reference: string; vehicleId: string | null }) => {
      const res = await firstMileService.accept(reference);
      const created = res.data;
+      if (!created?.id) {
+        throw new Error("First-mile leg was not created for this booking.");
+      }
      if (vehicleId) await firstMileService.update(created.id, { vehicleId });
      return created;
    },
@@ -383,8 +413,11 @@ const FirstMilePage = () => {
      toast({ title: "Booking accepted", description: "First-mile leg created successfully." });
      closeAccept();
    },
-    onError: () => {
-      toast({ title: "Accept failed", variant: "destructive" });
+    onError: (err: unknown) => {
+      const description =
+        (err as { response?: { data?: { message?: string } } })?.response?.data?.message ??
+        (err instanceof Error ? err.message : undefined);
+      toast({ title: "Accept failed", description, variant: "destructive" });
    },
  });

@@ -398,16 +431,26 @@ const FirstMilePage = () => {
    [rowSelection],
  );

+  const firstMileEligiblePaidBookings = useMemo(
+    () =>
+      paidBookings.filter(
+        (booking) =>
+          booking.tradeDirection === "EXPORT" &&
+          !existingFirstMileBookingIds.has(booking.id),
+      ),
+    [existingFirstMileBookingIds, paidBookings],
+  );
+
  const filteredPaidBookings = useMemo(() => {
    const term = bookingSearch.trim().toLowerCase();
-    if (!term) return paidBookings;
-    return paidBookings.filter((b) =>
+    if (!term) return firstMileEligiblePaidBookings;
+    return firstMileEligiblePaidBookings.filter((b) =>
      [b.reference, b.company?.name, b.company?.companyName]
        .join(" ")
        .toLowerCase()
        .includes(term),
    );
-  }, [paidBookings, bookingSearch]);
+  }, [firstMileEligiblePaidBookings, bookingSearch]);

  const openAccept = () => {
    setAcceptOpen(true);
@@ -430,6 +473,27 @@ const FirstMilePage = () => {
    acceptMutation.mutate({ reference: selectedBooking.reference, vehicleId: acceptVehicleValue });
  };

+  const openDistance = (id: string) => {
+    setActiveId(id);
+    setDistanceValue("");
+    setDistanceOpen(true);
+  };
+
+  const closeDistance = () => {
+    setDistanceOpen(false);
+    setActiveId(null);
+    setDistanceValue("");
+  };
+
+  const handleSaveDistance = () => {
+    const distance = parseFloat(distanceValue);
+    if (!activeId || isNaN(distance) || distance < 0) {
+      toast({ title: "Invalid distance", description: "Enter a valid distance value.", variant: "destructive" });
+      return;
+    }
+    updateDistanceMutation.mutate({ id: activeId, exactKm: distance });
+  };
+
  const matchesFilter = (r: FirstMileRecord) => {
    switch (statusFilter) {
      case "ALL": return true;
@@ -608,10 +672,16 @@ const FirstMilePage = () => {
        cell: ({ row }) => cargoDesc(row.original),
      },
      {
-        id: "price",
-        header: "Price",
+        id: "advancedPayment",
+        header: "Advanced Payment",
        meta: { headerClassName, cellClassName },
-        cell: ({ row }) => formatPrice(priceAmount(row.original)),
+        cell: ({ row }) => formatPrice(row.original.advancedPayment),
+      },
+      {
+        id: "postPayment",
+        header: "Post Payment",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => formatPrice(row.original.remainingPayment),
      },
      {
        id: "vehicle",
@@ -619,6 +689,18 @@ const FirstMilePage = () => {
        meta: { headerClassName, cellClassName },
        cell: ({ row }) => vehicleLabel(row.original) ?? <Text c="dimmed">—</Text>,
      },
+      {
+        id: "estimatedKm",
+        header: "Est. Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.estimatedKm != null ? row.original.estimatedKm : <Text c="dimmed">—</Text>,
+      },
+      {
+        id: "exactKm",
+        header: "Actual Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.exactKm != null ? row.original.exactKm : <Text c="dimmed">—</Text>,
+      },
      {
        id: "status",
        header: "Status",
@@ -684,6 +766,11 @@ const FirstMilePage = () => {
                  >
                    View detail
                  </Menu.Item>
+                  <Menu.Item
+                    onClick={() => openDistance(row.original.id)}
+                  >
+                    Add Actual distance
+                  </Menu.Item>
                  {canPrint && (
                    <Menu.Item
                      leftSection={<Printer size={15} />}
@@ -879,7 +966,7 @@ const FirstMilePage = () => {
              {bookingsLoading ? (
                <Text c="dimmed" size="sm" ta="center" py="md">Loading bookings…</Text>
              ) : filteredPaidBookings.length === 0 ? (
-                <Text c="dimmed" size="sm" ta="center" py="md">No paid bookings found.</Text>
+                <Text c="dimmed" size="sm" ta="center" py="md">No paid export bookings need first mile.</Text>
              ) : (
                filteredPaidBookings.map((b) => (
                  <UnstyledButton
@@ -988,6 +1075,53 @@ const FirstMilePage = () => {
          </Stack>
        )}
      </Modal>
+
+      {/* Add Actual Distance modal */}
+      <Modal
+        opened={distanceOpen}
+        onClose={closeDistance}
+        title={<Text fw={600}>Add Actual Distance</Text>}
+        size="md"
+        radius="lg"
+        centered
+      >
+        <Stack gap="md">
+          {activeRecord && (
+            <Card withBorder padding="md" radius="md" bg="var(--mantine-color-gray-0)">
+              <Stack gap="sm">
+                <Text fw={600} size="sm">{bookingRef(activeRecord)}</Text>
+                <Group justify="space-between">
+                  <Text size="xs" c="dimmed">Customer</Text>
+                  <Text size="sm">{customerName(activeRecord)}</Text>
+                </Group>
+                <Group justify="space-between">
+                  <Text size="xs" c="dimmed">Est. Distance (KM)</Text>
+                  <Text size="sm">{activeRecord.estimatedKm ?? "—"}</Text>
+                </Group>
+              </Stack>
+            </Card>
+          )}
+          <NumberInput
+            label="Actual Distance (KM)"
+            placeholder="Enter distance"
+            value={distanceValue}
+            onChange={(v) => setDistanceValue(String(v ?? ""))}
+            min={0}
+            step={0.1}
+            decimalScale={2}
+          />
+          <Group justify="flex-end" gap="sm">
+            <Button variant="default" onClick={closeDistance}>Cancel</Button>
+            <Button
+              onClick={handleSaveDistance}
+              loading={updateDistanceMutation.isPending}
+              disabled={!distanceValue}
+            >
+              Save
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
    </Stack>
  );
 };
--- a/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/operations/LastMilePage.tsx
@@ -66,7 +66,7 @@ type StatusFilter = "ALL" | LastMileApiStatus | AssignmentStatus;

 const FILTER_OPTIONS: { value: StatusFilter; label: string }[] = [
  { value: "ALL", label: "All" },
-  ...LAST_MILE_STATUSES.map((s) => ({ value: s as StatusFilter, label: STATUS_META[s].label })),
+  ...LAST_MILE_STATUSES.filter((s) => s !== "PAYMENT_PENDING").map((s) => ({ value: s as StatusFilter, label: STATUS_META[s].label })),
  { value: "ASSIGNED", label: "Assigned" },
  { value: "UNASSIGNED", label: "Unassigned" },
 ];
@@ -87,14 +87,12 @@ const bookingRef = (r: LastMileRecord) => r.booking?.reference ?? r.bookingId;
 const customerName = (r: LastMileRecord) => r.booking?.company?.name ?? "—";
 const deliveryLocation = (r: LastMileRecord) => r.booking?.lastMileDeliveryAddress ?? "—";
 const cargoDesc = (r: LastMileRecord) => {
-  const parts = [r.booking?.cargoType?.name ?? r.booking?.cargoFreeText].filter(Boolean);
+  const parts = [r.booking?.cargoType?.cargoTypeName ?? r.booking?.cargoType?.label ?? r.booking?.cargoType?.name ?? r.booking?.cargoFreeText].filter(Boolean);
  if (r.booking?.cargoTotalWeightVgm) parts.push(`${r.booking.cargoTotalWeightVgm} t`);
  return parts.join(" · ") || "—";
 };
-const priceAmount = (r: LastMileRecord) =>
-  r.booking?.totalAmount ?? r.advancedPayment;
 const originYardName = (r: LastMileRecord) =>
-  r.booking?.originYard?.name ?? "—";
+  r.booking?.originYard?.label ?? r.booking?.originYard?.name ?? "—";
 const contactPersonName = (r: LastMileRecord) =>
  r.booking?.company?.contactPersonName ?? "—";
 const contactPhone = (r: LastMileRecord) =>
@@ -104,7 +102,7 @@ const requestedDate = (r: LastMileRecord) => {
  return d ? new Date(d).toISOString().slice(0, 10) : "—";
 };
 const serviceTypeName = (r: LastMileRecord) =>
-  r.booking?.serviceType?.name ?? "—";
+  r.booking?.serviceType?.label ?? r.booking?.serviceType?.name ?? "—";

 const InfoRow = ({ label, value }: { label: string; value: string }) => (
  <Stack gap={2}>
@@ -130,14 +128,17 @@ const BookingInfo = ({ record }: { record: LastMileRecord }) => (
      <SimpleGrid cols={2} spacing="sm">
        <InfoRow label="Customer" value={customerName(record)} />
        <InfoRow label="Service type" value={serviceTypeName(record)} />
-        <InfoRow label="Origin yard" value={originYardName(record)} />
+        <InfoRow label="Pickup (origin yard)" value={originYardName(record)} />
        <InfoRow label="Destination" value={deliveryLocation(record)} />
        <InfoRow label="Cargo" value={cargoDesc(record)} />
-        <InfoRow label="Price" value={formatPrice(priceAmount(record))} />
+        <InfoRow label="Advanced Payment" value={formatPrice(record.advancedPayment)} />
+        <InfoRow label="Post Payment" value={formatPrice(record.remainingPayment)} />
        <InfoRow label="Contact" value={contactPersonName(record)} />
        <InfoRow label="Phone" value={contactPhone(record)} />
        <InfoRow label="Requested date" value={requestedDate(record)} />
        <InfoRow label="Assigned vehicle" value={vehicleLabel(record) ?? "—"} />
+        <InfoRow label="Est. Distance (KM)" value={record.estimatedKm != null ? String(record.estimatedKm) : "—"} />
+        <InfoRow label="Actual Distance (KM)" value={record.exactKm != null ? String(record.exactKm) : "—"} />
      </SimpleGrid>
    </Stack>
  </Card>
@@ -146,13 +147,16 @@ const BookingInfo = ({ record }: { record: LastMileRecord }) => (
 const tripSlipRows = (record: LastMileRecord): [string, string][] => [
  ["Customer", customerName(record)],
  ["Service", serviceTypeName(record)],
-  ["Origin yard", originYardName(record)],
+  ["Pickup (origin yard)", originYardName(record)],
  ["Destination", deliveryLocation(record)],
  ["Cargo", cargoDesc(record)],
-  ["Price", formatPrice(priceAmount(record))],
+  ["Advanced Payment", formatPrice(record.advancedPayment)],
+  ["Post Payment", formatPrice(record.remainingPayment)],
  ["Vehicle", vehicleLabel(record) ?? "Unassigned"],
  ["Contact", `${contactPersonName(record)} · ${contactPhone(record)}`],
  ["Requested date", requestedDate(record)],
+  ["Est. Distance (KM)", record.estimatedKm != null ? String(record.estimatedKm) : "—"],
+  ["Actual Distance (KM)", record.exactKm != null ? String(record.exactKm) : "—"],
  ["Status", STATUS_META[record.status].label],
 ];

@@ -587,6 +591,12 @@ const LastMilePage = () => {
        meta: { headerClassName, cellClassName },
        cell: ({ row }) => customerName(row.original),
      },
+      {
+        id: "pickup",
+        header: "Pickup",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => originYardName(row.original),
+      },
      {
        id: "destination",
        header: "Destination",
@@ -600,10 +610,16 @@ const LastMilePage = () => {
        cell: ({ row }) => cargoDesc(row.original),
      },
      {
-        id: "price",
-        header: "Price",
+        id: "advancedPayment",
+        header: "Advanced Payment",
        meta: { headerClassName, cellClassName },
-        cell: ({ row }) => formatPrice(priceAmount(row.original)),
+        cell: ({ row }) => formatPrice(row.original.advancedPayment),
+      },
+      {
+        id: "postPayment",
+        header: "Post Payment",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => formatPrice(row.original.remainingPayment),
      },
      {
        id: "vehicle",
@@ -611,6 +627,18 @@ const LastMilePage = () => {
        meta: { headerClassName, cellClassName },
        cell: ({ row }) => vehicleLabel(row.original) ?? <Text c="dimmed">—</Text>,
      },
+      {
+        id: "estimatedKm",
+        header: "Est. Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.estimatedKm != null ? row.original.estimatedKm : <Text c="dimmed">—</Text>,
+      },
+      {
+        id: "exactKm",
+        header: "Actual Distance (KM)",
+        meta: { headerClassName, cellClassName },
+        cell: ({ row }) => row.original.exactKm != null ? row.original.exactKm : <Text c="dimmed">—</Text>,
+      },
      {
        id: "status",
        header: "Status",
--- a/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
@@ -19,6 +19,7 @@ import {
  CheckCircle2,
  Container as ContainerIcon,
  Eye,
+  FileText,
  LayoutGrid,
  Navigation,
  Package,
@@ -55,8 +56,10 @@ import {
 import { TrainCompositionDiagram } from "@/components/trainScheduling/TrainCompositionDiagram";
 import { WagonPlanGrid } from "@/components/trainScheduling/WagonPlanGrid";
 import { WorkflowRail, WorkflowStep } from "@/components/trainScheduling/WorkflowStep";
+import { openPdfBlob } from "@/components/warehouses/pdf";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import { api } from "@/services/api";
+import { trainSchedulingService } from "@/services/trainScheduling.service";
 import { useToast } from "@/hooks/use-toast";
 import type {
  ContainerPlacement,
@@ -123,6 +126,12 @@ export default function TrainScheduleV2DetailPage() {
  const unassign = useMutation(api.trainScheduling.unassignBooking.mutationOptions());
  const finalize = useMutation(api.trainScheduling.finalizeSchedule.mutationOptions());
  const dispatch = useMutation(api.trainScheduling.dispatchSchedule.mutationOptions());
+  const downloadMarshalling = useMutation({
+    mutationFn: ({ id, direction }: { id: string; direction?: string | null }) =>
+      direction === "EXPORT"
+        ? trainSchedulingService.downloadExportLoadListDocument(id)
+        : trainSchedulingService.downloadImportDjiboutiLoadListDocument(id),
+  });

  const assignedIds = useMemo(
    () => (schedule?.bookings ?? []).map((b) => b.id),
@@ -287,6 +296,33 @@ export default function TrainScheduleV2DetailPage() {
  const canDispatch = schedule.status === "SCHEDULED";
  const finalizeStep = hasContainerStep ? 3 : 2;
  const canModifyBookings = canEditBookings && !["DISPATCHED", "ARRIVED"].includes(schedule.status);
+  const canPrintMarshalling = schedule.direction === "IMPORT" || schedule.direction === "EXPORT";
+
+  const openMarshallingDocument = async () => {
+    const pdfWindow = window.open("", "_blank");
+    try {
+      const blob = await downloadMarshalling.mutateAsync({
+        id: scheduleId,
+        direction: schedule.direction,
+      });
+      const prefix = schedule.direction === "EXPORT" ? "export-marshalling" : "import-marshalling";
+      const filename = `${prefix}-${schedule.trainNumber ?? scheduleId}.pdf`;
+      const opened = openPdfBlob(blob, filename, pdfWindow);
+      toast({
+        title: "Marshalling document ready",
+        description: opened
+          ? "The PDF opened in a browser tab for printing or saving."
+          : "The browser blocked the preview tab, so the PDF was downloaded.",
+      });
+    } catch (error) {
+      pdfWindow?.close();
+      toast({
+        title: "Could not open marshalling document",
+        description: parseError(error, "Make sure the train has wagon allocations, then try again."),
+        variant: "destructive",
+      });
+    }
+  };

  const handleAssign = async () => {
    if (!allSelectedIds.length) return;
@@ -749,6 +785,19 @@ export default function TrainScheduleV2DetailPage() {
              </Stack>
            </Group>
            <Group gap="sm">
+              {canPrintMarshalling ? (
+                <Button
+                  variant="light"
+                  color="edr-green"
+                  radius="lg"
+                  size="sm"
+                  leftSection={<FileText size={16} />}
+                  loading={downloadMarshalling.isPending}
+                  onClick={() => void openMarshallingDocument()}
+                >
+                  Marshalling PDF
+                </Button>
+              ) : null}
              {["DISPATCHED", "ARRIVED"].includes(schedule.status) ? (
                <Button
                  component={Link}
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/ArrivalQueuePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/ArrivalQueuePage.tsx
@@ -37,6 +37,12 @@ const getErrorMessage = (error: unknown) => {
  return error instanceof Error ? error.message : undefined;
 };

+const getPendingUnloadBookings = (train: ImportTrain) =>
+  train.pendingUnloadBookings ?? train.totalBookings;
+
+const isFullyUnloaded = (train: ImportTrain) =>
+  Boolean(train.fullyUnloaded) || (train.totalBookings > 0 && getPendingUnloadBookings(train) === 0);
+
 function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
  const { data: items = [], isLoading } = useImportTrainItems(scheduleId);

@@ -67,6 +73,7 @@ function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
          <Table.Th>Weight</Table.Th>
          <Table.Th>Arrival</Table.Th>
          <Table.Th>Status</Table.Th>
+          <Table.Th>Inspection</Table.Th>
          <Table.Th>Pickup</Table.Th>
        </Table.Tr>
      </Table.Thead>
@@ -88,6 +95,11 @@ function ImportTrainDetailRows({ scheduleId }: { scheduleId: string }) {
                {item.currentStatus ?? 'PENDING'}
              </Badge>
            </Table.Td>
+            <Table.Td>
+              <Badge variant="light" color={item.inspectionStatus === 'PASSED' ? 'green' : 'gray'} size="sm">
+                {item.inspectionStatus ?? 'Not inspected'}
+              </Badge>
+            </Table.Td>
            <Table.Td>{item.pickupOption.replace(/_/g, ' ')}</Table.Td>
          </Table.Tr>
        ))}
@@ -105,10 +117,20 @@ export default function ArrivalQueuePage() {
  const [busyScheduleId, setBusyScheduleId] = useState<string | null>(null);

  const unloadTrain = async (train: ImportTrain) => {
+    if (isFullyUnloaded(train)) {
+      toast({
+        title: 'Already unloaded',
+        description: `${train.trainNumber ?? 'This train'} has no remaining bookings to auto unload.`,
+      });
+      return;
+    }
+
    setBusyScheduleId(train.scheduleId);
    try {
      const res = (await autoUnload.mutateAsync(train.scheduleId)) as { data: AutoUnloadArrivedResult };
      const result = res.data;
+      const alreadyUnloaded = result.unloadedCount === 0 && result.skippedCount > 0 && result.failedCount === 0;
+      const firstReason = result.results.find((item) => item.reason)?.reason;
      const details = [
        result.skippedCount ? `${result.skippedCount} skipped` : '',
        result.failedCount ? `${result.failedCount} failed` : '',
@@ -117,8 +139,10 @@ export default function ArrivalQueuePage() {
        .join(', ');

      toast({
-        title: `${result.unloadedCount} booking(s) unloaded`,
-        description: details || `${train.trainNumber ?? 'Train'} moved into warehouse inventory.`,
+        title: alreadyUnloaded ? 'Already unloaded' : `${result.unloadedCount} booking(s) unloaded`,
+        description: alreadyUnloaded
+          ? firstReason ?? `${train.trainNumber ?? 'Train'} is already in warehouse inventory.`
+          : details || `${train.trainNumber ?? 'Train'} moved into warehouse inventory.`,
      });
    } catch (error) {
      toast({
@@ -181,6 +205,8 @@ export default function ArrivalQueuePage() {
                <Table.Tbody>
                  {trains.map((train: ImportTrain) => {
                    const isOpen = openScheduleId === train.scheduleId;
+                    const fullyUnloaded = isFullyUnloaded(train);
+                    const unloadedBookings = train.unloadedBookings ?? train.totalBookings - getPendingUnloadBookings(train);
                    return (
                      <Fragment key={train.scheduleId}>
                        <Table.Tr>
@@ -204,9 +230,14 @@ export default function ArrivalQueuePage() {
                          <Table.Td ta="center">{train.totalContainers}</Table.Td>
                          <Table.Td ta="center">{train.totalCargoes}</Table.Td>
                          <Table.Td>
-                            <Badge variant="light" color="teal" size="sm">
-                              {train.status}
-                            </Badge>
+                            <Stack gap={2}>
+                              <Badge variant="light" color={fullyUnloaded ? 'green' : 'teal'} size="sm">
+                                {fullyUnloaded ? 'UNLOADED' : train.status}
+                              </Badge>
+                              <Text size="xs" c="dimmed">
+                                {Math.max(unloadedBookings, 0)}/{train.totalBookings} unloaded
+                              </Text>
+                            </Stack>
                          </Table.Td>
                          <Table.Td>
                            <Group gap="xs" justify="flex-end" wrap="nowrap">
@@ -220,12 +251,13 @@ export default function ArrivalQueuePage() {
                              </Button>
                              <Button
                                size="compact-xs"
-                                color="orange"
+                                color={fullyUnloaded ? 'gray' : 'orange'}
                                leftSection={busyScheduleId === train.scheduleId ? <PackageOpen size={14} /> : <Truck size={14} />}
                                loading={busyScheduleId === train.scheduleId}
+                                disabled={fullyUnloaded || train.totalBookings === 0}
                                onClick={() => unloadTrain(train)}
                              >
-                                Auto Unload
+                                {fullyUnloaded ? 'Already Unloaded' : 'Auto Unload'}
                              </Button>
                            </Group>
                          </Table.Td>
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/ExportDjiboutiUnloadingQueuePage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/ExportDjiboutiUnloadingQueuePage.tsx
@@ -7,6 +7,7 @@ import {
  Group,
  Loader,
  Modal,
+  Alert,
  Stack,
  Table,
  Tabs,
@@ -168,7 +169,7 @@ function ExportTrainDetailRows({
 export default function ExportDjiboutiUnloadingQueuePage() {
  const navigate = useNavigate();
  const { toast } = useToast();
-  const { data: trains = [], isLoading } = useExportDjiboutiArrivalQueue();
+  const { data: trains = [], isLoading, isError, error } = useExportDjiboutiArrivalQueue();
  const { data: interchangeDocuments = [] } = useInterchangeDocuments({ direction: 'EXPORT' });
  const autoUnload = useAutoUnloadExportAtDjibouti();
  const generateInterchange = useGenerateInterchangeDocument();
@@ -193,14 +194,14 @@ export default function ExportDjiboutiUnloadingQueuePage() {
        result.skippedCount ? `${result.skippedCount} skipped` : '',
        result.failedCount ? `${result.failedCount} failed` : '',
        result.interchangeDocument
-          ? `Interchange document ${result.interchangeDocument.documentNo} generated`
+          ? `Signed interchange document ${result.interchangeDocument.documentNo} generated`
          : '',
      ]
        .filter(Boolean)
        .join(', ');

      toast({
-        title: `${result.unloadedCount} export item(s) unloaded`,
+        title: `${result.unloadedCount} export item(s) auto unloaded`,
        description: details || `${train.trainNumber ?? 'Train'} unloaded at Djibouti Port.`,
      });
    } catch (error) {
@@ -224,7 +225,8 @@ export default function ExportDjiboutiUnloadingQueuePage() {
        handoverFrom: 'EDR',
        handoverTo: 'Djibouti Port Operator',
        portOperatorName: 'Doraleh Multipurpose Port',
-        remarks: 'Generated after export unloading at Djibouti Port',
+        generatedBy: 'EDR Operations',
+        remarks: 'Generated after export unloading at Djibouti Port; signed by EDR and Djibouti Port Operator.',
      });
      toast({
        title: 'Interchange document generated',
@@ -249,21 +251,21 @@ export default function ExportDjiboutiUnloadingQueuePage() {
      <Stack gap="lg" mt="sm">
        <PageHeader
          title="Djibouti Arrival / Unloading Queue"
-          subtitle="Arrived export trains at Djibouti-side destinations ready for unloading."
+          subtitle="Arrived export trains at Djibouti-side destinations, auto unloading, and signed interchange handover."
        />

        <WarehouseHero
          variant="train"
          secondaryVariant="container"
          title="Export Unloading at Djibouti Port"
-          subtitle="Review arrived export trains and unload eligible assigned export items."
+          subtitle="Review arrived trains, auto unload eligible export items, then generate the EDR and Djibouti Port signed interchange document."
        />

        <Card withBorder radius="md" padding="lg">
          <Group justify="space-between" mb="md">
            <Text fw={600}>{trains.length} arrived export train(s)</Text>
            <Text size="sm" c="dimmed">
-              Open a train to review assigned export items, then auto unload it.
+              Open a train, auto unload it, then view the signed interchange document.
            </Text>
          </Group>

@@ -271,6 +273,10 @@ export default function ExportDjiboutiUnloadingQueuePage() {
            <Group justify="center" py="xl">
              <Loader />
            </Group>
+          ) : isError ? (
+            <Alert color="red" variant="light" title="Could not load arrived export trains">
+              {getErrorMessage(error) ?? 'Check your API connection and sign in again.'}
+            </Alert>
          ) : trains.length === 0 ? (
            <VisualEmptyState
              variant="train"
@@ -368,7 +374,7 @@ export default function ExportDjiboutiUnloadingQueuePage() {
                                  loading={busyScheduleId === train.scheduleId && generateInterchange.isPending}
                                  onClick={() => generateInterchangeDocument(train)}
                                >
-                                  Generate Interchange Document
+                                  Generate Signed Document
                                </Button>
                              )}
                            </Group>
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/InterchangeDocumentsPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/InterchangeDocumentsPage.tsx
@@ -12,7 +12,7 @@ import {
  Text,
  TextInput,
 } from '@mantine/core';
-import { CheckCircle2, Eye, FileText, Search, XCircle } from 'lucide-react';
+import { CheckCircle2, Download, Eye, FileText, Printer, Search, XCircle } from 'lucide-react';
 import type { ReactNode } from 'react';

 import { PageContainer, PageHeader } from '@/components/page';
@@ -25,6 +25,7 @@ import {
  useInterchangeDocuments,
 } from '@/hooks/useInterchangeDocuments';
 import { useToast } from '@/hooks/use-toast';
+import { interchangeDocumentsService } from '@/services/interchange-documents.service';
 import type { InterchangeDocument, InterchangeDocumentStatus } from '@/types/interchangeDocument';

 const statusColor: Record<InterchangeDocumentStatus, string> = {
@@ -45,6 +46,116 @@ const getErrorMessage = (error: unknown) => {
  return error instanceof Error ? error.message : undefined;
 };

+const escapeHtml = (value: unknown) =>
+  String(value ?? '-')
+    .replace(/&/g, '&amp;')
+    .replace(/</g, '&lt;')
+    .replace(/>/g, '&gt;')
+    .replace(/"/g, '&quot;')
+    .replace(/'/g, '&#39;');
+
+const filenameFor = (document: InterchangeDocument) =>
+  `${document.documentNo || document.id}-interchange-document.html`.replace(/[\\/:*?"<>|]/g, '-');
+
+const buildPrintableInterchangeHtml = (document: InterchangeDocument) => {
+  const items = document.items ?? [];
+  const rows = items
+    .map(
+      (item, index) => `
+        <tr>
+          <td>${index + 1}</td>
+          <td>${escapeHtml(item.bookingReference ?? item.bookingId?.slice(0, 8))}</td>
+          <td>${escapeHtml(item.itemType)}</td>
+          <td>${escapeHtml(item.containerNumber)}</td>
+          <td>${escapeHtml(item.sealNumber)}</td>
+          <td>${escapeHtml(item.cargoType ?? item.cargoDescription)}</td>
+          <td>${escapeHtml(formatNumber(item.weight))}</td>
+          <td>${escapeHtml(formatNumber(item.quantity))}</td>
+          <td>${escapeHtml(item.wagonNumber)}</td>
+          <td>${escapeHtml(item.conditionStatus)}</td>
+          <td>${escapeHtml(item.damageDescription)}</td>
+        </tr>`,
+    )
+    .join('');
+
+  return `<!doctype html>
+<html>
+<head>
+  <meta charset="utf-8" />
+  <title>${escapeHtml(document.documentNo)} Interchange Document</title>
+  <style>
+    @page { size: A4 landscape; margin: 14mm; }
+    * { box-sizing: border-box; }
+    body { font-family: Arial, sans-serif; color: #111827; margin: 0; }
+    .top { display: flex; justify-content: space-between; gap: 24px; border-bottom: 2px solid #111827; padding-bottom: 14px; }
+    h1 { margin: 0; font-size: 24px; }
+    .muted { color: #4b5563; font-size: 12px; }
+    .stamp { border: 2px solid #15803d; color: #15803d; border-radius: 999px; padding: 14px 18px; text-align: center; font-weight: 700; }
+    .grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px 18px; margin: 18px 0; }
+    .field { border-bottom: 1px solid #d1d5db; padding-bottom: 6px; }
+    .label { color: #6b7280; font-size: 10px; text-transform: uppercase; letter-spacing: .04em; }
+    .value { font-size: 13px; font-weight: 700; margin-top: 3px; }
+    table { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 11px; }
+    th, td { border: 1px solid #d1d5db; padding: 6px; text-align: left; vertical-align: top; }
+    th { background: #f3f4f6; }
+    .signatures { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 34px; }
+    .signature { border-top: 1px solid #111827; padding-top: 8px; min-height: 48px; }
+    .footer { margin-top: 16px; font-size: 10px; color: #6b7280; }
+  </style>
+</head>
+<body>
+  <div class="top">
+    <div>
+      <h1>EDR / Djibouti Port Interchange Document</h1>
+      <div class="muted">Official export handover document</div>
+      <div class="muted">Document No: ${escapeHtml(document.documentNo)}</div>
+    </div>
+    <div class="stamp">${escapeHtml(document.status)}<br/>SIGNED HANDOVER</div>
+  </div>
+
+  <div class="grid">
+    <div class="field"><div class="label">Direction</div><div class="value">${escapeHtml(document.direction)}</div></div>
+    <div class="field"><div class="label">Train No</div><div class="value">${escapeHtml(document.trainNo)}</div></div>
+    <div class="field"><div class="label">Schedule</div><div class="value">${escapeHtml(document.scheduleId)}</div></div>
+    <div class="field"><div class="label">Handover Location</div><div class="value">${escapeHtml(document.handoverLocation)}</div></div>
+    <div class="field"><div class="label">Handover From</div><div class="value">${escapeHtml(document.handoverFrom)}</div></div>
+    <div class="field"><div class="label">Handover To</div><div class="value">${escapeHtml(document.handoverTo)}</div></div>
+    <div class="field"><div class="label">Generated At</div><div class="value">${escapeHtml(formatDate(document.generatedAt))}</div></div>
+    <div class="field"><div class="label">Acknowledged At</div><div class="value">${escapeHtml(formatDate(document.acknowledgedAt))}</div></div>
+    <div class="field"><div class="label">Signed by EDR</div><div class="value">${escapeHtml(document.generatedBy)}</div></div>
+    <div class="field"><div class="label">Signed by Djibouti Port</div><div class="value">${escapeHtml(document.acknowledgedBy)}</div></div>
+    <div class="field"><div class="label">Port Operator</div><div class="value">${escapeHtml(document.portOperatorName)}</div></div>
+    <div class="field"><div class="label">Manifest Ref</div><div class="value">${escapeHtml(document.manifestReference)}</div></div>
+  </div>
+
+  <table>
+    <thead>
+      <tr>
+        <th>#</th>
+        <th>Booking</th>
+        <th>Type</th>
+        <th>Container</th>
+        <th>Seal</th>
+        <th>Cargo</th>
+        <th>Weight</th>
+        <th>Qty</th>
+        <th>Wagon</th>
+        <th>Condition</th>
+        <th>Damage / Notes</th>
+      </tr>
+    </thead>
+    <tbody>${rows || '<tr><td colspan="11">No items</td></tr>'}</tbody>
+  </table>
+
+  <div class="signatures">
+    <div class="signature">EDR Representative: ${escapeHtml(document.generatedBy)}</div>
+    <div class="signature">Djibouti Port Operator: ${escapeHtml(document.acknowledgedBy)}</div>
+  </div>
+  <div class="footer">Generated from EDR Freight Management System. Printed on ${escapeHtml(new Date().toLocaleString())}.</div>
+</body>
+</html>`;
+};
+
 function DetailField({ label, value }: { label: string; value: ReactNode }) {
  return (
    <Stack gap={2}>
@@ -93,6 +204,8 @@ function InterchangeDocumentDetail({ id }: { id: string }) {
        />
        <DetailField label="Generated At" value={formatDate(document.generatedAt)} />
        <DetailField label="Acknowledged At" value={formatDate(document.acknowledgedAt)} />
+        <DetailField label="Signed by EDR" value={document.generatedBy} />
+        <DetailField label="Signed by Djibouti Port" value={document.acknowledgedBy} />
        <DetailField label="Customs Ref" value={document.customsReference} />
        <DetailField label="Manifest Ref" value={document.manifestReference} />
      </SimpleGrid>
@@ -155,6 +268,37 @@ export default function InterchangeDocumentsPage() {
  const dispute = useDisputeInterchangeDocument();
  const cancel = useCancelInterchangeDocument();

+  const getPrintableDocument = async (interchangeDocument: InterchangeDocument) => {
+    if (interchangeDocument.items?.length) return interchangeDocument;
+    return interchangeDocumentsService.getById(interchangeDocument.id).then((response) => response.data);
+  };
+
+  const printDocument = async (interchangeDocument: InterchangeDocument) => {
+    const fullDocument = await getPrintableDocument(interchangeDocument);
+    const win = window.open('', '_blank');
+    if (!win) {
+      toast({ variant: 'destructive', title: 'Pop-up blocked', description: 'Allow pop-ups to print the document.' });
+      return;
+    }
+    win.document.write(buildPrintableInterchangeHtml(fullDocument));
+    win.document.close();
+    win.focus();
+    setTimeout(() => win.print(), 250);
+  };
+
+  const downloadDocument = async (interchangeDocument: InterchangeDocument) => {
+    const fullDocument = await getPrintableDocument(interchangeDocument);
+    const blob = new Blob([buildPrintableInterchangeHtml(fullDocument)], { type: 'text/html;charset=utf-8' });
+    const url = URL.createObjectURL(blob);
+    const a = document.createElement('a');
+    a.href = url;
+    a.download = filenameFor(fullDocument);
+    document.body.appendChild(a);
+    a.click();
+    a.remove();
+    URL.revokeObjectURL(url);
+  };
+
  const run = async (fn: () => Promise<unknown>, title: string) => {
    try {
      await fn();
@@ -167,10 +311,10 @@ export default function InterchangeDocumentsPage() {
  const acknowledgeDocument = (document: InterchangeDocument) => {
    const acknowledgedBy = window.prompt('Acknowledged by');
    if (!acknowledgedBy) return;
-    run(
-      () => acknowledge.mutateAsync({ id: document.id, acknowledgedBy }),
-      'Interchange document acknowledged',
-    );
+    run(async () => {
+      const response = await acknowledge.mutateAsync({ id: document.id, acknowledgedBy });
+      await printDocument(response.data);
+    }, 'Interchange document acknowledged');
  };

  const disputeDocument = (document: InterchangeDocument) => {
@@ -221,6 +365,7 @@ export default function InterchangeDocumentsPage() {
                  <Table.Th>Handover From</Table.Th>
                  <Table.Th>Handover To</Table.Th>
                  <Table.Th>Status</Table.Th>
+                  <Table.Th>Signed By</Table.Th>
                  <Table.Th>Generated At</Table.Th>
                  <Table.Th ta="right">Actions</Table.Th>
                </Table.Tr>
@@ -251,6 +396,14 @@ export default function InterchangeDocumentsPage() {
                        {document.status}
                      </Badge>
                    </Table.Td>
+                    <Table.Td>
+                      <Stack gap={0}>
+                        <Text size="sm">{document.generatedBy ?? '-'}</Text>
+                        <Text size="xs" c="dimmed">
+                          {document.acknowledgedBy ?? 'Awaiting Djibouti Port'}
+                        </Text>
+                      </Stack>
+                    </Table.Td>
                    <Table.Td>{formatDate(document.generatedAt)}</Table.Td>
                    <Table.Td>
                      <Group gap="xs" justify="flex-end" wrap="nowrap">
@@ -273,6 +426,28 @@ export default function InterchangeDocumentsPage() {
                            Acknowledge
                          </Button>
                        ) : null}
+                        {document.status === 'ACKNOWLEDGED' ? (
+                          <>
+                            <Button
+                              size="compact-xs"
+                              color="blue"
+                              variant="light"
+                              leftSection={<Printer size={14} />}
+                              onClick={() => run(() => printDocument(document), 'Print view opened')}
+                            >
+                              Print
+                            </Button>
+                            <Button
+                              size="compact-xs"
+                              color="blue"
+                              variant="light"
+                              leftSection={<Download size={14} />}
+                              onClick={() => run(() => downloadDocument(document), 'Document downloaded')}
+                            >
+                              Download
+                            </Button>
+                          </>
+                        ) : null}
                        {document.status !== 'CANCELLED' ? (
                          <Button
                            size="compact-xs"
--- a/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseInvoicesPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/warehouses/WarehouseInvoicesPage.tsx
@@ -15,19 +15,24 @@ import {
  Text,
  TextInput,
 } from '@mantine/core';
-import { Ban, CreditCard, Eye, Search } from 'lucide-react';
+import { Ban, CreditCard, DoorOpen, Download, Eye, Receipt, Search } from 'lucide-react';
 import { DataTable, type ColumnDef } from '@edr/ui-common';

 import { PageContainer, PageHeader } from '@/components/page';
 import { useMutation, useQuery } from '@tanstack/react-query';

 import { api } from '@/services/api';
+import { bookingsService } from '@/services/bookings.service';
+import { warehouseService } from '@/services/warehouse.service';
 import { useToast } from '@/hooks/use-toast';
 import {
  WAREHOUSE_INVOICE_STATUSES,
  type WarehouseFeeInvoice,
  type WarehouseInvoiceStatus,
 } from '@/types/warehouse';
+import { openPdfBlob } from '@/components/warehouses/pdf';
+import { buildWarehouseExitPaperPdf, buildWarehouseInvoicePdf } from '@/components/warehouses/warehousePdf';
+import { extractErrorMessage } from '@/components/warehouses/options';

 const STATUS_COLOR: Record<WarehouseInvoiceStatus, string> = {
  DRAFT: 'gray',
@@ -158,18 +163,120 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
  );
  const pay = useMutation(api.warehouses.payInvoice.mutationOptions());
  const cancel = useMutation(api.warehouses.cancelInvoice.mutationOptions());
+  const gateClear = useMutation(api.warehouses.gateClearance.mutationOptions());
  const [payAmount, setPayAmount] = useState<number | ''>('');
+  const [driverName, setDriverName] = useState('');
+  const [driverPhone, setDriverPhone] = useState('');

  const canPay = inv && (inv.status === 'ISSUED' || inv.status === 'PARTIALLY_PAID');
+  const canGateClear = inv?.status === 'PAID' && Boolean(inv.inventoryId);
+
+  const downloadInvoicePdf = async (invoice: WarehouseFeeInvoice) => {
+    const blob = buildWarehouseInvoicePdf(invoice, 'INVOICE');
+    openPdfBlob(blob, `warehouse-invoice-${invoice.invoiceNumber}.pdf`);
+  };
+
+  const downloadReceiptPdf = async (invoice: WarehouseFeeInvoice) => {
+    const blob = buildWarehouseInvoicePdf(invoice, 'RECEIPT');
+    openPdfBlob(blob, `warehouse-receipt-${invoice.invoiceNumber}.pdf`);
+  };
+
+  const getExitPaperContext = async (invoice: WarehouseFeeInvoice) => {
+    const [booking, inventoryRows] = await Promise.all([
+      invoice.bookingId
+        ? bookingsService.getById(invoice.bookingId).catch(() => null)
+        : Promise.resolve(null),
+      invoice.bookingId
+        ? warehouseService.listInventory({ bookingId: invoice.bookingId }).then((response) => response.data).catch(() => [])
+        : Promise.resolve([]),
+    ]);
+    const inventory = inventoryRows.find((item) => item.id === invoice.inventoryId) ?? inventoryRows[0] ?? undefined;
+    return { booking, inventory };
+  };
+
+  const handleGateClearance = async (invoice: WarehouseFeeInvoice) => {
+    if (!invoice.inventoryId) {
+      toast({
+        variant: 'destructive',
+        title: 'Gate clearance failed',
+        description: 'This invoice is not linked to an inventory item.',
+      });
+      return;
+    }
+
+    const pdfWindow = window.open('', '_blank');
+    try {
+      const releasedAt = new Date();
+      const releasedItem = await gateClear.mutateAsync(invoice.inventoryId);
+      let documentResponse: Awaited<ReturnType<typeof warehouseService.downloadReleaseDocument>>;
+      try {
+        documentResponse = await warehouseService.downloadReleaseDocument(invoice.inventoryId);
+      } catch (documentError) {
+        const context = await getExitPaperContext(invoice);
+        const fallbackBlob = buildWarehouseExitPaperPdf({
+          invoice,
+          releasedItem,
+          inventory: context.inventory,
+          booking: context.booking,
+          releasedAt,
+        });
+        const opened = openPdfBlob(
+          fallbackBlob,
+          `release-${releasedItem?.booking?.reference ?? releasedItem?.bookingId ?? invoice.inventoryId}.pdf`,
+          pdfWindow,
+        );
+        toast({
+          title: 'Gate clearance recorded',
+          description: opened
+            ? 'The API exit paper failed, so a sealed fallback PDF opened instead.'
+            : `The API exit paper failed (${extractErrorMessage(documentError)}), so a sealed fallback PDF was downloaded.`,
+        });
+        onClose();
+        return;
+      }
+      const filename = `release-${releasedItem?.booking?.reference ?? releasedItem?.bookingId ?? invoice.inventoryId}.pdf`;
+      const opened = openPdfBlob(documentResponse.data, filename, pdfWindow);
+      toast({
+        title: 'Gate clearance recorded',
+        description: opened
+          ? 'The exit paper opened in a browser tab.'
+          : 'The browser blocked the preview tab, so the exit paper was downloaded.',
+      });
+      onClose();
+    } catch (e) {
+      pdfWindow?.close();
+      toast({
+        variant: 'destructive',
+        title: 'Gate clearance failed',
+        description: extractErrorMessage(e),
+      });
+    }
+  };

  const handlePay = async () => {
    if (!inv || !payAmount) return;
    try {
-      await pay.mutateAsync({ id: inv.id, payload: { amount: Number(payAmount), method: 'MANUAL' } });
-      toast({ title: 'Payment recorded' });
+      const paidInvoice = await pay.mutateAsync({
+        id: inv.id,
+        payload: {
+          amount: Number(payAmount),
+          method: 'MANUAL',
+          driverName: driverName.trim() || undefined,
+          driverPhone: driverPhone.trim() || undefined,
+        },
+      });
      setPayAmount('');
+      setDriverName('');
+      setDriverPhone('');
+      if (paidInvoice.status === 'PAID') {
+        toast({ title: 'Payment recorded', description: 'Downloading receipt, then generating gate clearance and exit paper.' });
+        await downloadReceiptPdf(paidInvoice);
+        await handleGateClearance(paidInvoice);
+      } else {
+        toast({ title: 'Payment recorded' });
+      }
    } catch (e) {
-      toast({ variant: 'destructive', title: 'Payment failed', description: (e as Error)?.message });
+      toast({ variant: 'destructive', title: 'Payment failed', description: extractErrorMessage(e) });
    }
  };

@@ -180,7 +287,7 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
      toast({ title: 'Invoice cancelled' });
      onClose();
    } catch (e) {
-      toast({ variant: 'destructive', title: 'Cancel failed', description: (e as Error)?.message });
+      toast({ variant: 'destructive', title: 'Cancel failed', description: extractErrorMessage(e) });
    }
  };

@@ -239,6 +346,18 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
                  onChange={(v) => setPayAmount(v === '' ? '' : Number(v))}
                  style={{ flex: 1 }}
                />
+                <TextInput
+                  label="Pickup driver"
+                  value={driverName}
+                  onChange={(e) => setDriverName(e.currentTarget.value)}
+                  style={{ flex: 1 }}
+                />
+                <TextInput
+                  label="Driver phone"
+                  value={driverPhone}
+                  onChange={(e) => setDriverPhone(e.currentTarget.value)}
+                  style={{ flex: 1 }}
+                />
                <Button leftSection={<CreditCard size={16} />} loading={pay.isPending} onClick={handlePay}>
                  Pay
                </Button>
@@ -247,6 +366,34 @@ function InvoiceDetailModal({ id, onClose }: { id: string | null; onClose: () =>
          )}

          <Group justify="flex-end" mt="sm">
+            <Button
+              variant="light"
+              color="gray"
+              leftSection={<Download size={16} />}
+              onClick={() => downloadInvoicePdf(inv)}
+            >
+              Invoice PDF
+            </Button>
+            {Number(inv.paidAmount) > 0 && (
+              <Button
+                variant="light"
+                color="teal"
+                leftSection={<Receipt size={16} />}
+                onClick={() => downloadReceiptPdf(inv)}
+              >
+                Receipt PDF
+              </Button>
+            )}
+            {canGateClear && (
+              <Button
+                color="edr-green"
+                leftSection={<DoorOpen size={16} />}
+                loading={gateClear.isPending}
+                onClick={() => handleGateClearance(inv)}
+              >
+                Gate clearance & exit paper
+              </Button>
+            )}
            {inv.status !== 'PAID' && inv.status !== 'CANCELLED' && (
              <Button variant="light" color="red" leftSection={<Ban size={16} />} loading={cancel.isPending} onClick={handleCancel}>
                Cancel invoice
--- a/apps/edr-freight-web/backoffice/src/services/api.ts
+++ b/apps/edr-freight-web/backoffice/src/services/api.ts
@@ -670,6 +670,13 @@ export const api = {
      () => ["warehouse-inventory", "ready-to-load-export"],
    ),

+    receivedExport: endpoint<void, ReadyToLoadRow[]>(
+      "warehouse-inventory",
+      "received-export",
+      () => warehouseService.receivedExport().then((r) => r.data),
+      () => ["warehouse-inventory", "received-export"],
+    ),
+
    loadedExport: endpoint<void, ReadyToLoadRow[]>(
      "warehouse-inventory",
      "loaded-export",
--- a/apps/edr-freight-web/backoffice/src/services/first-mile.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/first-mile.service.ts
@@ -60,7 +60,7 @@ export const firstMileService = {
  list: (pageSize = 1000) =>
    api.get<FirstMileListResponse>(`${FM.BASE}?pageSize=${pageSize}`),
  getById: (id: string) => api.get<FirstMileRecord>(FM.BY_ID(id)),
-  update: (id: string, data: { status?: FirstMileApiStatus; vehicleId?: string | null }) =>
+  update: (id: string, data: { status?: FirstMileApiStatus; vehicleId?: string | null; estimatedKm?: number | null; exactKm?: number | null }) =>
    api.patch<FirstMileRecord>(FM.BY_ID(id), data),
  accept: (bookingReference: string) =>
    api.post<FirstMileRecord>(FM.ACCEPT(bookingReference)),
--- a/apps/edr-freight-web/backoffice/src/services/importOperations.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/importOperations.service.ts
@@ -0,0 +1,136 @@
+import { api as client } from '../auth/http';
+import { URL_CONSTANTS } from '@/constants/URLS';
+import { unwrap } from '@/utils/endpoint';
+import type {
+  AssignCustomsRiskPayload,
+  CreateDjiboutiIncidentPayload,
+  CreateEmptyContainerReturnPayload,
+  DjiboutiIncident,
+  EmptyContainerReturn,
+  ImportCustomsFinalization,
+  ImportOperationActionPayload,
+  RecordDeclarationPayload,
+  UpdateEmptyContainerReturnStatusPayload,
+  UploadImportCustomsDocumentPayload,
+} from '@/types/importOperations';
+
+export const importOperationsService = {
+  listIncidents: async (bookingId?: string): Promise<DjiboutiIncident[]> => {
+    const response = await client.get<DjiboutiIncident[]>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.DJIBOUTI_INCIDENTS,
+      { params: { bookingId } },
+    );
+    return unwrap(response.data);
+  },
+
+  createIncident: async (
+    payload: CreateDjiboutiIncidentPayload,
+  ): Promise<DjiboutiIncident> => {
+    const response = await client.post<DjiboutiIncident>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.DJIBOUTI_INCIDENTS,
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  getCustoms: async (bookingId: string): Promise<ImportCustomsFinalization> => {
+    const response = await client.get<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS(bookingId),
+    );
+    return unwrap(response.data);
+  },
+
+  uploadCustomsDocument: async (
+    bookingId: string,
+    payload: UploadImportCustomsDocumentPayload,
+  ): Promise<ImportCustomsFinalization> => {
+    const response = await client.post<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS_DOCUMENTS(bookingId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  recordDeclaration: async (
+    bookingId: string,
+    payload: RecordDeclarationPayload,
+  ): Promise<ImportCustomsFinalization> => {
+    const response = await client.post<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS_DECLARATION(bookingId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  notifyDutiesTaxes: async (
+    bookingId: string,
+    payload: ImportOperationActionPayload = {},
+  ): Promise<ImportCustomsFinalization> => {
+    const response = await client.post<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS_NOTIFY_DUTIES_TAXES(bookingId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  markDutiesTaxesPaid: async (
+    bookingId: string,
+    payload: ImportOperationActionPayload = {},
+  ): Promise<ImportCustomsFinalization> => {
+    const response = await client.post<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS_DUTIES_TAXES_PAID(bookingId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  assignRisk: async (
+    bookingId: string,
+    payload: AssignCustomsRiskPayload,
+  ): Promise<ImportCustomsFinalization> => {
+    const response = await client.post<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS_RISK(bookingId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  markReleasePermitted: async (
+    bookingId: string,
+    payload: ImportOperationActionPayload = {},
+  ): Promise<ImportCustomsFinalization> => {
+    const response = await client.post<ImportCustomsFinalization>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.CUSTOMS_RELEASE_PERMITTED(bookingId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  listEmptyReturns: async (): Promise<EmptyContainerReturn[]> => {
+    const response = await client.get<EmptyContainerReturn[]>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.EMPTY_CONTAINER_RETURNS,
+    );
+    return unwrap(response.data);
+  },
+
+  createEmptyReturn: async (
+    payload: CreateEmptyContainerReturnPayload,
+  ): Promise<EmptyContainerReturn> => {
+    const response = await client.post<EmptyContainerReturn>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.EMPTY_CONTAINER_RETURNS,
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  updateEmptyReturnStatus: async (
+    id: string,
+    payload: UpdateEmptyContainerReturnStatusPayload,
+  ): Promise<EmptyContainerReturn> => {
+    const response = await client.post<EmptyContainerReturn>(
+      URL_CONSTANTS.IMPORT_OPERATIONS.EMPTY_CONTAINER_RETURN_STATUS(id),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+};
--- a/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/last-mile.service.ts
@@ -18,10 +18,10 @@ export interface LastMileBooking {
  totalAmount: number;
  scheduledDate?: string | null;
  company?: { id: string; name?: string; phone?: string | null; contactPersonName?: string | null; contactPersonPhone?: string | null } | null;
-  serviceType?: { id: string; name?: string } | null;
-  originYard?: { id: string; name?: string } | null;
-  destinationYard?: { id: string; name?: string } | null;
-  cargoType?: { id: string; name?: string } | null;
+  serviceType?: { id: string; name?: string; label?: string } | null;
+  originYard?: { id: string; name?: string; label?: string } | null;
+  destinationYard?: { id: string; name?: string; label?: string } | null;
+  cargoType?: { id: string; name?: string; label?: string; cargoTypeName?: string } | null;
 }

 export interface LastMileVehicle {
@@ -60,7 +60,7 @@ export const lastMileService = {
  list: (pageSize = 1000) =>
    api.get<LastMileListResponse>(`${LM.BASE}?pageSize=${pageSize}`),
  getById: (id: string) => api.get<LastMileRecord>(LM.BY_ID(id)),
-  update: (id: string, data: { status?: LastMileApiStatus; vehicleId?: string | null }) =>
+  update: (id: string, data: { status?: LastMileApiStatus; vehicleId?: string | null; estimatedKm?: number | null; exactKm?: number | null }) =>
    api.patch<LastMileRecord>(LM.BY_ID(id), data),
  accept: (bookingReference: string) =>
    api.post<LastMileRecord>(LM.ACCEPT(encodeURIComponent(bookingReference))),
--- a/apps/edr-freight-web/backoffice/src/services/trainScheduling.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/trainScheduling.service.ts
@@ -12,6 +12,9 @@ import type {
  CreateTrainSchedulePayload,
  EligibleContainerBookingsResponse,
  FreightType,
+  ImportDjiboutiActionPayload,
+  ImportDjiboutiLoadList,
+  ImportDjiboutiOperation,
  LocomotiveRecord,
  PinWagonsPayload,
  RecordCheckpointPayload,
@@ -22,6 +25,7 @@ import type {
  TrainSchedulePreviewResponse,
  TrainSchedulingGlobalRules,
  TrainTrackResponse,
+  UploadImportDjiboutiDocumentPayload,
  WagonAllocationAttemptResult,
  YardOption,
 } from "@/types/trainScheduling";
@@ -280,6 +284,101 @@ export const trainSchedulingService = {
    return unwrap(response.data);
  },

+  getImportDjiboutiOperation: async (
+    scheduleId: string,
+  ): Promise<ImportDjiboutiOperation> => {
+    const response = await client.get<ImportDjiboutiOperation>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI(scheduleId),
+    );
+    return unwrap(response.data);
+  },
+
+  uploadImportDjiboutiDocument: async (
+    scheduleId: string,
+    payload: UploadImportDjiboutiDocumentPayload,
+  ): Promise<ImportDjiboutiOperation> => {
+    const response = await client.post<ImportDjiboutiOperation>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_DOCUMENTS(scheduleId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  grantImportDjiboutiGatepass: async (
+    scheduleId: string,
+    payload: ImportDjiboutiActionPayload = {},
+  ): Promise<ImportDjiboutiOperation> => {
+    const response = await client.post<ImportDjiboutiOperation>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_GATEPASS_GRANTED(scheduleId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  markImportDjiboutiReadyForLoading: async (
+    scheduleId: string,
+    payload: ImportDjiboutiActionPayload = {},
+  ): Promise<ImportDjiboutiOperation> => {
+    const response = await client.post<ImportDjiboutiOperation>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_READY_FOR_LOADING(scheduleId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  confirmImportDjiboutiLoadedOnTrain: async (
+    scheduleId: string,
+    payload: ImportDjiboutiActionPayload = {},
+  ): Promise<ImportDjiboutiOperation> => {
+    const response = await client.post<ImportDjiboutiOperation>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_LOADED_ON_TRAIN(scheduleId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  departImportFromDjibouti: async (
+    scheduleId: string,
+    payload: ImportDjiboutiActionPayload = {},
+  ): Promise<ImportDjiboutiOperation> => {
+    const response = await client.post<ImportDjiboutiOperation>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_DEPART(scheduleId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  generateImportDjiboutiLoadList: async (
+    scheduleId: string,
+    payload: ImportDjiboutiActionPayload = {},
+  ): Promise<ImportDjiboutiLoadList> => {
+    const response = await client.post<ImportDjiboutiLoadList>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_LOAD_LIST(scheduleId),
+      payload,
+    );
+    return unwrap(response.data);
+  },
+
+  downloadImportDjiboutiLoadListDocument: async (
+    scheduleId: string,
+  ): Promise<Blob> => {
+    const response = await client.get(
+      URL_CONSTANTS.TRAIN_SCHEDULING.IMPORT_DJIBOUTI_LOAD_LIST_DOCUMENT(scheduleId),
+      { responseType: "blob" },
+    );
+    return response.data;
+  },
+
+  downloadExportLoadListDocument: async (
+    scheduleId: string,
+  ): Promise<Blob> => {
+    const response = await client.get(
+      URL_CONSTANTS.TRAIN_SCHEDULING.EXPORT_LOAD_LIST_DOCUMENT(scheduleId),
+      { responseType: "blob" },
+    );
+    return response.data;
+  },
+
  getTrack: async (scheduleId: string): Promise<TrainTrackResponse> => {
    const response = await client.get<TrainTrackResponse>(
      URL_CONSTANTS.TRAIN_SCHEDULING.CHECKPOINTS(scheduleId),
--- a/apps/edr-freight-web/backoffice/src/services/warehouse.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/warehouse.service.ts
@@ -149,6 +149,8 @@ export const warehouseService = {
    apiClient.post<LoadPassedExportResult>(URL_CONSTANTS.WAREHOUSE_INVENTORY.LOAD_PASSED_EXPORT, {}),
  bulkMarkInspected: (payload: BulkInspectPayload) =>
    apiClient.post<BulkInspectResult>(URL_CONSTANTS.WAREHOUSE_INVENTORY.BULK_MARK_INSPECTED, payload),
+  receivedExport: () =>
+    apiClient.get<ReadyToLoadRow[]>(URL_CONSTANTS.WAREHOUSE_INVENTORY.RECEIVED_EXPORT),
  readyToLoadExport: () =>
    apiClient.get<ReadyToLoadRow[]>(URL_CONSTANTS.WAREHOUSE_INVENTORY.READY_TO_LOAD_EXPORT),
  loadedExport: () =>
@@ -263,6 +265,14 @@ export const warehouseService = {
    }),
  getInvoice: (id: string) =>
    apiClient.get<WarehouseFeeInvoice>(URL_CONSTANTS.WAREHOUSE_INVOICES.BY_ID(id)),
+  downloadInvoiceDocument: (id: string) =>
+    apiClient.get<Blob>(URL_CONSTANTS.WAREHOUSE_INVOICES.DOCUMENT(id), {
+      responseType: 'blob',
+    }),
+  downloadInvoiceReceipt: (id: string) =>
+    apiClient.get<Blob>(URL_CONSTANTS.WAREHOUSE_INVOICES.RECEIPT(id), {
+      responseType: 'blob',
+    }),
  invoicesForInventory: (inventoryId: string) =>
    apiClient.get<WarehouseFeeInvoice[]>(URL_CONSTANTS.WAREHOUSE_INVOICES.FOR_INVENTORY(inventoryId)),
  invoicesForBooking: (bookingId: string) =>
--- a/apps/edr-freight-web/backoffice/src/types/importOperations.ts
+++ b/apps/edr-freight-web/backoffice/src/types/importOperations.ts
@@ -0,0 +1,124 @@
+export type DjiboutiIncidentType =
+  | 'SEAL_BROKEN'
+  | 'CONTAINER_OPENED'
+  | 'CONTAINER_DAMAGED'
+  | 'FLUID_LEAKING'
+  | 'QUANTITY_MISMATCH'
+  | 'WEIGHT_MISMATCH'
+  | 'OTHER';
+
+export interface DjiboutiIncident {
+  id: string;
+  bookingId: string;
+  containerNumber: string | null;
+  cargoId: string | null;
+  facility: string | null;
+  station: string | null;
+  incidentType: DjiboutiIncidentType;
+  description: string;
+  photos: string[];
+  reportedBy: string | null;
+  reportedAt: string;
+}
+
+export interface CreateDjiboutiIncidentPayload {
+  bookingId: string;
+  containerNumber?: string;
+  cargoId?: string;
+  facility?: string;
+  station?: string;
+  incidentType: DjiboutiIncidentType;
+  description: string;
+  photos?: string[];
+  reportedBy?: string;
+  reportedAt?: string;
+}
+
+export type ImportCustomsDocumentType =
+  | 'IM4'
+  | 'IM5'
+  | 'T1_CLOSURE_PROOF'
+  | 'TRANSIT_PERMIT_SCREENSHOT'
+  | 'CUSTOMER_PAYMENT_SLIP'
+  | 'IMPORT_RELEASE_PERMIT';
+
+export type ImportCustomsRiskLevel = 'GREEN' | 'YELLOW' | 'BLUE' | 'RED';
+
+export interface ImportCustomsFinalization {
+  id: string;
+  bookingId: string;
+  documents: Partial<Record<ImportCustomsDocumentType, string>>;
+  declarationSerialNumber: string | null;
+  dutiesTaxesNotifiedAt: string | null;
+  dutiesTaxesPaidAt: string | null;
+  customsRisk: ImportCustomsRiskLevel | null;
+  importReleasePermittedAt: string | null;
+  completedAt: string | null;
+  performedBy: string | null;
+  notes: string | null;
+}
+
+export interface ImportOperationActionPayload {
+  performedBy?: string;
+  notes?: string;
+}
+
+export interface UploadImportCustomsDocumentPayload {
+  documentType: ImportCustomsDocumentType;
+  fileId: string;
+  performedBy?: string;
+}
+
+export interface RecordDeclarationPayload {
+  declarationSerialNumber: string;
+  performedBy?: string;
+}
+
+export interface AssignCustomsRiskPayload {
+  risk: ImportCustomsRiskLevel;
+  performedBy?: string;
+}
+
+export type EmptyContainerReturnStatus =
+  | 'RETURNED'
+  | 'ASSIGNED_STORAGE'
+  | 'DOCUMENTATION_CLEARED'
+  | 'WAGON_ALLOCATED'
+  | 'TRANSPORTED_TO_DJIBOUTI'
+  | 'HANDOVER_ISSUED'
+  | 'COMPLETED';
+
+export interface EmptyContainerReturn {
+  id: string;
+  containerNumber: string;
+  bookingId: string | null;
+  customerId: string | null;
+  returnDate: string;
+  facility: string | null;
+  yard: string | null;
+  zone: string | null;
+  condition: string | null;
+  handoverNote: string | null;
+  status: EmptyContainerReturnStatus;
+  wagonAllocationReference: string | null;
+  performedBy: string | null;
+}
+
+export interface CreateEmptyContainerReturnPayload {
+  containerNumber: string;
+  bookingId?: string;
+  customerId?: string;
+  returnDate?: string;
+  facility?: string;
+  yard?: string;
+  zone?: string;
+  condition?: string;
+  handoverNote?: string;
+  performedBy?: string;
+}
+
+export interface UpdateEmptyContainerReturnStatusPayload extends ImportOperationActionPayload {
+  status: EmptyContainerReturnStatus;
+  wagonAllocationReference?: string;
+  handoverNote?: string;
+}
--- a/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
+++ b/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
@@ -399,6 +399,81 @@ export interface TrainScheduleDetail {
  warnings?: string[];
 }

+export type ImportDjiboutiDocumentType =
+  | "DELIVERY_ORDER"
+  | "PORT_INVOICE"
+  | "DJIBOUTI_T1"
+  | "ETHIOPIA_T1"
+  | "RAILWAY_BILL";
+
+export interface ImportDjiboutiDocumentRecord {
+  fileId?: string | null;
+  fileUrl?: string | null;
+  reference?: string | null;
+  uploadedAt: string;
+  uploadedBy?: string | null;
+  notes?: string | null;
+}
+
+export interface ImportDjiboutiOperation {
+  trainScheduleId: string;
+  trainNumber: string | null;
+  direction: string | null;
+  status: {
+    documentsComplete: boolean;
+    missingDocuments: ImportDjiboutiDocumentType[];
+    gatepassGranted: boolean;
+    readyForLoading: boolean;
+    loadedOnTrain: boolean;
+    departedFromDjibouti: boolean;
+    loadListGenerated: boolean;
+  };
+  documents: Partial<Record<ImportDjiboutiDocumentType, ImportDjiboutiDocumentRecord>>;
+  gatepassGrantedAt: string | null;
+  readyForLoadingAt: string | null;
+  loadedOnTrainAt: string | null;
+  departedFromDjiboutiAt: string | null;
+  loadListGeneratedAt: string | null;
+  performedBy: string | null;
+  notes: string | null;
+}
+
+export interface UploadImportDjiboutiDocumentPayload {
+  documentType: ImportDjiboutiDocumentType;
+  fileId?: string;
+  fileUrl?: string;
+  reference?: string;
+  notes?: string;
+  performedBy?: string;
+}
+
+export interface ImportDjiboutiActionPayload {
+  notes?: string;
+  performedBy?: string;
+}
+
+export interface ImportDjiboutiLoadList {
+  generatedAt: string;
+  trainScheduleId: string;
+  trainNumber: string | null;
+  route: string | null;
+  origin: string | null;
+  destination: string | null;
+  totalBookings: number;
+  wagons: Array<{
+    sequenceNo: number;
+    wagonNumber: string | null;
+    allocations: Array<{
+      bookingId: string;
+      bookingReference: string | null;
+      loadType: string | null;
+      allocatedWeightTons: number;
+      containerNumbers: string[];
+    }>;
+  }>;
+  operation: ImportDjiboutiOperation;
+}
+
 export type TrainCheckpointKind = "DEPARTED" | "PASSED" | "ARRIVED";

 export interface TrackStation {
--- a/apps/edr-freight-web/backoffice/src/types/warehouse.ts
+++ b/apps/edr-freight-web/backoffice/src/types/warehouse.ts
@@ -341,6 +341,20 @@ export interface ReserveInventoryPayload {
 export interface ReleaseOrderPayload {
  reference?: string;
  releaseDate?: string;
+  bookingId?: string;
+  customerId?: string;
+  truckPlateNumber?: string;
+  trailerPlateNumber?: string;
+  driverName?: string;
+  driverLicense?: string;
+  driverPhone?: string;
+  truckType?: string;
+  containerNumber?: string;
+  gateInTime?: string;
+  tareWeight?: number;
+  grossWeight?: number;
+  netWeight?: number;
+  gateOutTime?: string;
 }

 /** Import branch: proof of delivery captured on customer pickup. */
@@ -356,6 +370,13 @@ export interface EligibleBooking {
  reference: string;
  customerId: string | null;
  customer: string | null;
+  customerTin: string | null;
+  customerPhone: string | null;
+  containerNumber: string | null;
+  containerQuantity: number | null;
+  containerPackagingType: string | null;
+  cargoDescription: string | null;
+  lastMileRequested: boolean;
  direction: string;
  origin: string | null;
  destination: string | null;
@@ -364,6 +385,16 @@ export interface EligibleBooking {
  weight: string | null;
  paymentStatus: string;
  status: string;
+  hasFirstMile: boolean;
+  firstMileRequestId: string | null;
+  firstMileStatus: string | null;
+  firstMileVehicleId: string | null;
+  firstMileTruckPlateNumber: string | null;
+  firstMileTrailerPlateNumber: string | null;
+  firstMileDriverName: string | null;
+  firstMileDriverPhone: string | null;
+  firstMileDriverLicenseNumber: string | null;
+  firstMileTruckType: string | null;
 }

 export interface BulkReceivePayload {
@@ -372,12 +403,46 @@ export interface BulkReceivePayload {
  yardId: string;
  zoneId: string;
  bookingIds: string[];
+  truckEntrance?: TruckEntrancePayload;
 }

 export interface BulkReceiveResult {
  receivedCount: number;
  skippedCount: number;
-  results: { bookingId: string; status: string; inventoryId?: string; reason?: string }[];
+  results: { bookingId: string; status: string; inventoryId?: string; grnNumber?: string; reason?: string }[];
+}
+
+export interface TruckEntrancePayload {
+  ownerName?: string;
+  consigneeDetails?: string;
+  edrDigitalBookingId?: string;
+  tin?: string;
+  customerPhone?: string;
+  truckPlateNumber: string;
+  trailerPlateNumber?: string;
+  assignedEquipmentNumber?: string;
+  customsSealNumber?: string;
+  declarationNumber?: string;
+  incoterms?: string;
+  hsCodes?: string;
+  itemCode?: string;
+  itemDescription?: string;
+  packagingType?: string;
+  unitCount?: number;
+  grossWeightKg?: number;
+  netWeightKg?: number;
+  volumeDimensions?: string;
+  conditionAtReceipt?: string;
+  damagedRejectedQuantity?: number;
+  warehouseCodeLocation?: string;
+  driverName: string;
+  driverPhone: string;
+  driverLicenseNumber?: string;
+  truckType?: string;
+  entranceTareWeightKg: number;
+  exitTareWeightKg?: number;
+  driverSignatoryName?: string;
+  warehouseManagerName?: string;
 }

 export interface LoadPassedExportResult {
@@ -430,6 +495,9 @@ export interface ImportTrain {
  totalBookings: number;
  totalContainers: number;
  totalCargoes: number;
+  unloadedBookings?: number;
+  pendingUnloadBookings?: number;
+  fullyUnloaded?: boolean;
  status: string;
 }

@@ -510,6 +578,7 @@ export interface ImportTrainItem {
  weight: number | null;
  arrivalTime: string | null;
  currentStatus: string | null;
+  inspectionStatus: string | null;
  lastMileRequested: boolean;
  pickupOption: string;
 }
@@ -733,8 +802,16 @@ export interface WarehouseFeeInvoice {
  id: string;
  invoiceNumber: string;
  bookingId?: string | null;
+  bookingReference?: string | null;
  customerId?: string | null;
+  customerName?: string | null;
  inventoryId: string;
+  inventoryReference?: string | null;
+  inventoryInfo?: string | null;
+  inventoryStatus?: string | null;
+  containerNumber?: string | null;
+  cargoDescription?: string | null;
+  clearanceStatus?: string | null;
  facilityId?: string | null;
  warehouseId?: string | null;
  yardId?: string | null;
@@ -771,6 +848,8 @@ export interface PayInvoicePayload {
  amount: number;
  method?: string;
  reference?: string;
+  driverName?: string;
+  driverPhone?: string;
 }

 // ── Payloads ───────────────────────────────────────────────────────────────
@@ -823,6 +902,7 @@ export interface ReceiveInventoryPayload {
  weight: number;
  volume?: number;
  notes?: string;
+  truckEntrance: TruckEntrancePayload;
 }

 export interface MoveInventoryPayload {