Beautiful Rails confirmation dialogs (with zero JavaScript)
Upgrading the default `data-turbo-confirm` with a beautiful, native HTML dialog with animations
Last week on the timeline, I saw two things come across my feed:
A pull request in Fizzy to upgrade the out-of-the-box Rails `data-turbo-confirm` with a custom modal
Tweets from my friend Stephen Margheim about HTML native ways of closing a dialog, dismissing on ESC, and animating dialogs with only CSS
The Fizzy PR was merged, but I didn’t love the implementation for two reasons:
It’s annoying to have to use a Stimulus dialog controller (that every project copy-pastes, LLM-generates, or reinvents on their own) for what should be native browser behavior
It wasn’t using the built-in hooks in Turbo to customize the confirmation behavior (so it would not become the default in your project)
So Stephen and I put together an article covering how to resolve both of those issues: we built an HTML native dialog (no Stimulus controller, zero JS) that gets hooked into Turbo to automatically change the behavior of `data-turbo-confirm` to not look like something from 1999.
👉 Read it here: Beautiful Rails confirmation dialogs (with zero JavaScript)
📣 Thoughts? Join the discussion on Twitter
Stay boring!
- Matt