From 051d33df332242d15c3f8703880dfa14b333411f Mon Sep 17 00:00:00 2001
From: NotII <46204250+NotII@users.noreply.github.com>
Date: Thu, 9 Oct 2025 20:49:25 +0100
Subject: [PATCH] Improve pricing tier validation logic

Validation now only checks for duplicate quantities when both minQuantity and pricePerUnit are set and positive. Error messages and input styling are updated to reflect more accurate validation states, and the placeholder for minQuantity is changed to 'e.g. 29'.
---
 components/forms/pricing-tiers.tsx | 32 +++++++++++++++++-------------
 1 file changed, 18 insertions(+), 14 deletions(-)

diff --git a/components/forms/pricing-tiers.tsx b/components/forms/pricing-tiers.tsx
index 2f246d4..407e93a 100644
--- a/components/forms/pricing-tiers.tsx
+++ b/components/forms/pricing-tiers.tsx
@@ -37,23 +37,27 @@ export const PricingTiers = ({
   const validateTier = (tier: any, index: number) => {
     const errors = [];
     
-    if (tier.minQuantity <= 0) {
+    // Only validate if both fields have values
+    if (tier.minQuantity > 0 && tier.pricePerUnit > 0) {
+      // Check for duplicate quantities only if both fields are complete
+      const duplicateIndex = pricing.findIndex((p, i) => 
+        i !== index && p.minQuantity === tier.minQuantity && p.minQuantity > 0
+      );
+      
+      if (duplicateIndex !== -1) {
+        errors.push("Duplicate quantity found");
+      }
+    }
+    
+    // Only show validation errors for completed fields
+    if (tier.minQuantity !== 0 && tier.minQuantity <= 0) {
       errors.push("Quantity must be greater than 0");
     }
     
-    if (tier.pricePerUnit <= 0) {
+    if (tier.pricePerUnit !== 0 && tier.pricePerUnit <= 0) {
       errors.push("Price must be greater than 0");
     }
     
-    // Check for duplicate quantities
-    const duplicateIndex = pricing.findIndex((p, i) => 
-      i !== index && p.minQuantity === tier.minQuantity
-    );
-    
-    if (duplicateIndex !== -1) {
-      errors.push("Duplicate quantity found");
-    }
-    
     return errors;
   };
 
@@ -108,10 +112,10 @@ export const PricingTiers = ({
                       type="number"
                       min="1"
                       step="1"
-                      placeholder="e.g. 10"
+                      placeholder="e.g. 29"
                       value={tier.minQuantity === 0 ? "" : tier.minQuantity}
                       onChange={(e) => handleTierChange(e, originalIndex)}
-                      className={`h-10 ${errors.some(e => e.includes('Quantity')) ? 'border-red-500' : ''}`}
+                      className={`h-10 ${errors.some(e => e.includes('Quantity') || e.includes('Duplicate')) ? 'border-red-500' : ''}`}
                     />
                     {errors.some(e => e.includes('Quantity')) && (
                       <p className="text-xs text-red-600">{errors.find(e => e.includes('Quantity'))}</p>
@@ -151,7 +155,7 @@ export const PricingTiers = ({
                   </div>
                 </div>
 
-                {errors.some(e => e.includes('Duplicate')) && (
+                {errors.some(e => e.includes('Duplicate')) && tier.minQuantity > 0 && tier.pricePerUnit > 0 && (
                   <p className="text-xs text-red-600 mt-2">
                     ⚠️ This quantity is already used in another tier
                   </p>