add permissions and fix issues

apps/edr-freight-web/backoffice/src/pages/contracts/ContractViewPage.tsx

@@ -20,6 +20,8 @@ import { ContractSignSuccessModal } from "@/components/contracts/ContractSignSuc
 import { ContractSignaturePad } from "@/components/bookings/ContractSignaturePad";
 import { contractsService } from "@/services/contracts.service";
 import { QUERY_KEYS } from "@/constants/QUERY_KEYS";
+import { useAuth } from "@/auth/useAuth";
+import { FREIGHT_PERMS, hasPermission } from "@/lib/permissions";
 
 /**
  * Staff contract preview + sign. Staff must open and read the generated
@@ -30,6 +32,7 @@ export default function ContractViewPage() {
   const navigate = useNavigate();
   const qc = useQueryClient();
   const iframeRef = useRef<HTMLIFrameElement>(null);
+  const { user } = useAuth();
 
   const [signOpen, setSignOpen] = useState(false);
   const [successOpen, setSuccessOpen] = useState(false);
@@ -116,6 +119,15 @@ export default function ContractViewPage() {
     );
   }
 
+  // Counter-signature permission is split per freight type — a bulk signer must
+  // not sign a container contract (API enforces the same on POST /contract/sign).
+  const maySign = hasPermission(
+    user,
+    FREIGHT_PERMS.contracts.signStaff[
+      data.freightType === "BULK" ? "bulk" : "container"
+    ],
+  );
+
   return (
     <Box p={{ base: "md", md: "xl" }}>
       <Box maw={920} mx="auto">
@@ -145,7 +157,7 @@ export default function ContractViewPage() {
             >
               Download PDF
             </Button>
-            {data.canSignStaff && (
+            {data.canSignStaff && maySign && (
               <Button
                 color="edr-green"
                 leftSection={<FileSignature size={16} />}