delete foods

src/pages/food/components/FoodTableColumns.tsx

@@ -5,8 +5,15 @@ import { formatPrice, formatTime } from '../utils/formatters'
 import Status from '@/components/Status'
 import { Link } from 'react-router-dom'
 import { Pages } from '@/config/Pages'
+import TrashWithConfrim from '@/components/TrashWithConfrim'
+
+interface GetFoodTableColumnsParams {
+    onDelete: (id: string) => void
+    isDeleting: boolean
+}
+
+export const getFoodTableColumns = ({ onDelete, isDeleting }: GetFoodTableColumnsParams): ColumnType<Food>[] => {
 
-export const getFoodTableColumns = (): ColumnType<Food>[] => {
     return [
         {
             key: 'image',
@@ -67,9 +74,15 @@ export const getFoodTableColumns = (): ColumnType<Food>[] => {
             title: '',
             render: (item: Food) => {
                 return (
-                    <Link to={Pages.foods.update + item.id} className='flex gap-2 items-center'>
-                        <Eye size={20} color='#8C90A3' />
-                    </Link>
+                    <div className='flex gap-2 items-center'>
+                        <Link to={Pages.foods.update + item.id} className='flex gap-2 items-center'>
+                            <Eye size={20} color='#8C90A3' />
+                        </Link>
+                        <TrashWithConfrim
+                            onDelete={() => onDelete(item.id)}
+                            isLoading={isDeleting}
+                        />
+                    </div>
                 )
             }
         },