import { Head, Link, useForm } from '@inertiajs/react'; import { ArrowLeft, Loader2 } from 'lucide-react'; import { z } from 'zod'; import { Button } from '@/components/ui/button'; import { Input } from '@/components/ui/input'; import { Label } from '@/components/ui/label'; import { validateForm } from '@/lib/validation'; const productSchema = z.object({ name: z.string().min(1, 'Product name is required'), description: z.string().optional(), category_id: z.string().min(1, 'Category is required'), brand_id: z.string().min(1, 'Brand is required'), vendor_id: z.string().min(1, 'Supplier vendor is required'), vendor_price: z.number().min(0, 'Vendor price must be 0 or greater'), default_sell_price: z .number() .min(0, 'Default selling price must be 0 or greater'), status: z.enum(['active', 'inactive']), }); export default function Edit({ product, categories, brands, vendors }: any) { const p = product.data; const categoryList = Array.isArray(categories) ? categories : categories?.data || []; const brandList = Array.isArray(brands) ? brands : brands?.data || []; const vendorList = Array.isArray(vendors) ? vendors : vendors?.data || []; const { data, setData, put, processing, errors, setError, clearErrors } = useForm({ name: p.name, description: p.description || '', category_id: p.category_id || '', brand_id: p.brand_id || '', vendor_id: p.vendor_id || '', vendor_price: p.vendor_price || 0, default_sell_price: p.default_sell_price || 0, status: p.status || 'active', }); const handleSubmit = (e: React.FormEvent) => { e.preventDefault(); if (validateForm(data, productSchema, setError, clearErrors)) { put(`/products/${p.id}`); } }; return ( <>
{/* Header */}

Edit Product

Modify core specifications, statuses, and pricing indices.

{/* Form Card */}
{/* Name */}
setData('name', e.target.value) } placeholder="E.g. Wireless Noise-Cancelling Headphones" className="rounded-xl" /> {errors.name && ( {errors.name} )}
{/* Description */}