oh

components/tables/order-table.tsx

@@ -45,6 +45,7 @@ import {
   AlertDialogTitle,
   AlertDialogTrigger,
 } from "@/components/ui/alert-dialog";
+import { cacheUtils } from '@/lib/api-client';
 
 interface Order {
   _id: string;
@@ -126,6 +127,17 @@ export default function OrderTable() {
   const [isShipping, setIsShipping] = useState(false);
   const [itemsPerPage, setItemsPerPage] = useState<number>(20);
   const pageSizeOptions = [5, 10, 15, 20, 25, 50, 75, 100];
+  const [refreshTrigger, setRefreshTrigger] = useState(0);
+
+  // Add order refresh subscription
+  useEffect(() => {
+    const unsubscribe = cacheUtils.onOrderRefresh(() => {
+      console.log("Order data refresh triggered in OrderTable");
+      setRefreshTrigger(prev => prev + 1);
+    });
+
+    return unsubscribe;
+  }, []);
 
   // Fetch orders with server-side pagination
   const fetchOrders = useCallback(async () => {
@@ -141,6 +153,7 @@ export default function OrderTable() {
 
       const data = await clientFetch(`/orders?${queryParams}`);
       
+      console.log("Fetched orders with fresh data:", data.orders?.length || 0);
       setOrders(data.orders || []);
       setTotalPages(data.totalPages || 1);
       setTotalOrders(data.totalOrders || 0);
@@ -150,7 +163,7 @@ export default function OrderTable() {
     } finally {
       setLoading(false);
     }
-  }, [currentPage, statusFilter, itemsPerPage, sortConfig]);
+  }, [currentPage, statusFilter, itemsPerPage, sortConfig, refreshTrigger]);
 
   useEffect(() => {
     fetchOrders();
@@ -288,7 +301,14 @@ export default function OrderTable() {
 
   // Helper function to determine if order is underpaid
   const isOrderUnderpaid = (order: Order) => {
-    return order.underpaid === true && order.underpaymentAmount && order.underpaymentAmount > 0;
+    // More robust check - only show underpaid if status allows it and underpayment exists
+    return order.underpaid === true && 
+           order.underpaymentAmount && 
+           order.underpaymentAmount > 0 &&
+           order.status !== "paid" &&
+           order.status !== "completed" &&
+           order.status !== "shipped" &&
+           order.status !== "cancelled";
   };
 
   // Helper function to get underpaid display info
@@ -307,6 +327,29 @@ export default function OrderTable() {
     };
   };
 
+  // Add manual refresh function
+  const handleRefresh = () => {
+    console.log("Manual refresh triggered");
+    setRefreshTrigger(prev => prev + 1);
+    toast.success("Orders refreshed");
+  };
+
+  // Add periodic refresh for underpaid orders
+  useEffect(() => {
+    // Check if we have any underpaid orders
+    const hasUnderpaidOrders = orders.some(order => isOrderUnderpaid(order));
+    
+    if (hasUnderpaidOrders) {
+      console.log("Found underpaid orders, setting up refresh interval");
+      const interval = setInterval(() => {
+        console.log("Auto-refreshing due to underpaid orders");
+        setRefreshTrigger(prev => prev + 1);
+      }, 30000); // Refresh every 30 seconds if there are underpaid orders
+
+      return () => clearInterval(interval);
+    }
+  }, [orders]);
+
   return (
     <div className="space-y-4">
       <div className="border border-zinc-800 rounded-md bg-black/40 overflow-hidden">
@@ -409,11 +452,11 @@ export default function OrderTable() {
                       <TableCell>
                         <div className="flex flex-col">
                           <span>£{order.totalPrice.toFixed(2)}</span>
-                                                  {underpaidInfo && (
-                          <span className="text-xs text-red-400">
-                            Missing: £{(underpaidInfo.missing * 100).toFixed(2)}
-                          </span>
-                        )}
+                          {underpaidInfo && (
+                            <span className="text-xs text-red-400">
+                              Missing: £{(underpaidInfo.missing * 100).toFixed(2)}
+                            </span>
+                          )}
                         </div>
                       </TableCell>
                       <TableCell>