Merge pull request #935 from Tria-plc/freight_feature/usermanagement

changes

apps/edr-freight-web/backoffice/src/components/contracts/ContractActionsToolbar.tsx

@@ -14,6 +14,8 @@ import {
 } from "lucide-react";
 import type { Freight } from "@edr/types";
 
+import { useAuth } from "@/auth/useAuth";
+import { FREIGHT_PERMS, hasPermission } from "@/lib/permissions";
 import { api } from "@/services/api";
 import { contractsService } from "@/services/contracts.service";
 import { SectionCard } from "@/components/bookings/detail/SectionCard";
@@ -48,8 +50,19 @@ export function ContractActionsToolbar({
   onReviewClearance,
 }: ContractActionsToolbarProps) {
   const navigate = useNavigate();
+  const { user } = useAuth();
   const { status } = contract;
 
+  // Intake permissions are split per freight type: an accept:bulk holder must
+  // not see the accept button on a container contract (API enforces the same).
+  const arm = contract.freightType === "BULK" ? "bulk" : "container";
+  const mayAccept = hasPermission(user, FREIGHT_PERMS.contracts.staffAccept[arm]);
+  const mayRequestChanges = hasPermission(
+    user,
+    FREIGHT_PERMS.contracts.requestChanges[arm],
+  );
+  const mayReject = hasPermission(user, FREIGHT_PERMS.contracts.reject[arm]);
+
   const [editorOpen, setEditorOpen] = useState(false);
   const [editorMode, setEditorMode] = useState<"accept" | "edit">("accept");
   const [previewOpen, setPreviewOpen] = useState(false);
@@ -97,7 +110,8 @@ export function ContractActionsToolbar({
     );
   }
 
-  const canAccept = status === "SUBMITTED";
+  const canAccept =
+    status === "SUBMITTED" && (mayAccept || mayRequestChanges || mayReject);
   // The document stays editable for the whole approval chain, but only by the
   // approver whose turn it is. The server resolves that against the caller's
   // position type; the client cannot derive it.
@@ -126,35 +140,41 @@ export function ContractActionsToolbar({
 
         {canAccept && (
           <>
-            <Button
-              fullWidth
-              color="edr-green"
-              leftSection={<Check size={16} />}
-              onClick={() => {
-                setEditorMode("accept");
-                setEditorOpen(true);
-              }}
-            >
-              Accept for approval
-            </Button>
-            <Button
-              fullWidth
-              variant="light"
-              color="orange"
-              leftSection={<MessageSquareWarning size={16} />}
-              onClick={() => setChangesOpen(true)}
-            >
-              Request changes
-            </Button>
-            <Button
-              fullWidth
-              variant="light"
-              color="red"
-              leftSection={<XCircle size={16} />}
-              onClick={() => setRejectOpen(true)}
-            >
-              Reject contract
-            </Button>
+            {mayAccept && (
+              <Button
+                fullWidth
+                color="edr-green"
+                leftSection={<Check size={16} />}
+                onClick={() => {
+                  setEditorMode("accept");
+                  setEditorOpen(true);
+                }}
+              >
+                Accept for approval
+              </Button>
+            )}
+            {mayRequestChanges && (
+              <Button
+                fullWidth
+                variant="light"
+                color="orange"
+                leftSection={<MessageSquareWarning size={16} />}
+                onClick={() => setChangesOpen(true)}
+              >
+                Request changes
+              </Button>
+            )}
+            {mayReject && (
+              <Button
+                fullWidth
+                variant="light"
+                color="red"
+                leftSection={<XCircle size={16} />}
+                onClick={() => setRejectOpen(true)}
+              >
+                Reject contract
+              </Button>
+            )}
           </>
         )}