Strikethrough

In price cart, we show the breakdown of fees below the subtotals.

...

Promotion

Use-case: Delivery fee or/and Service fee are FREE for all ranges due to a promotion.

In such case, the fee table modal needs one specific configuration to show the proper value in the strikethrough

{
"0":{
"app":{
"discount":400,
"serviceFeeDiscount":300,
"fee":400,
"serviceFee":300
} → fee (400) - discount (400) = 0, so I go to lowest tier and read how the fee was supposed to be (400)
},
"10":{
"app":{
"discount":300,
"serviceFeeDiscount":200,
"fee":300,
"serviceFee":200
} → fee (300) - discount (300) = 0, so I go to lowest tier and read how the fee was supposed to be (400)
},
"20":{
"app":{
"discount":200,
"serviceFeeDiscount":100,
"fee":200,
"serviceFee":100
}→ fee (200) - discount (200) = 0, so I go to lowest tier and read how the fee was supposed to be (400)
}
}

• The logic of the strikethough is always based on the LOWEST tier as reference.

• The same logic is used for serviceFee and serviceFeeDiscount

non-Promotion

Use-case: Delivery fee or/and Service fee are FREE in the middle/last ranges

{
"0":{
"app":{
"discount":0,
"serviceFeeDiscount":0,
"fee":400,
"serviceFee":300
} → fee (400) - discount (0) = 400, so I don’t show FREE and strikethrough
},
"10":{
"app":{
"discount":0,
"serviceFeeDiscount":0,
"fee":300,
"serviceFee":200
} → fee (300) - discount (0) = 300, so I don’t show FREE and strikethrough
},
"20":{
"app":{
"discount":200,
"serviceFeeDiscount":100,
"fee":200,
"serviceFee":100
}→ fee (200) - discount (200) = 0, so I go to lowest tier and read how the fee was supposed to be (400)
}
}

When it doesn’t have promotion (discount and serviceDiscount), we check if the fee for the cart current tier results in zero. If yes, it means that it’s FREE. So we show in the strikethrough the value of the fee from the LOWEST tier.