Route-backed create and edit workflows

Workflow UI

TL;DR
  • Create and edit flows were carrying the same state problems in different places.
  • I needed those workflows to keep URL, history, dirty state, and close behaviour consistent.
  • I moved mutation sheets behind routes and shared the common exit and refresh handling.
  • The result was a steadier editing pattern with less one-off modal code.

Create and edit flows often start small and then grow their own rules: dirty state, close timing, confirmation, refresh, and where the user returns afterward.

Where it started

Each modal-style workflow had a similar set of problems: unsaved changes, close timing, confirmation prompts, and stale list data after saving.

What needed to change

Mutation sheets turn those workflows into route-backed surfaces. They can open from context, keep browser history meaningful, and still protect work in progress.

What I built

The shared layer owns common behaviours: detecting unsaved changes, delaying route exits until the sheet animation finishes, confirming destructive exits, and refreshing relevant data after a mutation.

Each workflow can focus on its form and mutation logic instead of rebuilding the shell.

What changed

Users get a consistent editing experience, and developers get fewer one-off modal implementations.

What I would watch

Shared behaviour has to remain flexible. If the sheet abstraction owns too much, unusual workflows become hard to express.