g/ember-market-frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Improve pricing tier validation logic

Browse Source 
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'.
This commit is contained in:
NotII
2025-10-09 20:49:25 +01:00
parent a912967fd4
commit 051d33df33
1 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
components/forms/pricing-tiers.tsx
View File

@@ -37,22 +37,26 @@ export const PricingTiers = ({
const validateTier = (tier: any, index: number) => { const validateTier = (tier: any, index: number) => {
const errors = []; const errors = [];
if (tier.minQuantity <= 0) { // Only validate if both fields have values
errors.push("Quantity must be greater than 0"); if (tier.minQuantity > 0 && tier.pricePerUnit > 0) {
} // Check for duplicate quantities only if both fields are complete
if (tier.pricePerUnit <= 0) {
errors.push("Price must be greater than 0");
}
// Check for duplicate quantities
const duplicateIndex = pricing.findIndex((p, i) => const duplicateIndex = pricing.findIndex((p, i) =>
i !== index && p.minQuantity === tier.minQuantity i !== index && p.minQuantity === tier.minQuantity && p.minQuantity > 0
); );
if (duplicateIndex !== -1) { if (duplicateIndex !== -1) {
errors.push("Duplicate quantity found"); 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 && tier.pricePerUnit <= 0) {
errors.push("Price must be greater than 0");
}
return errors; return errors;
}; };
@@ -108,10 +112,10 @@ export const PricingTiers = ({
type="number" type="number"
min="1" min="1"
step="1" step="1"
placeholder="e.g. 10" placeholder="e.g. 29"
value={tier.minQuantity === 0 ? "" : tier.minQuantity} value={tier.minQuantity === 0 ? "" : tier.minQuantity}
onChange={(e) => handleTierChange(e, originalIndex)} 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')) && ( {errors.some(e => e.includes('Quantity')) && (
<p className="text-xs text-red-600">{errors.find(e => e.includes('Quantity'))}</p> <p className="text-xs text-red-600">{errors.find(e => e.includes('Quantity'))}</p>
@@ -151,7 +155,7 @@ export const PricingTiers = ({
</div> </div>
</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"> <p className="text-xs text-red-600 mt-2">
⚠️ This quantity is already used in another tier ⚠️ This quantity is already used in another tier
</p> </p>