Replace turbo confirmation dialogs with custom delete modals#1948
Replace turbo confirmation dialogs with custom delete modals#1948jorgemanrubia merged 4 commits intobasecamp:mainfrom
Conversation
Replaces the standard turbo_confirm attribute with a custom dialog modal for a better user experience. - Removes `button_to_delete_card` helper in favor of inline markup. - Implements `keydown.esc->dialog#close:stop` to prevent the Escape key from inadvertently closing selected card.
Applies the custom dialog modal pattern to the board deletion workflow, matching the card deletion updates.
jstarner
changed the title
jstarner
changed the title
jorgemanrubia
left a comment
jorgemanrubia
left a comment
There was a problem hiding this comment.
Nice, thanks @jstarner. I like this change! Will ask for some designers here too
|
Lovely work, @jstarner! I'd suggest centering the buttons, but this looks great otherwise. Thanks for taking initiative. |
andyra
left a comment
andyra
left a comment
There was a problem hiding this comment.
I'd suggest centering the buttons via .justify-center
Thank you @andyra and appreciate the feedback! Love the work y'all are doing and happy to be able to contribute. I've updated the buttons to be centered and included updated screenshots 🙌 |
jorgemanrubia
left a comment
jorgemanrubia
left a comment
There was a problem hiding this comment.
Thank you so much @jstarner
|
You might consider using https://turbo.hotwired.dev/reference/drive#turbo.config.forms.confirm so that you have the same pattern for the other Not sure if those have different UI needs, but if not, you could avoid a custom modal for each form. |
|
@jstarner , that's awesome! Any chance to make the change in other places? Like deleting the comment? 😁 
|
5 participants
Description
This PR improves the deletion UX for cards and boards by replacing the browser-native
turbo_confirmdialogs with custom, styled modals.Changes
app/views/cards/_delete.html.erbto implement custom delete confirmation modal.app/views/boards/edit/_delete.html.erbto use the same accessible modal pattern.button_to_delete_cardhelper method fromapp/helpers/cards_helper.rb.Before
After
