create services and hooks create food

src/pages/food/Create.tsx

@@ -9,21 +9,22 @@ import Button from '@/components/Button'
 import { Checkbox } from '@/components/ui/checkbox'
 import CreateFoodSidebar from './components/CreateFoodSidebar'
 import type { CreateFoodType } from './types/Types'
+import { useGetCategories } from './hooks/useFoodData'
 
 
 
 const CreateFood: FC = () => {
+
+    const { data } = useGetCategories();
     const [isActive, setIsActive] = useState<boolean>(true)
     const [isSpecial, setIsSpecial] = useState<boolean>(false)
     const [imageFiles, setImageFiles] = useState<File[]>([])
 
-    // دسته‌بندی‌های نمونه
-    const categories = [
-        { label: 'غذای اصلی', value: '1' },
-        { label: 'پیش غذا', value: '2' },
-        { label: 'دسر', value: '3' },
-        { label: 'نوشیدنی', value: '4' }
-    ]
+    // تبدیل داده‌های دسته‌ها به فرمت مورد نیاز Select
+    const categories = data?.data?.map(category => ({
+        label: category.title,
+        value: category.id
+    })) || []
 
     const formik = useFormik<CreateFoodType>({
         initialValues: {
@@ -86,7 +87,7 @@ const CreateFood: FC = () => {
                         onClick={() => formik.handleSubmit()}
                     >
                         <div className='flex gap-2 items-center'>
-                            <TickCircle className='size-5' color='black' />
+                            <TickCircle className='size-5' color='white' />
                             <div>ثبت غذا</div>
                         </div>
                     </Button>

src/pages/food/hooks/useFoodData.ts

@@ -0,0 +1,15 @@
+import { useMutation, useQuery } from "@tanstack/react-query";
+import * as api from "../service/FoodService";
+
+export const useCreateFood = () => {
+  return useMutation({
+    mutationFn: api.createFood,
+  });
+};
+
+export const useGetCategories = () => {
+  return useQuery({
+    queryKey: ["categories"],
+    queryFn: api.getCategories,
+  });
+};

src/pages/food/service/FoodService.ts

@@ -0,0 +1,12 @@
+import axios from "@/config/axios";
+import type { CreateFoodType, GetCategoriesResponseType } from "../types/Types";
+
+export const createFood = async (params: CreateFoodType) => {
+  const { data } = await axios.post(`/foods`, params);
+  return data;
+};
+
+export const getCategories = async (): Promise<GetCategoriesResponseType> => {
+  const { data } = await axios.get<GetCategoriesResponseType>(`/categories`);
+  return data;
+};

src/pages/food/types/Types.ts

@@ -1,3 +1,5 @@
+import type { IResponse } from "@/types/response.types";
+
 export type CreateFoodType = {
   breakfast: false;
   tue: false;
@@ -25,3 +27,16 @@ export type CreateFoodType = {
   discount: number;
   categoryIds: string[];
 };
+
+export type Category = {
+  id: string;
+  title: string;
+  isActive: boolean;
+  restId: string;
+  avatarUrl: string;
+  createdAt: string;
+  updatedAt: string;
+  foods: unknown[];
+};
+
+export type GetCategoriesResponseType = IResponse<Category[]>;

src/types/response.types.ts

@@ -1,5 +1,5 @@
 export interface IBaseResponse {
-  status: number;
+  statusCode: number;
   success: boolean;
 }
 export interface IResponse<T> extends IBaseResponse {