automation

apps/edr-freight-web/backoffice/src/pages/warehouses/LoadingQueuePage.tsx

@@ -1,7 +1,7 @@
 import { useMemo } from 'react';
 import { useNavigate } from 'react-router-dom';
 import { Badge, Button, Card, Container, Group, Stack, Table, Tabs, Text } from '@mantine/core';
-import { CreditCard, Eye } from 'lucide-react';
+import { CreditCard, Eye, Truck } from 'lucide-react';
 
 import Breadcrumbs from '@/components/ui/Breadcrumbs';
 import {
@@ -10,7 +10,8 @@ import {
   WarehouseHero,
   formatNumber,
 } from '@/components/warehouses';
-import { useWarehouseInventory } from '@/hooks/useWarehouses';
+import { useAutoLoadReady, useWarehouseInventory } from '@/hooks/useWarehouses';
+import { useToast } from '@/hooks/use-toast';
 import type { WarehouseInventoryItem } from '@/types/warehouse';
 
 const isPaid = (item: WarehouseInventoryItem) => item.booking?.status === 'PAID';
@@ -25,11 +26,26 @@ const isPaid = (item: WarehouseInventoryItem) => item.booking?.status === 'PAID'
  */
 export default function LoadingQueuePage() {
   const navigate = useNavigate();
+  const { toast } = useToast();
+  const autoLoad = useAutoLoadReady();
   const { data: readyData, isLoading: readyLoading } = useWarehouseInventory({
     status: 'READY_FOR_LOADING',
   });
   const { data: loadedData, isLoading: loadedLoading } = useWarehouseInventory({ status: 'LOADED' });
 
+  const handleAutoLoad = async () => {
+    try {
+      const res = await autoLoad.mutateAsync();
+      const r = res.data;
+      toast({
+        title: 'Auto-load complete',
+        description: `Loaded ${r.loadedCount} PAID item(s); skipped ${r.skippedCount} (unpaid stay pending).`,
+      });
+    } catch {
+      toast({ variant: 'destructive', title: 'Auto-load failed' });
+    }
+  };
+
   const readyItems = readyData ?? [];
   const loadedItems = loadedData ?? [];
 
@@ -48,6 +64,17 @@ export default function LoadingQueuePage() {
           subtitle="Manage bookings and inventory through the loading workflow."
         />
 
+        <Group justify="flex-end">
+          <Button
+            color="green"
+            leftSection={<Truck size={16} />}
+            loading={autoLoad.isPending}
+            onClick={handleAutoLoad}
+          >
+            Auto Load Ready Items
+          </Button>
+        </Group>
+
         <Card withBorder radius="md" padding="lg">
           <Tabs defaultValue="ready">
             <Tabs.List>