hmm

app/dashboard/products/page.tsx

@@ -1,14 +1,18 @@
-"use client"
+"use client";
 
 import { useState, useEffect, ChangeEvent } from "react";
 import { useRouter } from "next/navigation";
 import Layout from "@/components/kokonutui/layout";
 import { Button } from "@/components/ui/button";
-import { Product } from "@/models/products"; 
+import { Product } from "@/models/products";
 import { Plus } from "lucide-react";
-import { fetchProductData, saveProductData, deleteProductData } from "@/lib/productData"; 
-import { ProductModal } from "@/components/product-modal"; 
-import ProductTable from "@/components/product-table"; 
+import {
+  fetchProductData,
+  saveProductData,
+  deleteProductData,
+} from "@/lib/productData";
+import { ProductModal } from "@/components/product-modal";
+import ProductTable from "@/components/product-table";
 
 export default function ProductsPage() {
   const router = useRouter();
@@ -17,7 +21,7 @@ export default function ProductsPage() {
   const [loading, setLoading] = useState<boolean>(true);
   const [modalOpen, setModalOpen] = useState<boolean>(false);
   const [editing, setEditing] = useState<boolean>(false);
-  const [imagePreview, setImagePreview] = useState<string | null>(null); 
+  const [imagePreview, setImagePreview] = useState<string | null>(null);
   const [productData, setProductData] = useState<Product>({
     name: "",
     description: "",
@@ -66,7 +70,8 @@ export default function ProductsPage() {
     index: number
   ) => {
     const updatedPricing = [...productData.tieredPricing];
-    updatedPricing[index][e.target.name] = e.target.value;
+    const name = e.target.name as "minQuantity" | "pricePerUnit";
+    updatedPricing[index][name] = e.target.valueAsNumber || 0;
     setProductData({ ...productData, tieredPricing: updatedPricing });
   };
 
@@ -74,30 +79,31 @@ export default function ProductsPage() {
   const handleSaveProduct = async (data: Product) => {
     const adjustedPricing = data.tieredPricing.map((tier) => ({
       minQuantity: tier.minQuantity,
-      pricePerUnit: typeof tier.pricePerUnit === "string"
-        ? parseFloat(tier.pricePerUnit) // Convert string to number
-        : tier.pricePerUnit,
+      pricePerUnit:
+        typeof tier.pricePerUnit === "string"
+          ? parseFloat(tier.pricePerUnit) // Convert string to number
+          : tier.pricePerUnit,
     }));
-  
+
     const productToSave = {
       ...data,
-      pricing: adjustedPricing, 
-      imageBase64: imagePreview || "", 
+      pricing: adjustedPricing,
+      imageBase64: imagePreview || "",
     };
-  
+
     try {
       const authToken = document.cookie.split("Authorization=")[1];
       const apiUrl = editing
         ? `${process.env.NEXT_PUBLIC_API_URL}/products/${data._id}`
         : `${process.env.NEXT_PUBLIC_API_URL}/products`;
-  
+
       const savedProduct = await saveProductData(
         apiUrl,
         productToSave,
         authToken,
         editing ? "PUT" : "POST"
       );
-  
+
       setProducts((prevProducts) => {
         if (editing) {
           return prevProducts.map((product) =>
@@ -107,7 +113,7 @@ export default function ProductsPage() {
           return [...prevProducts, savedProduct];
         }
       });
-  
+
       setModalOpen(false); // Close modal after saving
     } catch (error) {
       console.error("Error saving product:", error);
@@ -122,7 +128,7 @@ export default function ProductsPage() {
         `${process.env.NEXT_PUBLIC_API_URL}/products/${productId}`,
         authToken
       );
-      
+
       // Remove the product from the state
       setProducts((prevProducts) =>
         prevProducts.filter((product) => product._id !== productId)
@@ -136,9 +142,9 @@ export default function ProductsPage() {
   const handleEditProduct = (product: Product) => {
     setProductData({
       ...product,
-      tieredPricing: product.pricing.map((tier) => ({
+      tieredPricing: product.tieredPricing.map(tier => ({
         minQuantity: tier.minQuantity,
-        pricePerUnit: tier.pricePerUnit.toString(), 
+        pricePerUnit: tier.pricePerUnit
       })),
     });
     setEditing(true);
@@ -178,12 +184,12 @@ export default function ProductsPage() {
           </Button>
         </div>
 
-        <ProductTable 
+        <ProductTable
           products={products}
           loading={loading}
           onEdit={handleEditProduct}
           onDelete={handleDeleteProduct} // Pass handleDeleteProduct
-          getCategoryNameById={getCategoryNameById} 
+          getCategoryNameById={getCategoryNameById}
         />
 
         <ProductModal