create base product

2026-02-09 14:52:05 +03:30
parent 687fc1e6c2
commit ba5beae0f7
6 changed files with 247 additions and 306 deletions
@@ -3,14 +3,9 @@ import { useFormik } from 'formik'
 import * as Yup from 'yup'
 import { TickCircle } from 'iconsax-react'
 import { toast } from 'react-toastify'
-import Input from '@/components/Input'
-import Select from '@/components/Select'
-import Textarea from '@/components/Textarea'
 import Button from '@/components/Button'
-import { Checkbox } from '@/components/ui/checkbox'
 import CreateProductSidebar from './components/CreateProductSidebar'
-import WeekDaysSection from './components/WeekDaysSection'
-import MealTimesSection from './components/MealTimesSection'
+import BasicInfoSection from './components/BasicInfoSection'
 import type { CreateProductType } from './types/Types'
 import { useCreateProduct, useGetCategories } from './hooks/useProductData'
 import { useMultipleUpload } from '../uploader/hooks/useUploaderData'
@@ -35,42 +30,44 @@ const CreateProduct: FC = () => {

    const formik = useFormik<CreateProductType>({
        initialValues: {
-            title: '',
-            desc: '',
-            content: [],
            categoryId: '',
+            title: '',
+            attribute: '',
+            variants: [],
+            desc: '',
            price: 0,
-            discount: 0,
-            prepareTime: 0,
-            weekDays: [0, 1, 2, 3, 4, 5, 6],
-            mealTypes: ['breakfast', 'lunch', 'dinner'],
-            pickupServe: true,
-            inPlaceServe: true,
            isActive: true,
            images: [],
+            discount: 0,
            isSpecialOffer: false,
-            dailyStock: 0,
            order: 0
        },
        validationSchema: Yup.object().shape({
            title: Yup.string().required('نام کالا الزامی است'),
            categoryId: Yup.string().required('دسته‌بندی الزامی است'),
            price: Yup.number().required('قیمت الزامی است').min(0, 'قیمت باید مثبت باشد'),
-            prepareTime: Yup.number().required('زمان آماده‌سازی الزامی است').min(0, 'زمان آماده‌سازی باید مثبت باشد'),
            discount: Yup.number().min(0, 'تخفیف باید مثبت باشد'),
-            dailyStock: Yup.number().required('موجودی روزانه الزامی است').min(0, 'موجودی روزانه باید مثبت باشد'),
-            content: Yup.array().of(Yup.string()),
-            weekDays: Yup.array().of(Yup.number()),
-            mealTypes: Yup.array().of(Yup.string())
+            attribute: Yup.string(),
+            variants: Yup.array().of(
+                Yup.object().shape({
+                    id: Yup.string(),
+                    value: Yup.string(),
+                    price: Yup.number().min(0)
+                })
+            )
        }),
        onSubmit: (values) => {
            const submitProduct = (imageUrls: string[] = []) => {
+                const variants =
+                    values.variants.length > 0
+                        ? values.variants
+                        : [{ value: '', price: values.price }]
                const productData: CreateProductType = {
                    ...values,
+                    variants,
                    isActive,
                    isSpecialOffer: isSpecial,
-                    images: imageUrls,
-                    content: values.content.filter(item => item && item.trim().length > 0)
+                    images: imageUrls
                }

                createProduct(productData, {
@@ -123,158 +120,7 @@ const CreateProduct: FC = () => {
            <div className='flex flex-col lg:flex-row gap-6 mt-6'>
                <div className='flex-1'>
                    <div className='bg-white py-6 sm:py-8 xl:px-10 px-4 rounded-3xl'>
-                        <Input
-                            label='نام کالا'
-                            name='title'
-                            placeholder=''
-                            value={formik.values.title}
-                            onChange={formik.handleChange}
-                            error_text={formik.touched.title && formik.errors.title ? formik.errors.title : ''}
-                        />
-
-                        <div className='mt-5'>
-                            <Select
-                                items={categories}
-                                label='دسته بندی'
-                                placeholder='انتخاب کنید'
-                                name='categoryId'
-                                value={formik.values.categoryId}
-                                onChange={(e) => {
-                                    const value = e.target.value
-                                    formik.setFieldValue('categoryId', value)
-                                }}
-                                error_text={formik.touched.categoryId && formik.errors.categoryId ? String(formik.errors.categoryId) : ''}
-                            />
-                        </div>
-
-                        <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mt-5'>
-                            <Input
-                                name='price'
-                                label='قیمت'
-                                placeholder='تومان'
-                                type='number'
-                                seprator={true}
-                                value={formik.values.price}
-                                onChange={(e) => formik.setFieldValue('price', Number(e.target.value))}
-                                error_text={formik.touched.price && formik.errors.price ? formik.errors.price : ''}
-                            />
-
-                            <Input
-                                name='discount'
-                                label='تخفیف'
-                                placeholder='تومان'
-                                type='number'
-                                seprator={true}
-                                value={formik.values.discount}
-                                onChange={(e) => formik.setFieldValue('discount', Number(e.target.value))}
-                                error_text={formik.touched.discount && formik.errors.discount ? formik.errors.discount : ''}
-                            />
-
-                            <Input
-                                name='prepareTime'
-                                label='زمان آماده سازی'
-                                placeholder='دقیقه'
-                                type='number'
-                                value={formik.values.prepareTime}
-                                onChange={(e) => formik.setFieldValue('prepareTime', Number(e.target.value))}
-                                error_text={formik.touched.prepareTime && formik.errors.prepareTime ? formik.errors.prepareTime : ''}
-                            />
-
-                            <Input
-                                name='dailyStock'
-                                label='موجودی روزانه'
-                                placeholder='عدد'
-                                type='number'
-                                seprator={true}
-                                value={formik.values.dailyStock}
-                                onChange={(e) => formik.setFieldValue('dailyStock', Number(e.target.value))}
-                                error_text={formik.touched.dailyStock && formik.errors.dailyStock ? formik.errors.dailyStock : ''}
-                            />
-                        </div>
-
-                        <div className='mt-5'>
-                            <Textarea
-                                name='desc'
-                                label='توضیحات کالا'
-                                placeholder=''
-                                value={formik.values.desc}
-                                onChange={formik.handleChange}
-                                error_text={formik.touched.desc && formik.errors.desc ? formik.errors.desc : ''}
-                            />
-                        </div>
-
-                        <div className='mt-5'>
-                            <Input
-                                name='order'
-                                label='اولویت'
-                                placeholder='عدد'
-                                type='number'
-                                value={formik.values.order}
-                                onChange={(e) => formik.setFieldValue('order', Number(e.target.value))}
-                                error_text={formik.touched.order && formik.errors.order ? formik.errors.order : ''}
-                            />
-                        </div>
-
-                        <div className='mt-5'>
-                            <div className='text-sm mb-2'>محتوای کالا</div>
-                            <div className='space-y-2'>
-                                {formik.values.content.map((item, index) => (
-                                    <div key={index} className='flex gap-2 items-center'>
-                                        <Input
-                                            placeholder='متن محتوا'
-                                            value={item}
-                                            onChange={(e) => {
-                                                const newContent = [...formik.values.content]
-                                                newContent[index] = e.target.value
-                                                formik.setFieldValue('content', newContent)
-                                            }}
-                                        />
-                                        <Button
-                                            type='button'
-                                            className='px-3 bg-red-500 hover:bg-red-600 w-auto'
-                                            onClick={() => {
-                                                const newContent = formik.values.content.filter((_, i) => i !== index)
-                                                formik.setFieldValue('content', newContent)
-                                            }}
-                                        >
-                                            حذف
-                                        </Button>
-                                    </div>
-                                ))}
-                                <Button
-                                    type='button'
-                                    className='w-full bg-gray-200 text-gray-700 hover:bg-gray-300'
-                                    onClick={() => {
-                                        formik.setFieldValue('content', [...formik.values.content, ''])
-                                    }}
-                                >
-                                    افزودن محتوا
-                                </Button>
-                            </div>
-                        </div>
-
-                        <MealTimesSection formik={formik} />
-                        <WeekDaysSection formik={formik} />
-
-                        <div className='mt-6'>
-                            <div className='text-sm mb-3'>گزینه‌های سرویس</div>
-                            <div className='flex gap-6 flex-wrap'>
-                                <div className='flex items-center gap-2'>
-                                    <Checkbox
-                                        checked={formik.values.pickupServe}
-                                        onCheckedChange={(checked) => formik.setFieldValue('pickupServe', checked)}
-                                    />
-                                    <label className='text-xs cursor-pointer'> بیرون‌بر</label>
-                                </div>
-                                <div className='flex items-center gap-2'>
-                                    <Checkbox
-                                        checked={formik.values.inPlaceServe}
-                                        onCheckedChange={(checked) => formik.setFieldValue('inPlaceServe', checked)}
-                                    />
-                                    <label className='text-xs cursor-pointer'>سرو در محل</label>
-                                </div>
-                            </div>
-                        </div>
+                        <BasicInfoSection formik={formik} categories={categories} />
                    </div>
                </div>

@@ -7,10 +7,6 @@ import { useNavigate, useParams } from 'react-router-dom'
 import Button from '@/components/Button'
 import CreateProductSidebar from './components/CreateProductSidebar'
 import BasicInfoSection from './components/BasicInfoSection'
-import ProductContentSection from './components/ProductContentSection'
-import MealTimesSection from './components/MealTimesSection'
-import WeekDaysSection from './components/WeekDaysSection'
-import ServiceOptionsSection from './components/ServiceOptionsSection'
 import type { CreateProductType } from './types/Types'
 import { useUpdateProduct, useGetProductDetails, useGetCategories } from './hooks/useProductData'
 import { useMultipleUpload } from '../uploader/hooks/useUploaderData'
@@ -38,33 +34,31 @@ const UpdateProduct: FC = () => {

  const formik = useFormik<CreateProductType>({
    initialValues: {
-      title: '',
-      desc: '',
-      content: [],
      categoryId: '',
+      title: '',
+      attribute: '',
+      variants: [],
+      desc: '',
      price: 0,
-      discount: 0,
-      prepareTime: 0,
-      weekDays: [],
-      mealTypes: [],
-      pickupServe: false,
-      inPlaceServe: false,
      isActive: true,
      images: [],
+      discount: 0,
      isSpecialOffer: false,
-      dailyStock: 0,
      order: 0
    },
    validationSchema: Yup.object().shape({
      title: Yup.string().required('نام کالا الزامی است'),
      categoryId: Yup.string().required('دسته‌بندی الزامی است'),
      price: Yup.number().required('قیمت الزامی است').min(0, 'قیمت باید مثبت باشد'),
-      prepareTime: Yup.number().required('زمان آماده‌سازی الزامی است').min(0, 'زمان آماده‌سازی باید مثبت باشد'),
      discount: Yup.number().min(0, 'تخفیف باید مثبت باشد'),
-      dailyStock: Yup.number().required('موجودی روزانه الزامی است').min(0, 'موجودی روزانه باید مثبت باشد'),
-      content: Yup.array().of(Yup.string()),
-      weekDays: Yup.array().of(Yup.number()),
-      mealTypes: Yup.array().of(Yup.string())
+      attribute: Yup.string(),
+      variants: Yup.array().of(
+        Yup.object().shape({
+          id: Yup.string(),
+          value: Yup.string(),
+          price: Yup.number().min(0)
+        })
+      )
    }),
    onSubmit: (values) => {
      if (!id) {
@@ -74,12 +68,16 @@ const UpdateProduct: FC = () => {

      const submitProduct = (newImageUrls: string[] = []) => {
        const allImages = [...values.images, ...newImageUrls]
+        const variants =
+          values.variants.length > 0
+            ? values.variants
+            : [{ value: '', price: values.price }]
        const productData: CreateProductType = {
          ...values,
+          variants,
          isActive,
          isSpecialOffer: isSpecial,
-          images: allImages,
-          content: values.content.filter(item => item && item.trim().length > 0)
+          images: allImages
        }

        updateProduct({ id, params: productData }, {
@@ -112,22 +110,17 @@ const UpdateProduct: FC = () => {
  useEffect(() => {
    if (product) {
      formik.setValues({
-        title: product.title || '',
-        desc: product.desc || '',
-        content: product.content || [],
        categoryId: product.category?.id || '',
+        title: product.title || '',
+        attribute: product.attribute || '',
+        variants: product.variants || [],
+        desc: product.desc || '',
        price: product.price || 0,
-        discount: product.discount || 0,
-        prepareTime: product.prepareTime || 0,
-        weekDays: product.weekDays || [],
-        mealTypes: product.mealTypes || [],
-        pickupServe: product.pickupServe || false,
-        inPlaceServe: product.inPlaceServe || false,
        isActive: product.isActive || false,
        images: product.images || [],
+        discount: product.discount || 0,
        isSpecialOffer: product.isSpecialOffer || false,
-        dailyStock: product.inventory?.totalStock || 0,
-        order: product.order || 0
+        order: product.order ?? 0
      })
      setIsActive(product.isActive || false)
      setIsSpecial(product.isSpecialOffer || false)
@@ -180,11 +173,11 @@ const UpdateProduct: FC = () => {
      <div className='flex flex-col lg:flex-row gap-6 mt-6'>
        <div className='flex-1'>
          <div className='bg-white py-6 sm:py-8 xl:px-10 px-4 rounded-3xl'>
-            <BasicInfoSection formik={formik} categories={categories} />
-            <ProductContentSection formik={formik} />
-            <MealTimesSection formik={formik} />
-            <WeekDaysSection formik={formik} />
-            <ServiceOptionsSection formik={formik} />
+            <BasicInfoSection
+              formik={formik}
+              categories={categories}
+              initialHasVariants={(product?.variants?.length ?? 0) > 0}
+            />
          </div>
        </div>

@@ -1,16 +1,59 @@
-import { type FC } from 'react'
+import { type FC, useState, useEffect } from 'react'
 import type { FormikProps } from 'formik'
 import Input from '@/components/Input'
 import Select from '@/components/Select'
 import Textarea from '@/components/Textarea'
-import type { CreateProductType } from '../types/Types'
+import Button from '@/components/Button'
+import RadioGroup from '@/components/RadioGroup'
+import type { CreateProductType, ProductVariant } from '../types/Types'
+import { Add, Trash } from 'iconsax-react'

 type BasicInfoSectionProps = {
  formik: FormikProps<CreateProductType>
  categories: Array<{ label: string; value: string }>
+  /** در صفحه ویرایش، اگر کالا تنوع دارد مقدار true پاس داده شود */
+  initialHasVariants?: boolean
 }

-const BasicInfoSection: FC<BasicInfoSectionProps> = ({ formik, categories }) => {
+const newVariant = (): ProductVariant => ({ value: '', price: 0 })
+
+const BasicInfoSection: FC<BasicInfoSectionProps> = ({ formik, categories, initialHasVariants }) => {
+  const [hasVariants, setHasVariants] = useState<boolean>(initialHasVariants ?? false)
+
+  useEffect(() => {
+    if (initialHasVariants !== undefined) {
+      setHasVariants(initialHasVariants)
+    }
+  }, [initialHasVariants])
+
+  const handleHasVariantsChange = (value: string | boolean) => {
+    const next = value === true
+    setHasVariants(next)
+    if (!next) {
+      formik.setFieldValue('variants', [])
+      formik.setFieldValue('attribute', '')
+    } else if (formik.values.variants.length === 0) {
+      formik.setFieldValue('variants', [newVariant()])
+    }
+  }
+
+  const addVariant = () => {
+    formik.setFieldValue('variants', [...formik.values.variants, newVariant()])
+  }
+
+  const updateVariant = (index: number, field: keyof ProductVariant, value: string | number) => {
+    const next = [...formik.values.variants]
+    next[index] = { ...next[index], [field]: value }
+    formik.setFieldValue('variants', next)
+  }
+
+  const removeVariant = (index: number) => {
+    formik.setFieldValue(
+      'variants',
+      formik.values.variants.filter((_, i) => i !== index)
+    )
+  }
+
  return (
    <>
      <Input
@@ -37,49 +80,130 @@ const BasicInfoSection: FC<BasicInfoSectionProps> = ({ formik, categories }) =>
        />
      </div>

-      <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-4 mt-5'>
-        <Input
-          name='price'
-          label='قیمت'
-          placeholder='تومان'
-          type='number'
-          seprator={true}
-          value={formik.values.price}
-          onChange={(e) => formik.setFieldValue('price', Number(e.target.value))}
-          error_text={formik.touched.price && formik.errors.price ? formik.errors.price : ''}
-        />
+      {/* بخش قیمت‌گذاری و تنوع */}
+      <div className='mt-6 p-5 sm:p-6 rounded-2xl border border-gray-200/80 bg-gray-50/50'>
+        <div className='text-sm font-medium text-gray-800 mb-1'>قیمت‌گذاری و تنوع</div>
+        <p className='text-xs text-gray-500 mb-4'>تعیین کنید کالا دارای تنوع (مثلاً رنگ، سایز) است یا یک قیمت ثابت دارد.</p>

-        <Input
-          name='discount'
-          label='تخفیف'
-          placeholder='تومان'
-          type='number'
-          seprator={true}
-          value={formik.values.discount}
-          onChange={(e) => formik.setFieldValue('discount', Number(e.target.value))}
-          error_text={formik.touched.discount && formik.errors.discount ? formik.errors.discount : ''}
-        />
+        <div className='mb-5'>
+          <label className='block text-sm text-gray-700 mb-2'>کالای شما دارای تنوع است؟</label>
+          <RadioGroup
+            items={[
+              { label: 'خیر، فقط یک قیمت دارد', value: false },
+              { label: 'بله، دارای تنوع است', value: true }
+            ]}
+            selected={hasVariants}
+            onChange={handleHasVariantsChange}
+          />
+        </div>

-        <Input
-          name='prepareTime'
-          label='زمان آماده سازی'
-          placeholder='دقیقه'
-          type='number'
-          value={formik.values.prepareTime}
-          onChange={(e) => formik.setFieldValue('prepareTime', Number(e.target.value))}
-          error_text={formik.touched.prepareTime && formik.errors.prepareTime ? formik.errors.prepareTime : ''}
-        />
+        {!hasVariants ? (
+          <div className='grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-4'>
+            <Input
+              name='price'
+              label='قیمت (تومان)'
+              placeholder='۰'
+              type='number'
+              seprator={true}
+              value={formik.values.price}
+              onChange={(e) => formik.setFieldValue('price', Number(e.target.value))}
+              error_text={formik.touched.price && formik.errors.price ? formik.errors.price : ''}
+            />
+            <Input
+              name='discount'
+              label='تخفیف (تومان)'
+              placeholder='۰'
+              type='number'
+              seprator={true}
+              value={formik.values.discount}
+              onChange={(e) => formik.setFieldValue('discount', Number(e.target.value))}
+              error_text={formik.touched.discount && formik.errors.discount ? formik.errors.discount : ''}
+            />
+            <Input
+              name='order'
+              label='اولویت'
+              placeholder='عدد'
+              type='number'
+              value={formik.values.order}
+              onChange={(e) => formik.setFieldValue('order', Number(e.target.value))}
+              error_text={formik.touched.order && formik.errors.order ? formik.errors.order : ''}
+            />
+          </div>
+        ) : (
+          <div className='space-y-5'>
+            <Input
+              name='attribute'
+              label='نام ویژگی تنوع (مثلاً رنگ، سایز)'
+              placeholder='مثلاً رنگ، سایز'
+              value={formik.values.attribute}
+              onChange={formik.handleChange}
+              error_text={formik.touched.attribute && formik.errors.attribute ? formik.errors.attribute : ''}
+            />

-        <Input
-          name='dailyStock'
-          label='موجودی روزانه'
-          placeholder='عدد'
-          type='number'
-          seprator={true}
-          value={formik.values.dailyStock}
-          onChange={(e) => formik.setFieldValue('dailyStock', Number(e.target.value))}
-          error_text={formik.touched.dailyStock && formik.errors.dailyStock ? formik.errors.dailyStock : ''}
-        />
+            <div className='grid grid-cols-1 sm:grid-cols-2 gap-4'>
+              <Input
+                name='discount'
+                label='تخفیف (تومان)'
+                placeholder='۰'
+                type='number'
+                seprator={true}
+                value={formik.values.discount}
+                onChange={(e) => formik.setFieldValue('discount', Number(e.target.value))}
+                error_text={formik.touched.discount && formik.errors.discount ? formik.errors.discount : ''}
+              />
+              <Input
+                name='order'
+                label='اولویت'
+                placeholder='عدد'
+                type='number'
+                value={formik.values.order}
+                onChange={(e) => formik.setFieldValue('order', Number(e.target.value))}
+                error_text={formik.touched.order && formik.errors.order ? formik.errors.order : ''}
+              />
+            </div>
+
+            <div>
+              <label className='block text-sm font-medium text-gray-700 mb-2'>تنوع‌ها و قیمت هر کدام</label>
+              <div className='space-y-3'>
+                {formik.values.variants.map((v, index) => (
+                  <div
+                    key={index}
+                    className='flex flex-nowrap gap-3 items-center p-3 rounded-xl border border-gray-200 bg-white shadow-sm'
+                  >
+                    <Input
+                      placeholder='مقدار (مثلاً قرمز، M)'
+                      value={v.value}
+                      onChange={(e) => updateVariant(index, 'value', e.target.value)}
+                      className='flex-1 min-w-0'
+                    />
+                    <Input
+                      placeholder='قیمت'
+                      type='number'
+                      seprator={true}
+                      value={v.price}
+                      onChange={(e) => updateVariant(index, 'price', Number(e.target.value))}
+                      className='flex-1 min-w-0 shrink-0'
+                    />
+                    <div className='min-w-5'>
+                      <Trash
+                        onClick={() => removeVariant(index)}
+                        color='red' size={20} />
+
+                    </div>
+                  </div>
+                ))}
+              </div>
+              <Button
+                type='button'
+                className='mt-3 w-fit px-5 !bg-white border border-dashed border-gray-300 text-gray-600 hover:!bg-gray-100 hover:border-gray-400'
+                onClick={addVariant}
+              >
+                <Add color='gray' className='size-5 ml-2 inline' />
+                افزودن تنوع
+              </Button>
+            </div>
+          </div>
+        )}
      </div>

      <div className='mt-5'>
@@ -92,18 +216,6 @@ const BasicInfoSection: FC<BasicInfoSectionProps> = ({ formik, categories }) =>
          error_text={formik.touched.desc && formik.errors.desc ? formik.errors.desc : ''}
        />
      </div>
-
-      <div className='mt-5'>
-        <Input
-          name='order'
-          label='اولویت'
-          placeholder='عدد'
-          type='number'
-          value={formik.values.order}
-          onChange={(e) => formik.setFieldValue('order', Number(e.target.value))}
-          error_text={formik.touched.order && formik.errors.order ? formik.errors.order : ''}
-        />
-      </div>
    </>
  )
 }
@@ -1,7 +1,7 @@
 import { Eye } from 'iconsax-react'
 import type { ColumnType } from '@/components/types/TableTypes'
 import type { Product } from '../types/Types'
-import { formatPrice, formatTime } from '../utils/formatters'
+import { formatPrice } from '../utils/formatters'
 import Status from '@/components/Status'
 import { Link } from 'react-router-dom'
 import { Pages } from '@/config/Pages'
@@ -53,19 +53,14 @@ export const getProductTableColumns = ({ onDelete, isDeleting }: GetProductTable
                return formatPrice(item.price)
            }
        },
-        {
-            key: 'prepareTime',
-            title: 'زمان آماده سازی',
-            render: (item: Product) => {
-                return formatTime(item.prepareTime || 0)
-            }
-        },
        {
            key: 'inventory',
            title: 'موجودی',
            render: (item: Product) => {
-                const availableStock = item.inventory.availableStock
-                const totalStock = item.inventory.totalStock
+                const inv = item.inventory
+                if (!inv) return '-'
+                const availableStock = inv.availableStock
+                const totalStock = inv.totalStock
                return (
                    <div className='flex flex-col gap-1'>
                        <span className='text-sm'>
@@ -11,7 +11,7 @@ import type {
 import type { FilterValues } from "@/components/Filters";

 export const createProduct = async (params: CreateProductType) => {
-  const { data } = await axios.post(`/admin/foods`, params);
+  const { data } = await axios.post(`/admin/products`, params);
  return data;
 };

@@ -19,7 +19,7 @@ export const getProducts = async (
  params?: GetProductsParams,
  filters?: FilterValues,
 ): Promise<GetProductsResponseType> => {
-  const { data } = await axios.get<GetProductsResponseType>(`/admin/foods`, {
+  const { data } = await axios.get<GetProductsResponseType>(`/admin/products`, {
    params: {
      ...params,
      ...filters,
@@ -32,13 +32,13 @@ export const getProductDetails = async (
  id: string,
 ): Promise<GetProductDetailsResponseType> => {
  const { data } = await axios.get<GetProductDetailsResponseType>(
-    `/admin/foods/${id}`,
+    `/admin/products/${id}`,
  );
  return data;
 };

 export const updateProduct = async (id: string, params: CreateProductType) => {
-  const { data } = await axios.patch(`/admin/foods/${id}`, params);
+  const { data } = await axios.patch(`/admin/products/${id}`, params);
  return data;
 };

@@ -50,7 +50,7 @@ export const getCategories = async (): Promise<GetCategoriesResponseType> => {
 };

 export const deleteProduct = async (id: string) => {
-  const { data } = await axios.delete(`/admin/foods/${id}`);
+  const { data } = await axios.delete(`/admin/products/${id}`);
  return data;
 };

@@ -1,21 +1,22 @@
 import type { IResponse } from "@/types/response.types";

+export type ProductVariant = {
+  id?: string;
+  value: string;
+  price: number;
+};
+
 export type CreateProductType = {
  categoryId: string;
  title: string;
+  attribute: string;
+  variants: ProductVariant[];
  desc: string;
-  content: string[];
-  weekDays: number[];
-  mealTypes: string[];
  price: number;
-  prepareTime: number;
  isActive: boolean;
  images: string[];
-  inPlaceServe: boolean;
-  pickupServe: boolean;
  discount: number;
  isSpecialOffer: boolean;
-  dailyStock: number;
  order: number;
 };

@@ -61,20 +62,16 @@ export type Product = {
  deletedAt: string | null;
  restaurant: string;
  category: ProductDetailsCategory;
-  inventory: Inventory;
+  inventory?: Inventory;
  title: string;
  desc: string;
-  content: string[];
+  attribute?: string;
+  variants?: ProductVariant[];
  price: number;
  order: number | null;
-  prepareTime: number | null;
-  weekDays: number[];
-  mealTypes: string[];
  isActive: boolean;
  images: string[];
-  inPlaceServe: boolean;
-  pickupServe: boolean;
-  score: number;
+  score?: number;
  discount: number;
  isSpecialOffer: boolean;
 };
@@ -96,20 +93,16 @@ export type ProductDetails = {
  deletedAt: string | null;
  restaurant: string;
  category: ProductDetailsCategory;
-  inventory: Inventory;
+  inventory?: Inventory;
  title: string;
  desc: string;
-  content: string[];
+  attribute?: string;
+  variants?: ProductVariant[];
  price: number;
  order: number | null;
-  prepareTime: number;
-  weekDays: number[];
-  mealTypes: string[];
  isActive: boolean;
  images: string[];
-  inPlaceServe: boolean;
-  pickupServe: boolean;
-  score: number;
+  score?: number;
  discount: number;
  isSpecialOffer: boolean;
 };
@@ -122,7 +115,9 @@ export type PaginationMeta = {
 };

 export type GetCategoriesResponseType = IResponse<Category[]>;
-export type GetProductsResponseType = IResponse<Product[]> & { meta: PaginationMeta };
+export type GetProductsResponseType = IResponse<Product[]> & {
+  meta: PaginationMeta;
+};
 export type GetProductDetailsResponseType = IResponse<ProductDetails>;

 export type CreateCategoryType = {