Lists and formsPath 13/21
ListsState & eventsDerived state
Prerequisites are suggestions only. Every challenge stays open.
Repair a Drifting Order Summary
This feature has already been implemented, but a customer reported that changing seat quantities leaves the monthly subtotal at $48.00.
Your job is to reproduce the defect, find its root cause, and make the smallest durable repair.
Requirements
- Keep the existing seat controls and their minimum value of one.
- Make the subtotal reflect the latest
items on every render.
- Treat
items as the single source of truth.
- Do not add an effect to synchronize one state value with another.
- Do not mutate the items array or its objects.
- Preserve the existing accessible labels and subtotal announcement.
What to explain during an interview
- Why did the subtotal drift away from the displayed seat counts?
- Why is calculating the subtotal during render preferable to synchronizing another state variable?
- When would storing a calculated value in state be justified?
Progressive hints
- Identify which displayed values can change and which state controls each one.
- Ask whether
subtotal represents independent user input or a calculation from existing state.
reduce can calculate the total of price * seats for the current items.