Patterns: add confirmation dialog before disconnecting/detaching#75713
Patterns: add confirmation dialog before disconnecting/detaching#75713
Conversation
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
|
Size Change: +373 B (0%) Total Size: 8.75 MB
ℹ️ View Unchanged
|
|
I'll deal with those E2Es later 😄 |
2c83ad2 to
1ead1b4
Compare
There was a problem hiding this comment.
Pull request overview
This PR renames the "Disconnect pattern" menu item to "Detach pattern" and adds a confirmation dialog before performing the detach action. The change addresses feedback from PR #73105, where "Disconnect pattern" was found to be suboptimal because it applied to both synced and unsynced patterns. "Detach" is a more appropriate verb that works for both pattern types: synced patterns are detached from their live source, and unsynced patterns have their pattern identity and editing restrictions removed. The confirmation dialog provides user education by explaining the consequences of detaching before the action occurs.
Changes:
- Renamed menu item from "Disconnect pattern" to "Detach pattern" in both patterns and reusable-blocks packages
- Added confirmation dialogs with context-aware messaging for synced vs unsynced patterns
- Updated all E2E tests to handle the new confirmation dialog interaction
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| test/e2e/specs/editor/various/patterns.spec.js | Updated three test cases to click the confirmation dialog's "Detach" button after triggering detach; added page parameter where needed |
| test/e2e/specs/editor/various/pattern-overrides.spec.js | Updated two test cases for dialog interaction; fixed import order to follow convention (External dependencies before WordPress dependencies) |
| packages/reusable-blocks/src/components/reusable-blocks-menu-items/reusable-blocks-manage-button.js | Added confirmation dialog for synced patterns with appropriate messaging |
| packages/patterns/src/components/patterns-manage-button.js | Added confirmation dialog with context-aware messages for both synced and unsynced patterns |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
🤔 they all pass locally for me so far Edit: they're all failing currently on trunk too 😓 |
I wonder if it should be considered a bug because of this being a mistake? That way it can be included in 7.0. (thanks for addressing this btw!) |
|
👍 👍 from my angle, I like the "detach" vernacular. |
5b262e6 to
83c3a57
Compare
aaronrobertshaw
left a comment
There was a problem hiding this comment.
The rename to "Detach" is a nice improvement and the context-aware copy is well thought out 👍
I'm not 100% sold on the confirmation dialog as an education tool. I think users tend to learn to click through them blindly pretty quickly. But I don't hold that opinion strongly, and I can see the argument for it.
LGTM 🚢
|
Assuming no changes, is this something that could support the pattern editing feature in 7.0? I'm looking at the claim that it reduces ambiguity in UI, creating distinction between "Edit pattern" (temporarily revealing pattern structure) and the detached forever operation 🤔 |
I think it could reasonably go in. The rename itself is low-risk (just string changes + a confirmation dialog), and the increased clarity between "Edit" and "Detach" does meaningfully improve the pattern editing UX that's shipping in 7.0. Whether you frame it as a bug fix (the unintentional application to unsynced patterns) or a UX polish for the new pattern editing flow, either way it seems like a net positive for the release. Just my two cents though |
|
I think the added modal makes it more of an enhancement, and you might need a thumbs up from release/project leads to include it. I'd personally be ok with it (not a lead though), but I'd like more eyes on the copy. I personally don't like the term 'editing restrictions', maybe something like 'the blocks will no longer be associated with this pattern and will be fully editable'. If the change were only renaming disconnect to detach for unsynced patterns then I think it could be considered a bug, as #73105 was only intended to change the copy for synced patterns. |
|
Thanks, folks!
Good point. I can split this PR into verb revert and modal, the latter can be copy-tested and so on. |
Split out here: |
441ebf0 to
b07c245
Compare
|
Flaky tests detected in 5db2944. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/23124114446
|
b07c245 to
b33a588
Compare
b33a588 to
7909907
Compare
…dialog Add a confirmation dialog when detaching a pattern, with context-aware copy that explains the consequences differently for synced vs unsynced patterns. This educates users about what detaching means at the moment they need it most. - Synced: explains that blocks will be separated from the original pattern and future changes won't apply - Unsynced: explains that blocks will no longer be associated with the pattern and editing restrictions will be removed Updates E2E tests to account for the new confirmation step.
Refactor the confirmation dialog for detaching patterns to use "Disconnect pattern" instead of "Detach pattern" for clarity. Adjusted the dialog messages to better reflect the consequences for both synced and unsynced patterns, ensuring users understand the implications of their actions. Updated E2E tests to align with these changes.
Add a confirmation dialog when users choose to disconnect a pattern, enhancing user experience by providing clear context about the action's implications. Update the button text from "Detach pattern" to "Disconnect pattern" for consistency. Adjust E2E tests to reflect these changes.
7909907 to
5db2944
Compare
Summary
Tip
This PR builds on #75807 by adding the confirmation dialog. #75807 renames the "Disconnect pattern" menu item to "Detach pattern" for unsynced patterns for the purposes of getting the change into the next WP 7 RC.
This PR:
Why
The confirmation dialog serves as user education at the right moment: it explains the consequences of detaching before the action happens, teaching users the distinction between "Edit pattern" (temporary, reversible) and "Detach pattern" (permanent).
Test plan
For a synced pattern:
For an unsynced pattern:
Kapture.2026-02-23.at.15.06.46.mp4