add loading confirmation for import-Djibouti trains before dispatch

2026-08-29 21:08:12 +00:00 · 2026-07-05 21:07:03 +00:00
parent 1433796db0
commit 3485a7d63d
8 changed files with 291 additions and 24 deletions
--- a/apps/edr-freight-web/backoffice/src/components/trainScheduling/ScheduleWorkspacePanel.tsx
+++ b/apps/edr-freight-web/backoffice/src/components/trainScheduling/ScheduleWorkspacePanel.tsx
@@ -24,7 +24,7 @@ import {
  Inbox,
  PackageCheck,
  PackageX,
-  Repeat,
+  // Repeat, // used by the hidden Move (reassign) button
  Train,
  Weight,
  X,
@@ -156,6 +156,9 @@ export function ScheduleWorkspacePanel({
  const setLoading = useMutation(
    api.trainScheduling.setLoadingStatus.mutationOptions(),
  );
+  const confirmLoading = useMutation(
+    api.trainScheduling.confirmLoading.mutationOptions(),
+  );
  const moveSchedule = useMutation(
    api.trainScheduling.moveBookingSchedule.mutationOptions(),
  );
@@ -266,6 +269,25 @@ export function ScheduleWorkspacePanel({
      );
  };

+  const doConfirmLoading = () => {
+    confirmLoading
+      .mutateAsync({ id: schedule.id })
+      .then(() => {
+        toast({ title: "Loading confirmed", description: "The train is cleared to dispatch." });
+        onChanged();
+      })
+      .catch((error) =>
+        toast({
+          title: "Could not confirm loading",
+          description: apiErrorMessage(
+            error,
+            "Grant the Djibouti gatepass first, then confirm loading.",
+          ),
+          variant: "destructive",
+        }),
+      );
+  };
+
  const doMove = () => {
    if (!moveBookingId || !moveTarget) return;
    moveSchedule
@@ -376,6 +398,54 @@ export function ScheduleWorkspacePanel({
          </Text>
        ) : null}

+        {/* Loading confirmation — required before dispatch for import-Djibouti
+            trains; shown for every direction so staff have one place to confirm. */}
+        {canManage ? (
+          <Group
+            gap={10}
+            p="sm"
+            wrap="nowrap"
+            align="center"
+            justify="space-between"
+            style={{
+              borderRadius: 10,
+              background: schedule.loadingConfirmed
+                ? "var(--mantine-color-edr-green-0)"
+                : "var(--mantine-color-yellow-0)",
+              border: `1px solid ${
+                schedule.loadingConfirmed
+                  ? "var(--mantine-color-edr-green-2)"
+                  : "var(--mantine-color-yellow-3)"
+              }`,
+            }}
+          >
+            <Group gap={8} wrap="nowrap" align="center" style={{ minWidth: 0 }}>
+              {schedule.loadingConfirmed ? (
+                <CheckCircle2 size={18} color="var(--mantine-color-edr-green-7)" />
+              ) : (
+                <PackageCheck size={18} color="#B7791F" />
+              )}
+              <Text size="sm" fw={600}>
+                {schedule.loadingConfirmed
+                  ? "Loading confirmed — cleared to dispatch"
+                  : "Confirm loading before dispatching this train"}
+              </Text>
+            </Group>
+            {!schedule.loadingConfirmed ? (
+              <Button
+                size="compact-sm"
+                color="edr-green"
+                radius="md"
+                leftSection={<CheckCircle2 size={14} />}
+                loading={confirmLoading.isPending}
+                onClick={doConfirmLoading}
+              >
+                Confirm loading
+              </Button>
+            ) : null}
+          </Group>
+        ) : null}
+
        {/* Two-panel board */}
        <Group align="stretch" gap="lg" grow wrap="wrap">
          {/* Pool */}
@@ -477,6 +547,7 @@ export function ScheduleWorkspacePanel({
                          </Button>
                        </Tooltip>
                      ) : null}
+                      {/* Reassign-to-another-train — hidden for now.
                      <Tooltip label="Reassign to another train" withArrow>
                        <Button
                          size="compact-sm"
@@ -492,6 +563,7 @@ export function ScheduleWorkspacePanel({
                          Move
                        </Button>
                      </Tooltip>
+                      */}
                      <Tooltip label="Remove from this train" withArrow>
                        <Button
                          size="compact-sm"
--- a/apps/edr-freight-web/backoffice/src/constants/URLS.ts
+++ b/apps/edr-freight-web/backoffice/src/constants/URLS.ts
@@ -330,6 +330,8 @@ export const URL_CONSTANTS = {
      `/train-scheduling/schedules/${id}/import-loading-status`,
    LOADING_STATUS: (id: string) =>
      `/train-scheduling/schedules/${id}/loading-status`,
+    CONFIRM_LOADING: (id: string) =>
+      `/train-scheduling/schedules/${id}/confirm-loading`,
    IMPORT_DJIBOUTI: (id: string) =>
      `/train-scheduling/schedules/${id}/import-djibouti`,
    IMPORT_DJIBOUTI_DOCUMENTS: (id: string) =>
--- a/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
+++ b/apps/edr-freight-web/backoffice/src/pages/trainScheduling/TrainScheduleV2DetailPage.tsx
@@ -1,10 +1,13 @@
 import {
+  Alert,
  Badge,
  Box,
  Button,
  Checkbox,
  Group,
+  List,
  Loader,
+  Modal,
  Paper,
  RingProgress,
  Stack,
@@ -15,6 +18,7 @@ import {
 } from "@mantine/core";
 import { isAxiosError } from "axios";
 import {
+  AlertTriangle,
  ArrowLeft,
  CalendarClock,
  CheckCircle2,
@@ -44,7 +48,7 @@ import {
 } from "@/components/trainScheduling/containerPlacement.util";
 import { ContainerPlacementGrid } from "@/components/trainScheduling/ContainerPlacementGrid";
 import { FleetAvailabilitySummary } from "@/components/trainScheduling/FleetAvailabilitySummary";
-import { ImportLoadingConfirmationPanel } from "@/components/trainScheduling/ImportLoadingConfirmationPanel";
+// import { ImportLoadingConfirmationPanel } from "@/components/trainScheduling/ImportLoadingConfirmationPanel";
 import { RescheduleTrainDialog } from "@/components/trainScheduling/RescheduleTrainDialog";
 import BookingWindowSettingsModal from "@/components/trainScheduling/BookingWindowSettingsModal";
 // import { ScheduleBatchPanel } from "@/components/trainScheduling/ScheduleBatchPanel";
@@ -100,6 +104,7 @@ export default function TrainScheduleV2DetailPage() {
  const [gatepassReference, setGatepassReference] = useState("");
  const [gatepassFileUrl, setGatepassFileUrl] = useState("");
  const [gatepassNotes, setGatepassNotes] = useState("");
+  const [dispatchConfirmOpen, setDispatchConfirmOpen] = useState(false);
  const autoPreviewedRef = useRef(false);

  const detailQuery = useQuery(
@@ -148,12 +153,14 @@ export default function TrainScheduleV2DetailPage() {
    },
  });

-  const importLoadingQuery = useQuery(
-    api.trainScheduling.importLoadingBookings.queryOptions({
-      input: { id: scheduleId ?? "" },
-      enabled: Boolean(scheduleId && schedule?.direction === "IMPORT"),
-    }),
-  );
+  // Superseded by the Workspace tab Load/Unload toggle — see commented
+  // "Import loading confirmation" card below.
+  // const importLoadingQuery = useQuery(
+  //   api.trainScheduling.importLoadingBookings.queryOptions({
+  //     input: { id: scheduleId ?? "" },
+  //     enabled: Boolean(scheduleId && schedule?.direction === "IMPORT"),
+  //   }),
+  // );

  const eligibleFilters = useMemo(
    () =>
@@ -360,6 +367,22 @@ export default function TrainScheduleV2DetailPage() {
  const canEditBookings = ["DRAFT", "SCHEDULED"].includes(schedule.status);
  const canFinalize = schedule.status === "DRAFT" && (schedule.bookings?.length ?? 0) > 0;
  const canDispatch = schedule.status === "SCHEDULED";
+
+  // Dispatch readiness: bookings with no wagon, and wagon-loaded bookings whose
+  // cargo staff never marked loaded. Both are warnings, not blockers — staff can
+  // still dispatch after confirming.
+  const dispatchBookings = schedule.bookings ?? [];
+  const unassignedCount = dispatchBookings.filter((b) => !b.wagonAssigned).length;
+  const unloadedCount = dispatchBookings.filter(
+    (b) => b.wagonAssigned && (b.loadingStatus ?? "UNLOADED") !== "LOADED",
+  ).length;
+  // Import-Djibouti trains are HARD-blocked from dispatch until loading is
+  // confirmed in the workspace — surface it as a blocker, not just a warning.
+  const loadingBlocksDispatch =
+    schedule.requiresLoadingConfirmation === true &&
+    schedule.loadingConfirmed !== true;
+  const hasDispatchWarnings = unassignedCount > 0 || unloadedCount > 0;
+
  const finalizeStep = hasContainerStep ? 3 : 2;
  const canModifyBookings = canEditBookings && !["DISPATCHED", "ARRIVED"].includes(schedule.status);
  const canPrintMarshalling =
@@ -398,6 +421,24 @@ export default function TrainScheduleV2DetailPage() {
    }
  };

+  const runDispatch = async () => {
+    setDispatchConfirmOpen(false);
+    try {
+      await dispatch.mutateAsync(scheduleId);
+      await openMarshallingDocument({
+        title: "Train dispatched",
+        successDescription: "Marshalling document generated for the dispatched train.",
+        errorTitle: "Train dispatched, but document could not open",
+      });
+    } catch (err) {
+      toast({
+        title: "Dispatch failed",
+        description: parseError(err, "Could not dispatch"),
+        variant: "destructive",
+      });
+    }
+  };
+
  const handleAssign = async () => {
    if (!allSelectedIds.length) return;

@@ -779,22 +820,7 @@ export default function TrainScheduleV2DetailPage() {
              radius="md"
              leftSection={<Send size={18} />}
              loading={dispatch.isPending}
-              onClick={async () => {
-                try {
-                  await dispatch.mutateAsync(scheduleId);
-                  await openMarshallingDocument({
-                    title: "Train dispatched",
-                    successDescription: "Marshalling document generated for the dispatched train.",
-                    errorTitle: "Train dispatched, but document could not open",
-                  });
-                } catch (err) {
-                  toast({
-                    title: "Dispatch failed",
-                    description: parseError(err, "Could not dispatch"),
-                    variant: "destructive",
-                  });
-                }
-              }}
+              onClick={() => setDispatchConfirmOpen(true)}
            >
              Dispatch train
            </Button>
@@ -1002,6 +1028,9 @@ export default function TrainScheduleV2DetailPage() {
        ]}
      />

+      {/* Import loading confirmation — superseded by the per-booking Load/Unload
+          toggle in the Workspace tab (works for all directions). Kept commented
+          in case the import-only confirmation flow is needed again.
      {schedule?.direction === "IMPORT" ? (
        <Paper radius="xl" p="lg" withBorder>
          <Stack gap="md">
@@ -1018,6 +1047,7 @@ export default function TrainScheduleV2DetailPage() {
          </Stack>
        </Paper>
      ) : null}
+      */}

      <Tabs defaultValue="workflow" radius="md" color="edr-green" keepMounted={false}>
        <Tabs.List mb="md">
@@ -1119,6 +1149,102 @@ export default function TrainScheduleV2DetailPage() {
        onClose={() => setWindowSettingsOpen(false)}
        onSaved={() => void detailQuery.refetch()}
      />
+
+      <Modal
+        opened={dispatchConfirmOpen}
+        onClose={() => setDispatchConfirmOpen(false)}
+        centered
+        radius="lg"
+        title={
+          <Group gap={8}>
+            <Send size={18} />
+            <Text fw={700}>Dispatch this train?</Text>
+          </Group>
+        }
+      >
+        <Stack gap="md">
+          <Text size="sm" c="dimmed">
+            Dispatch locks the composition and begins rail movement. This cannot be
+            undone.
+          </Text>
+
+          {loadingBlocksDispatch ? (
+            <Alert
+              color="red"
+              variant="light"
+              radius="md"
+              icon={<AlertTriangle size={18} />}
+              title="Loading not confirmed"
+            >
+              This import train cannot depart until loading is confirmed. Use{" "}
+              <Text span fw={700}>
+                Confirm loading
+              </Text>{" "}
+              in the Workspace tab first.
+            </Alert>
+          ) : null}
+
+          {hasDispatchWarnings ? (
+            <Alert
+              color="orange"
+              variant="light"
+              radius="md"
+              icon={<AlertTriangle size={18} />}
+              title="Some bookings are not fully ready"
+            >
+              <List size="sm" spacing={4}>
+                {unassignedCount > 0 ? (
+                  <List.Item>
+                    <Text span fw={700}>
+                      {unassignedCount}
+                    </Text>{" "}
+                    booking{unassignedCount === 1 ? "" : "s"} not assigned to a wagon
+                  </List.Item>
+                ) : null}
+                {unloadedCount > 0 ? (
+                  <List.Item>
+                    <Text span fw={700}>
+                      {unloadedCount}
+                    </Text>{" "}
+                    wagon-assigned booking{unloadedCount === 1 ? "" : "s"} still marked
+                    unloaded
+                  </List.Item>
+                ) : null}
+              </List>
+              <Text size="xs" c="dimmed" mt={6}>
+                You can still dispatch — confirm to proceed.
+              </Text>
+            </Alert>
+          ) : (
+            <Alert
+              color="edr-green"
+              variant="light"
+              radius="md"
+              icon={<CheckCircle2 size={18} />}
+            >
+              All bookings are assigned to a wagon and marked loaded.
+            </Alert>
+          )}
+
+          <Group justify="flex-end" gap="sm">
+            <Button
+              variant="default"
+              onClick={() => setDispatchConfirmOpen(false)}
+            >
+              Cancel
+            </Button>
+            <Button
+              color="edr-green"
+              leftSection={<Send size={16} />}
+              loading={dispatch.isPending}
+              disabled={loadingBlocksDispatch}
+              onClick={() => void runDispatch()}
+            >
+              {hasDispatchWarnings ? "Dispatch anyway" : "Dispatch train"}
+            </Button>
+          </Group>
+        </Stack>
+      </Modal>
    </PageContainer>
  );
 }
--- a/apps/edr-freight-web/backoffice/src/services/api.ts
+++ b/apps/edr-freight-web/backoffice/src/services/api.ts
@@ -558,6 +558,14 @@ export const api = {
      () => TRAIN_SCHEDULING_INVALIDATIONS,
    ),

+    confirmLoading: endpoint<{ id: string }, TrainScheduleDetail>(
+      "train-scheduling",
+      "confirm-loading",
+      ({ id }) => trainSchedulingService.confirmLoading(id),
+      undefined,
+      () => TRAIN_SCHEDULING_INVALIDATIONS,
+    ),
+
    pinWagons: endpoint<
      { id: string; payload: PinWagonsPayload },
      TrainScheduleDetail
--- a/apps/edr-freight-web/backoffice/src/services/trainScheduling.service.ts
+++ b/apps/edr-freight-web/backoffice/src/services/trainScheduling.service.ts
@@ -369,6 +369,16 @@ export const trainSchedulingService = {
    return unwrap(response.data);
  },

+  confirmLoading: async (
+    scheduleId: string,
+  ): Promise<TrainScheduleDetail> => {
+    const response = await client.post<TrainScheduleDetail>(
+      URL_CONSTANTS.TRAIN_SCHEDULING.CONFIRM_LOADING(scheduleId),
+      {},
+    );
+    return unwrap(response.data);
+  },
+
  getImportDjiboutiOperation: async (
    scheduleId: string,
  ): Promise<ImportDjiboutiOperation> => {
--- a/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
+++ b/apps/edr-freight-web/backoffice/src/types/trainScheduling.ts
@@ -429,6 +429,10 @@ export interface TrainScheduleDetail {
  freightType?: FreightType | null;
  trainNumber?: string | null;
  direction?: string | null;
+  /** True when this schedule needs loading confirmed before dispatch (import-Djibouti). */
+  requiresLoadingConfirmation?: boolean;
+  /** True when loading is already confirmed (or not required for this direction). */
+  loadingConfirmed?: boolean;
  windowPhase?: BookingWindowPhase | string | null;
  windowOpensAt?: string | null;
  windowClosesAt?: string | null;