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.
