diff --git a/components/forms/pricing-tiers.tsx b/components/forms/pricing-tiers.tsx
index 57c1d38..68df3f0 100644
--- a/components/forms/pricing-tiers.tsx
+++ b/components/forms/pricing-tiers.tsx
@@ -63,9 +63,16 @@ export const PricingTiers = ({
             <div className="w-8" />
           </div>
 
-          {pricing.map((tier, index) => (
+          {[...pricing]
+            .sort((a, b) => a.minQuantity - b.minQuantity)
+            .map((tier, sortedIndex) => {
+              // Find the original index for proper event handling
+              const originalIndex = pricing.findIndex(p => 
+                p === tier || (p.minQuantity === tier.minQuantity && p.pricePerUnit === tier.pricePerUnit)
+              );
+              return (
             <div
-              key={tier._id || index}
+              key={tier._id || originalIndex}
               className="grid grid-cols-[1fr_1fr_1fr_auto] gap-2 mt-2"
             >
               <Input
@@ -73,7 +80,7 @@ export const PricingTiers = ({
                 type="number"
                 placeholder="Min Quantity"
                 value={tier.minQuantity === 0 ? "" : tier.minQuantity}
-                onChange={(e) => handleTierChange(e, index)}
+                onChange={(e) => handleTierChange(e, originalIndex)}
                 className="h-8 text-sm px-2"
               />
 
@@ -82,7 +89,7 @@ export const PricingTiers = ({
                 type="number"
                 placeholder="Price per unit"
                 value={tier.pricePerUnit === 0 ? "" : formatNumber(tier.pricePerUnit)}
-                onChange={(e) => handleTierChange(e, index)}
+                onChange={(e) => handleTierChange(e, originalIndex)}
                 className="h-8 text-sm px-2"
               />
 
@@ -94,7 +101,7 @@ export const PricingTiers = ({
                     ? calculateTotal(tier.minQuantity, tier.pricePerUnit)
                     : ""
                 }
-                onChange={(e) => handleTotalChange(e, index, tier.minQuantity)}
+                onChange={(e) => handleTotalChange(e, originalIndex, tier.minQuantity)}
                 className="h-8 text-sm px-2"
               />
 
@@ -102,12 +109,13 @@ export const PricingTiers = ({
                 variant="ghost"
                 size="icon"
                 className="text-red-500 hover:bg-red-100"
-                onClick={() => handleRemoveTier(index)}
+                onClick={() => handleRemoveTier(originalIndex)}
               >
                 <Trash className="h-5 w-5" />
               </Button>
             </div>
-          ))}
+            );
+          })}
         </>
       ) : (
         <p className="text-sm text-gray-500 mt-2">No pricing tiers added.</p>