fix loading

src/pages/food/Create.tsx

@@ -23,8 +23,8 @@ const CreateFood: FC = () => {
     const [isActive, setIsActive] = useState<boolean>(true)
     const [isSpecial, setIsSpecial] = useState<boolean>(false)
     const [imageFiles, setImageFiles] = useState<File[]>([])
-    const { mutate: createFood } = useCreateFood()
-    const { mutate: multipleUpload } = useMultipleUpload()
+    const { mutate: createFood, isPending } = useCreateFood()
+    const { mutate: multipleUpload, isPending: isUploading } = useMultipleUpload()
 
     const categories = data?.data?.map(category => ({
         label: category.title,
@@ -116,6 +116,7 @@ const CreateFood: FC = () => {
                     <Button
                         className='px-5'
                         onClick={() => formik.handleSubmit()}
+                        isLoading={isPending || isUploading}
                     >
                         <div className='flex gap-2 items-center'>
                             <TickCircle className='size-5' color='white' />

src/pages/food/List.tsx

@@ -7,6 +7,8 @@ import { useGetFoods } from './hooks/useFoodData'
 import { useFoodFilters } from './hooks/useFoodFilters'
 import { getFoodTableColumns } from './components/FoodTableColumns'
 import { useFoodFiltersFields } from './components/FoodFiltersFields'
+import { Link } from 'react-router-dom'
+import { Pages } from '@/config/Pages'
 
 const FoodsList: FC = () => {
     const {
@@ -30,12 +32,16 @@ const FoodsList: FC = () => {
         <div className='mt-5'>
             <div className='flex justify-between items-center'>
                 <h1 className='text-lg font-light'>لیست غذاها</h1>
-                <Button className='w-fit px-6'>
-                    <div className='flex gap-2 items-center'>
-                        <Add color='#fff' size={20} />
-                        <span>افزودن غذا</span>
-                    </div>
-                </Button>
+                <Link
+                    to={Pages.foods.add}
+                >
+                    <Button className='w-fit px-6'>
+                        <div className='flex gap-2 items-center'>
+                            <Add color='#fff' size={20} />
+                            <span>افزودن غذا</span>
+                        </div>
+                    </Button>
+                </Link>
             </div>
 
             <div className='mt-8'>

src/pages/food/Update.tsx

@@ -26,8 +26,8 @@ const UpdateFood: FC = () => {
   const [isSpecial, setIsSpecial] = useState<boolean>(false)
   const [imageFiles, setImageFiles] = useState<File[]>([])
   const [existingImages, setExistingImages] = useState<string[]>([])
-  const { mutate: updateFood } = useUpdateFood()
-  const { mutate: multipleUpload } = useMultipleUpload()
+  const { mutate: updateFood, isPending } = useUpdateFood()
+  const { mutate: multipleUpload, isPending: isUploading } = useMultipleUpload()
 
   const categories = categoriesData?.data?.map(category => ({
     label: category.title,
@@ -182,6 +182,7 @@ const UpdateFood: FC = () => {
           <Button
             className='px-5'
             onClick={() => formik.handleSubmit()}
+            isLoading={isPending || isUploading}
           >
             <div className='flex gap-2 items-center'>
               <TickCircle className='size-5' color='white' />