From d9012e524a4971b91b3b9af6a03531aa66d10bd7 Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Sat, 7 Feb 2026 12:39:45 +0330
Subject: [PATCH] filter category id

---
 src/components/Filters.tsx                     | 18 ++++++++++--------
 src/pages/food/List.tsx                        |  4 +++-
 .../food/components/FoodFiltersFields.tsx      | 18 ++++++++++++++++--
 src/pages/food/hooks/useFoodData.ts            | 10 +++++++---
 src/pages/food/service/FoodService.ts          | 17 +++++++++++------
 5 files changed, 47 insertions(+), 20 deletions(-)

diff --git a/src/components/Filters.tsx b/src/components/Filters.tsx
index 076dc61..e1381ab 100644
--- a/src/components/Filters.tsx
+++ b/src/components/Filters.tsx
@@ -174,14 +174,16 @@ const Filters: FC<FiltersProps> = ({
 
             case 'select':
                 return (
-                    <Select
-                        key={field.name}
-                        placeholder={field.placeholder}
-                        onChange={(e) => handleChange(field.name, e.target.value)}
-                        defaultValue={currentValue as string || field.defaultValue || ''}
-                        items={field.options}
-                        className='min-w-[170px]'
-                    />
+                    <div className='mt-1'>
+                        <Select
+                            key={field.name}
+                            placeholder={field.placeholder}
+                            onChange={(e) => handleChange(field.name, e.target.value)}
+                            defaultValue={currentValue as string || field.defaultValue || ''}
+                            items={field.options}
+                            className='min-w-[170px]'
+                        />
+                    </div>
                 );
 
             case 'multiselect':
diff --git a/src/pages/food/List.tsx b/src/pages/food/List.tsx
index b7bbdfa..afcc31d 100644
--- a/src/pages/food/List.tsx
+++ b/src/pages/food/List.tsx
@@ -19,9 +19,11 @@ const FoodsList: FC = () => {
         handlePageChange,
     } = useFoodFilters()
 
-    const { data: foodsData, isLoading } = useGetFoods(apiParams)
+    const { data: foodsData, isLoading } = useGetFoods(apiParams, filters)
     const { mutate: deleteFood, isPending: isDeleting } = useDeleteFood()
 
+
+
     const foods = foodsData?.data || []
     const columns = getFoodTableColumns({
         onDelete: (id: string) => deleteFood(id),
diff --git a/src/pages/food/components/FoodFiltersFields.tsx b/src/pages/food/components/FoodFiltersFields.tsx
index 9b1cd49..8ffde38 100644
--- a/src/pages/food/components/FoodFiltersFields.tsx
+++ b/src/pages/food/components/FoodFiltersFields.tsx
@@ -1,13 +1,27 @@
 import { useMemo } from 'react'
 import type { FieldType } from '@/components/Filters'
+import { useGetCategories } from '../hooks/useFoodData'
 
 export const useFoodFiltersFields = (): FieldType[] => {
+
+    const { data } = useGetCategories()
+
     return useMemo(() => [
         {
             type: 'input',
             name: 'search',
             placeholder: 'جستجو',
         },
-    ], [])
+        {
+            type: 'select',
+            name: 'categoryId',
+            placeholder: 'انتخاب',
+            options: data?.data?.map((item) => {
+                return {
+                    label: item.title,
+                    value: item.id
+                }
+            }) || []
+        },
+    ], [data?.data])
 }
-
diff --git a/src/pages/food/hooks/useFoodData.ts b/src/pages/food/hooks/useFoodData.ts
index 6601f0b..01ee295 100644
--- a/src/pages/food/hooks/useFoodData.ts
+++ b/src/pages/food/hooks/useFoodData.ts
@@ -5,6 +5,7 @@ import type {
   CreateFoodType,
   GetFoodsParams,
 } from "../types/Types";
+import type { FilterValues } from "@/components/Filters";
 
 export const useCreateFood = () => {
   return useMutation({
@@ -12,10 +13,13 @@ export const useCreateFood = () => {
   });
 };
 
-export const useGetFoods = (params?: GetFoodsParams) => {
+export const useGetFoods = (
+  params?: GetFoodsParams,
+  filters?: FilterValues,
+) => {
   return useQuery({
-    queryKey: ["foods", params],
-    queryFn: () => api.getFoods(params),
+    queryKey: ["foods", params, filters],
+    queryFn: () => api.getFoods(params, filters),
   });
 };
 
diff --git a/src/pages/food/service/FoodService.ts b/src/pages/food/service/FoodService.ts
index c1036e7..b0f90e5 100644
--- a/src/pages/food/service/FoodService.ts
+++ b/src/pages/food/service/FoodService.ts
@@ -8,6 +8,7 @@ import type {
   GetFoodsResponseType,
   GetIconsResponseType,
 } from "../types/Types";
+import type { FilterValues } from "@/components/Filters";
 
 export const createFood = async (params: CreateFoodType) => {
   const { data } = await axios.post(`/admin/foods`, params);
@@ -15,19 +16,23 @@ export const createFood = async (params: CreateFoodType) => {
 };
 
 export const getFoods = async (
-  params?: GetFoodsParams
+  params?: GetFoodsParams,
+  filters?: FilterValues,
 ): Promise<GetFoodsResponseType> => {
   const { data } = await axios.get<GetFoodsResponseType>(`/admin/foods`, {
-    params,
+    params: {
+      ...params,
+      ...filters,
+    },
   });
   return data;
 };
 
 export const getFoodDetails = async (
-  id: string
+  id: string,
 ): Promise<GetFoodDetailsResponseType> => {
   const { data } = await axios.get<GetFoodDetailsResponseType>(
-    `/admin/foods/${id}`
+    `/admin/foods/${id}`,
   );
   return data;
 };
@@ -39,7 +44,7 @@ export const updateFood = async (id: string, params: CreateFoodType) => {
 
 export const getCategories = async (): Promise<GetCategoriesResponseType> => {
   const { data } = await axios.get<GetCategoriesResponseType>(
-    `/admin/categories`
+    `/admin/categories`,
   );
   return data;
 };
@@ -61,7 +66,7 @@ export const deleteCategory = async (id: string) => {
 
 export const updateCategory = async (
   id: string,
-  params: CreateCategoryType
+  params: CreateCategoryType,
 ) => {
   const { data } = await axios.patch(`/admin/categories/${id}`, params);
   return data;