back

src/components/Filters.tsx

@@ -108,7 +108,6 @@ const Filters: FC<FiltersProps> = ({
                 setFilters(defaultValues);
                 setInputValues(defaultInputs);
                 setMultiSelectValues(defaultMultiSelects);
-                onChange(defaultValues);
             }
         }
     }, [fields, initialValues, onChange]);

src/hooks/useUrlPagination.ts

@@ -12,7 +12,7 @@ export const useUrlPagination = (defaultPage = 1) => {
   }, [searchParams, defaultPage]);
 
   const handlePageChange = useCallback(
-    (page: number) => {
+    (page: number, options?: { replace?: boolean }) => {
       setSearchParams(
         (prev) => {
           const next = new URLSearchParams(prev);
@@ -23,7 +23,7 @@ export const useUrlPagination = (defaultPage = 1) => {
           }
           return next;
         },
-        { replace: false },
+        { replace: options?.replace ?? false },
       );
     },
     [setSearchParams, defaultPage],

src/pages/admin/hooks/useAdminFilters.ts

@@ -1,5 +1,6 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 import type { GetAdminsParams } from "../types/Types";
 
 const DEFAULT_PAGE = 1;
@@ -7,7 +8,7 @@ const DEFAULT_LIMIT = 10;
 
 export const useAdminFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo<GetAdminsParams>(() => {
@@ -25,11 +26,7 @@ export const useAdminFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/comments/List.tsx

@@ -1,4 +1,4 @@
-import { type FC, useState } from 'react'
+import { type FC } from 'react'
 import Table from '@/components/Table'
 import Filters from '@/components/Filters'
 import Switch from '@/components/Switch'
@@ -8,6 +8,7 @@ import type { FilterValues } from '@/components/Filters'
 import { Link } from 'react-router-dom'
 import { Pages } from '@/config/Pages'
 import { formatOptionalDate } from '@/helpers/func'
+import { useUrlPagination } from '@/hooks/useUrlPagination'
 
 interface CommentData extends RowDataType {
     id: number
@@ -21,13 +22,9 @@ interface CommentData extends RowDataType {
 }
 
 const CommentsList: FC = () => {
-    const [currentPage, setCurrentPage] = useState(1)
+    const { currentPage, handlePageChange } = useUrlPagination()
     const totalPages = 2
 
-    const handlePageChange = (page: number) => {
-        setCurrentPage(page)
-    }
-
     const handleFiltersChange = (newFilters: FilterValues) => {
         console.log('فیلترها:', newFilters)
     }

src/pages/coupon/hooks/useCouponFilters.ts

@@ -1,21 +1,18 @@
 import { useState } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 
 const DEFAULT_PAGE = 1;
 const DEFAULT_LIMIT = 10;
 
 export const useCouponFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/customers/List.tsx

@@ -71,10 +71,11 @@ const CustomersList: FC = () => {
     const effectivePage = Math.min(currentPage, totalPages)
 
     useEffect(() => {
+        if (isLoading) return
         if (currentPage > totalPages) {
-            handlePageChange(totalPages)
+            handlePageChange(totalPages, { replace: true })
         }
-    }, [currentPage, totalPages, handlePageChange])
+    }, [currentPage, totalPages, handlePageChange, isLoading])
 
     const paginatedCustomers = useMemo(() => {
         const startIndex = (effectivePage - 1) * limit

src/pages/notifications/hooks/useNotificationFilters.ts

@@ -1,12 +1,13 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 
 const DEFAULT_PAGE = 1;
 const DEFAULT_LIMIT = 10;
 
 export const useNotificationFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo(() => {
@@ -28,11 +29,7 @@ export const useNotificationFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/orders/List.tsx

@@ -29,10 +29,11 @@ const OrdersList: FC = () => {
     const effectivePage = Math.min(currentPage, totalPages)
 
     useEffect(() => {
+        if (isLoading || !ordersData) return
         if (currentPage > totalPages) {
-            handlePageChange(totalPages)
+            handlePageChange(totalPages, { replace: true })
         }
-    }, [currentPage, totalPages, handlePageChange])
+    }, [currentPage, totalPages, handlePageChange, isLoading, ordersData])
 
     return (
         <div className='mt-5'>

src/pages/pager/hooks/usePagerFilters.ts

@@ -1,21 +1,18 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 
 const DEFAULT_PAGE = 1;
 const DEFAULT_LIMIT = 10;
 
 export const usePagerFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   const filteredData = useMemo(() => {

src/pages/paymentMethods/hooks/usePaymentMethodFilters.ts

@@ -1,5 +1,6 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 import type { GetRestaurantPaymentMethodsParams } from "../types/Types";
 
 const DEFAULT_PAGE = 1;
@@ -7,7 +8,7 @@ const DEFAULT_LIMIT = 10;
 
 export const usePaymentMethodFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo<GetRestaurantPaymentMethodsParams>(() => {
@@ -25,11 +26,7 @@ export const usePaymentMethodFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/product/hooks/useProductFilters.ts

@@ -1,5 +1,6 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 import type { GetProductsParams } from "../types/Types";
 
 const DEFAULT_PAGE = 1;
@@ -7,7 +8,7 @@ const DEFAULT_LIMIT = 10;
 
 export const useProductFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo<GetProductsParams>(() => {
@@ -25,11 +26,7 @@ export const useProductFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/report/hooks/useReportFilters.ts

@@ -1,12 +1,13 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 
 const DEFAULT_PAGE = 1;
 const DEFAULT_LIMIT = 10;
 
 export const useReportFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo(() => {
@@ -28,11 +29,7 @@ export const useReportFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/review/hooks/useReviewFilters.ts

@@ -1,12 +1,13 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 
 const DEFAULT_PAGE = 1;
 const DEFAULT_LIMIT = 10;
 
 export const useReviewFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo(() => {
@@ -32,11 +33,7 @@ export const useReviewFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {

src/pages/roles/hooks/useRolesFilters.ts

@@ -1,12 +1,13 @@
 import { useState, useMemo } from 'react'
 import type { FilterValues } from '@/components/Filters'
+import { useUrlPagination } from '@/hooks/useUrlPagination'
 
 const DEFAULT_PAGE = 1
 const DEFAULT_LIMIT = 10
 
 export const useRolesFilters = () => {
     const [filters, setFilters] = useState<FilterValues>({})
-    const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE)
+    const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE)
     const [limit] = useState(DEFAULT_LIMIT)
 
     const apiParams = useMemo(() => {
@@ -24,11 +25,7 @@ export const useRolesFilters = () => {
 
     const handleFiltersChange = (newFilters: FilterValues) => {
         setFilters(newFilters)
-        setCurrentPage(DEFAULT_PAGE)
+        resetPage()
-    }
-
-    const handlePageChange = (page: number) => {
-        setCurrentPage(page)
     }
 
     return {

src/pages/schedule/hooks/useScheduleFilters.ts

@@ -1,12 +1,13 @@
 import { useState, useMemo } from 'react'
 import type { FilterValues } from '@/components/Filters'
+import { useUrlPagination } from '@/hooks/useUrlPagination'
 
 const DEFAULT_PAGE = 1
 const DEFAULT_LIMIT = 10
 
 export const useScheduleFilters = () => {
     const [filters, setFilters] = useState<FilterValues>({})
-    const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE)
+    const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE)
     const [limit] = useState(DEFAULT_LIMIT)
 
     const apiParams = useMemo(() => {
@@ -24,11 +25,7 @@ export const useScheduleFilters = () => {
 
     const handleFiltersChange = (newFilters: FilterValues) => {
         setFilters(newFilters)
-        setCurrentPage(DEFAULT_PAGE)
+        resetPage()
-    }
-
-    const handlePageChange = (page: number) => {
-        setCurrentPage(page)
     }
 
     return {

src/pages/shipmentMethod/hooks/useShipmentMethodFilters.ts

@@ -1,5 +1,6 @@
 import { useState, useMemo } from "react";
 import type { FilterValues } from "@/components/Filters";
+import { useUrlPagination } from "@/hooks/useUrlPagination";
 import type { GetRestaurantShipmentMethodsParams } from "../types/Types";
 
 const DEFAULT_PAGE = 1;
@@ -7,7 +8,7 @@ const DEFAULT_LIMIT = 10;
 
 export const useShipmentMethodFilters = () => {
   const [filters, setFilters] = useState<FilterValues>({});
-  const [currentPage, setCurrentPage] = useState(DEFAULT_PAGE);
+  const { currentPage, handlePageChange, resetPage } = useUrlPagination(DEFAULT_PAGE);
   const [limit] = useState(DEFAULT_LIMIT);
 
   const apiParams = useMemo<GetRestaurantShipmentMethodsParams>(() => {
@@ -25,11 +26,7 @@ export const useShipmentMethodFilters = () => {
 
   const handleFiltersChange = (newFilters: FilterValues) => {
     setFilters(newFilters);
-    setCurrentPage(DEFAULT_PAGE);
+    resetPage();
-  };
-
-  const handlePageChange = (page: number) => {
-    setCurrentPage(page);
   };
 
   return {