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

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

@@ -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>