wAREHOUSE kPI strips

apps/edr-freight-web/backoffice/src/components/warehouses/WarehouseOpsKpiStrip.tsx

@@ -0,0 +1,45 @@
+import { AlertTriangle, ClipboardCheck, PackageCheck, Truck } from "lucide-react";
+
+import { KpiStrip } from "@/components/page";
+import { useWarehouseOpsStats } from "@/hooks/useWarehouses";
+
+/**
+ * At-a-glance warehouse ops KPIs (received today, pending inspection, trucks
+ * on-site, items aging). Drop-in for any warehouse ops page header.
+ */
+export function WarehouseOpsKpiStrip() {
+  const { data, isLoading } = useWarehouseOpsStats();
+
+  return (
+    <KpiStrip
+      loading={isLoading}
+      items={[
+        {
+          label: "Received today",
+          value: data?.receivedToday ?? 0,
+          icon: PackageCheck,
+          color: "edr-green",
+        },
+        {
+          label: "Pending inspection",
+          value: data?.pendingInspection ?? 0,
+          icon: ClipboardCheck,
+          color: "yellow",
+        },
+        {
+          label: "Trucks on-site",
+          value: data?.trucksOnSite ?? 0,
+          icon: Truck,
+          color: "blue",
+        },
+        {
+          label: "Items aging (>7d)",
+          value: data?.itemsAging ?? 0,
+          icon: AlertTriangle,
+          color: (data?.itemsAging ?? 0) > 0 ? "red" : "edr-green",
+          hint: "In warehouse over 7 days",
+        },
+      ]}
+    />
+  );
+}

apps/edr-freight-web/backoffice/src/components/warehouses/index.ts

@@ -30,3 +30,4 @@ export { WarehouseDashboardCharts } from './WarehouseDashboardCharts';
 export { InspectionReportModal } from './InspectionReportModal';
 export { FeePreviewModal } from './FeePreviewModal';
 export { ZoneOccupancyHeatmap } from './ZoneOccupancyHeatmap';
+export { WarehouseOpsKpiStrip } from './WarehouseOpsKpiStrip';