← Back to demos

Toggle with Confirmation

Even a "simple" toggle can have hidden complexity when you add confirmation dialogs.

State Machine
off
4 explicit states, clear transitions
Feature Toggle
states: off, confirmingOn, on, confirmingOff
current: off
Boolean Flags
isOn: false
Multiple booleans to track
Feature Toggle
isOn: false
showConfirm: false
pendingAction: null

State Machine Benefits:

  • • All 4 states are explicit and named
  • • Impossible to be "confirming" without a pending action
  • • State diagram can be visualized
  • • Easy to add new states (e.g., "saving")

Boolean Complexity:

  • • 3 variables = 8 possible combinations
  • • Only 4 are valid (same as machine states)
  • • Easy to forget resetting pendingAction
  • • Harder to reason about as complexity grows