Progress Bar

Design:

https://www.figma.com/file/RtD0UFtwuwXx14lbLCAPlr/branch/4JKHiBl13JOyOqh88dSPkV/Burger-King?type=design&node-id=20699%3A1728&mode=design&t=snkjlf1tdYTggafv-1

Backend:

tiered-delivery-fees

{
"0":{
"app":{
"discount":0,
"serviceFeeDiscount":0,
"fee":199,
"serviceFee":100
}
},
"10":{
"app":{
"discount":99,
"serviceFeeDiscount":50,
"fee":199,
"serviceFee":100
}
},
"20":{
"app":{
"discount":199,
"serviceFeeDiscount":100,
"fee":199,
"serviceFee":100
}
}
}

Frontend:

MAXIMUM_POTENTIAL_SAVING (E.g: 2.99) :

• HIGHER TIER (fee + serviceFee - discount - serviceFeediscount) - LOWER TIER (fee +serviceFee - discount - serviceFeeDiscount)

  • Pros: More flexible.

  • Cons: More calculations to handle different tiers / more efforts/ new fee interface changes

THRESHOLD( E.g: 20.00) → Possible solutions:

• 1-)Calculation based on FF discounted-delivery-threshold-cents

  • Pros: Existing approach / minimum efforts

  • Cons: Less flexible/ requires caution when configuring / changing config

• 2-) Dynamic Calculation based on the HIGHER tier ( service from fee table modal can be reused)

  • Pros : flexible (recommended)

  • Cons: Requires more effort to read the higher tier

AMOUNT_AWAY_FROM_MAXIMUM_SAVINGS (E.g.: 8.00 ) →

• Threshold - (requestedAmountCents OR (subTotalCents + taxCents))