fix: the issue in the sheets file

apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/ActionShell.tsx

@@ -8,6 +8,12 @@ export interface ActionShellProps {
   subtitle?: string;
   /** When true the action is already done — children are hidden, a done badge shows. */
   done?: boolean;
+  /**
+   * Keep the input controls mounted alongside the done badge. For actions whose
+   * value stays correctable after completion (e.g. customs risk), rather than
+   * the default one-and-done actions.
+   */
+  keepChildrenWhenDone?: boolean;
   doneLabel?: ReactNode;
   children: ReactNode;
 }
@@ -22,6 +28,7 @@ export function ActionShell({
   title,
   subtitle,
   done,
+  keepChildrenWhenDone,
   doneLabel,
   children,
 }: ActionShellProps) {
@@ -64,7 +71,7 @@ export function ActionShell({
           )
         ) : null}
       </Group>
-      {!done ? children : null}
+      {!done || keepChildrenWhenDone ? children : null}
     </Box>
   );
 }

apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/AssignRiskCard.tsx

@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { Badge, Box, Button, Group, SegmentedControl, Text } from "@mantine/core";
 import { ShieldAlert } from "lucide-react";
 import type { Freight } from "@edr/types";
@@ -15,22 +15,42 @@ const RISK_COLOR: Record<Freight.CustomsRiskLevel, string> = {
 export function AssignRiskCard({
   bookingId,
   milestone,
+  locked = false,
 }: {
   bookingId: string;
   milestone: Freight.IClearanceMilestone;
+  /**
+   * Duty has already been advised off this risk level, so the decision is now
+   * final. Until then a mis-assigned level must stay correctable — the server
+   * accepts reassignment and overwrites the milestone metadata.
+   */
+  locked?: boolean;
 }) {
   const assign = useAssignRisk(bookingId);
-  const [level, setLevel] = useState<Freight.CustomsRiskLevel>("GREEN");
 
   const assigned = milestone.status === "COMPLETED";
   const current = milestone.metadata?.riskLevel;
+  const [level, setLevel] = useState<Freight.CustomsRiskLevel>(
+    current ?? "GREEN",
+  );
+
+  // The milestone loads (and refetches after a reassignment) after first render,
+  // so mirror the persisted level onto the control whenever it changes.
+  useEffect(() => {
+    if (current) setLevel(current);
+  }, [current]);
 
   return (
     <ActionShell
       icon={ShieldAlert}
       title="Customs risk"
-      subtitle="Assign the customs examination risk level."
+      subtitle={
+        assigned && !locked
+          ? "Reassign the customs examination risk level."
+          : "Assign the customs examination risk level."
+      }
       done={assigned}
+      keepChildrenWhenDone={!locked}
       doneLabel={
         current ? (
           <Badge color={RISK_COLOR[current]} variant="filled" radius="sm">
@@ -60,9 +80,10 @@ export function AssignRiskCard({
             size="compact-sm"
             color="edr-green"
             loading={assign.isPending}
+            disabled={assigned && level === current}
             onClick={() => assign.mutate({ riskLevel: level })}
           >
-            Assign risk
+            {assigned ? "Reassign risk" : "Assign risk"}
           </Button>
         </Group>
       </Box>

apps/edr-freight-web/backoffice/src/components/contracts/gl-actions/GlActionsPanel.tsx

@@ -70,7 +70,11 @@ export function GlActionsPanel({ bookingId, milestones }: GlActionsPanelProps) {
         {showTransport ? <TransportDocumentCard bookingId={bookingId} /> : null}
 
         {riskMs ? (
-          <AssignRiskCard bookingId={bookingId} milestone={riskMs} />
+          <AssignRiskCard
+            bookingId={bookingId}
+            milestone={riskMs}
+            locked={dutyMs?.status === "COMPLETED"}
+          />
         ) : null}
 
         <IncidentReportCard bookingId={bookingId} />