Untitled

import { FieldValues, useForm } from 'react-hook-form';
//@ts-ignore
import ProductInfoForm from '@/features/Products/addProductFields/ProductInfoForm';
import toast from 'react-hot-toast';
//@ts-ignore
import ProductImagesForm from '@/features/Products/addProductFields/ProductImagesForm';
//@ts-ignore
import ProductPriceForm from '@/features/Products/addProductFields/ProductPriceForm';

function AddProductForm({ clickedButton, addProduct }) {
  const form = useForm();

  // Add product form submition
  function onSubmit(values: FieldValues) {
    if (!values.category.length) {
      form.setError('category', { message: 'select a category' });
      toast.error('select a category');
      return;
    }
    if (!values.images.length) {
      toast.error('please upload 1 image at least');
      return;
    }
    if (clickedButton === 'add-product') {
      addProduct({ product: values, isPublished: 'false' });
    }
    if (clickedButton === 'add-and-publish') {
      addProduct({ product: values, isPublished: 'true' });
    }
  }
  return (
    <form id='add-product' onSubmit={form.handleSubmit(onSubmit)}>
      <div className='grid grid-cols-[2fr_1fr] gap-5'>
        <ProductInfoForm register={form.register} errors={form.formState.errors} form={form} />
        <div className='flex flex-col gap-5'>
          <ProductImagesForm register={form.register} form={form} />
          <ProductPriceForm register={form.register} errors={form.formState.errors} form={form} />
        </div>
      </div>
    </form>
  );
}

export default AddProductForm;