refactor backend and persist stock campaign queue

src/pages/Products.tsx

@@ -1,8 +1,8 @@
-import { useMemo, useState, useEffect } from 'react';
+import { useMemo, useState } from 'react';
 import { Link, useOutletContext } from 'react-router-dom';
 import { Search, Package, TrendingUp, ChevronLeft, ChevronRight, Download } from 'lucide-react';
 import DateRangePicker from '../components/DateRangePicker';
-import type { OrderData, DateRange } from '../types';
+import type { OrderData, DateRange, StockData } from '../types';
 import { parseOrderDate, exportToCSV } from '../dataService';
 
 const Products = () => {
@@ -10,7 +10,7 @@ const Products = () => {
     dateRange: DateRange, 
     setDateRange: (range: DateRange) => void, 
     ordersData: OrderData[],
-    stockData: any[],
+    stockData: StockData[],
     refreshInterval: number,
     setRefreshInterval: (interval: number) => void,
     loadData: (showLoading?: boolean) => void
@@ -21,11 +21,6 @@ const Products = () => {
   const [currentPage, setCurrentPage] = useState(1);
   const [itemsPerPage, setItemsPerPage] = useState(10);
 
-  // Reset to first page when search or date range changes
-  useEffect(() => {
-    setCurrentPage(1);
-  }, [searchTerm, dateRange]);
-
   const productsData = useMemo(() => {
     const orders = ordersData;
     const productMap: Record<string, { id: string, name: string, totalSold: number, revenue: number, lastPrice: number, stock: number }> = {};
@@ -75,7 +70,7 @@ const Products = () => {
     }
 
     return result.sort((a, b) => b.totalSold - a.totalSold);
-  }, [dateRange, searchTerm, ordersData]);
+  }, [dateRange, searchTerm, ordersData, stockData]);
 
   // Pagination logic
   const totalPages = Math.ceil(productsData.length / itemsPerPage);
@@ -97,7 +92,10 @@ const Products = () => {
         <div className="flex flex-col sm:flex-row gap-3">
           <DateRangePicker 
             dateRange={dateRange} 
-            onChange={setDateRange} 
+            onChange={(range) => {
+              setDateRange(range);
+              setCurrentPage(1);
+            }}
           />
           
           <div className="relative">
@@ -106,7 +104,10 @@ const Products = () => {
               type="text" 
               placeholder="Buscar por nome ou ID..." 
               value={searchTerm}
-              onChange={(e) => setSearchTerm(e.target.value)}
+              onChange={(e) => {
+                setSearchTerm(e.target.value);
+                setCurrentPage(1);
+              }}
               className="w-full md:w-64 bg-dark-card border border-dark-border text-dark-text rounded-xl pl-10 pr-4 py-2.5 focus:outline-none focus:border-brand-primary hover:border-brand-primary transition-colors shadow-sm"
             />
           </div>