Add 'Show Non-Replenishable' filter to Products page and update API to handle non-replenishable products

inventory/src/pages/Products.tsx

@@ -27,6 +27,8 @@ import {
   PaginationNext,
   PaginationPrevious,
 } from "@/components/ui/pagination"
+import { Switch } from '@/components/ui/switch';
+import { Label } from '@/components/ui/label';
 
 // Column definition type
 interface ColumnDef {
@@ -104,6 +106,7 @@ export function Products() {
   const [selectedProductId, setSelectedProductId] = useState<number | null>(null);
   const [activeView, setActiveView] = useState("all");
   const [pageSize] = useState(50);
+  const [showNonReplenishable, setShowNonReplenishable] = useState(false);
 
   // Group columns by their group property
   const columnsByGroup = AVAILABLE_COLUMNS.reduce((acc, col) => {
@@ -133,6 +136,11 @@ export function Products() {
       params.append('stockStatus', activeView);
     }
 
+    // Add showNonReplenishable param
+    if (showNonReplenishable) {
+      params.append('showNonReplenishable', 'true');
+    }
+
     // Add other filters
     Object.entries(filters).forEach(([key, value]) => {
       if (value !== undefined && value !== '') {
@@ -149,7 +157,7 @@ export function Products() {
 
   // Query for products data
   const { data, isFetching } = useQuery({
-    queryKey: ['products', currentPage, pageSize, sortColumn, sortDirection, activeView, filters],
+    queryKey: ['products', currentPage, pageSize, sortColumn, sortDirection, activeView, filters, showNonReplenishable],
     queryFn: fetchProducts,
     placeholderData: keepPreviousData,
   });
@@ -271,6 +279,17 @@ export function Products() {
             activeFilters={filters}
           />
           <div className="flex items-center gap-4">
+            <div className="flex items-center space-x-2">
+              <Switch
+                id="show-non-replenishable"
+                checked={showNonReplenishable}
+                onCheckedChange={(checked) => {
+                  setShowNonReplenishable(checked);
+                  setCurrentPage(1);
+                }}
+              />
+              <Label htmlFor="show-non-replenishable">Show Non-Replenishable</Label>
+            </div>
             {data?.pagination.total > 0 && (
               <div className="text-sm text-muted-foreground">
                 {data.pagination.total.toLocaleString()} products