Skip to content

Page List: Rename the Edit action to Detach and confirm it in a dialog - #80847

Merged
Mamaduka merged 2 commits into
trunkfrom
update/page-list-detach-action
Jul 30, 2026
Merged

Page List: Rename the Edit action to Detach and confirm it in a dialog#80847
Mamaduka merged 2 commits into
trunkfrom
update/page-list-detach-action

Conversation

@Mamaduka

Copy link
Copy Markdown
Member

What?

See discussion in #80613.
Related #80844.

Aligns the Page List block's convert-to-links action with the "Detach" convention used by the Gallery and ToC blocks.

  • Renames the action to "Detach" in both the block toolbar and the Settings panel.
  • Replaces the bespoke ConvertToLinksModal with a ConfirmDialog ("Detach Page List" / "Detach"), matching the Gallery's copy structure: what the block does now, what detaching enables, what stops working.
  • The inspector button no longer converts immediately. It opens the same dialog, so both entry points explain the change identically. Its description paragraph is gone, since the dialog now carries that copy.
  • Deletes convert-to-links-modal.js and its now-unused modal styles.

Why?

"Edit" didn't say what the action does. It permanently converts the list into individual navigation links and stops it from picking up new pages. "Detach" names the change, and the confirmation makes the trade-off explicit before it happens. Same wording and dialog shape as the Gallery block, so the pattern reads consistently.

Testing Instructions

  1. Add a Navigation block containing a Page List.
  2. Select the Page List. The toolbar shows "Detach" instead of "Edit". Click it and confirm the dialog explains the change; canceling leaves the block untouched.
  3. Confirm "Detach". The list converts to individual Page Link blocks.
  4. Repeat via the "Detach" button in the Settings panel.
  5. Clicking or dragging a page inside the list still prompts the same dialog.

Testing Instructions for Keyboard

Same.

Screenshots or screencast

CleanShot 2026-07-29 at 19 21 07

Use of AI Tools

Assisted by Claude.

@Mamaduka Mamaduka self-assigned this Jul 29, 2026
@Mamaduka Mamaduka added [Type] Enhancement A suggestion for improvement. [Block] Page List Affects the Page List Block labels Jul 29, 2026
@github-actions github-actions Bot added the [Package] Block library /packages/block-library label Jul 29, 2026
@jasmussen

Copy link
Copy Markdown
Contributor

I like this one too in principles of unification. I personally think it's a better term. But I do recall "Edit" being chosen specifically, so I'd prefer a broader gut-check on this one.

@github-actions

github-actions Bot commented Jul 29, 2026

Copy link
Copy Markdown

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 props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: ramonjd <ramonopoly@git.wordpress.org>
Co-authored-by: andrewserong <andrewserong@git.wordpress.org>
Co-authored-by: jasmussen <joen@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions

github-actions Bot commented Jul 29, 2026

Copy link
Copy Markdown

Size Change: -1.41 kB (-0.02%)

Total Size: 7.76 MB

πŸ“¦ View Changed
Filename Size Change
build/scripts/block-library/index.min.js 356 kB -78 B (-0.02%)
build/styles/block-library/editor-rtl.css 12.7 kB -7 B (-0.06%)
build/styles/block-library/editor-rtl.min.css 10.4 kB -11 B (-0.11%)
build/styles/block-library/editor.css 12.7 kB -7 B (-0.05%)
build/styles/block-library/editor.min.css 10.4 kB -10 B (-0.1%)
build/styles/block-library/page-list/editor-rtl.css 688 B -591 B (-46.21%) πŸŽ‰
build/styles/block-library/page-list/editor-rtl.min.css 297 B -59 B (-16.57%) πŸ‘
build/styles/block-library/page-list/editor.css 688 B -591 B (-46.21%) πŸŽ‰
build/styles/block-library/page-list/editor.min.css 297 B -59 B (-16.57%) πŸ‘

compressed-size-action

@Mamaduka

Copy link
Copy Markdown
Member Author

But I do recall "Edit" being chosen specifically, so I'd prefer a broader gut-check on this one.

We can easily swap button labels; the remaining changes are still worth shipping, IMO.

@ramonjd ramonjd left a comment

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looking good to me. Approving with some questions that can be dealt with here or in follow ups if required.

Undo works as expected, the page list converts to individual Page Link blocks πŸ‘πŸ»

Image

Clicking or dragging a page inside the list still prompts the same dialog.

This I couldn't quite get working, and I could be testing it wrong.

I tried dragging a new page link block into the page list (inside a nav block).

Tried list view / block inspector list view and the canvas. Tested against trunk and what I'm doing is the same behaviour so no biggie.

Clicking on a page link inside the page list triggers the modal though.

Comment thread packages/block-library/src/page-list/edit.js
Comment thread packages/block-library/src/page-list/edit.js
onClick={ () => setIsConfirmingDetach( true ) }
>
{ __( 'Edit' ) }
{ __( 'Detach' ) }

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Optional, non-blocking: Gallery has "Detach Gallery" for this button. Worth naming what gets detached here as well? E.g., "Detach Page List"

@andrewserong andrewserong Jul 30, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you probably meant this comment for the inspector controls button above rather than the toolbar button? In any case, yes I like the idea of "Detach Page List" here for the sidebar button, because of the placement of the button. It's next to the Parent control, so without the added block name in the label it might be ambiguous like the Detach button is for detaching the parent:

Image

Copy link
Copy Markdown
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh true! Thanks for calling that out. Proof I didn't rely on AI for this review - all dumb mistakes are my own. πŸ˜„

@andrewserong andrewserong left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is testing nicely for me, too, thanks again for these consistency PRs! No real notes from me other than what's already been mentioned πŸ™‚

onClick={ () => setIsConfirmingDetach( true ) }
>
{ __( 'Edit' ) }
{ __( 'Detach' ) }

@andrewserong andrewserong Jul 30, 2026

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you probably meant this comment for the inspector controls button above rather than the toolbar button? In any case, yes I like the idea of "Detach Page List" here for the sidebar button, because of the placement of the button. It's next to the Parent control, so without the added block name in the label it might be ambiguous like the Detach button is for detaching the parent:

Image

Comment thread packages/block-library/CHANGELOG.md Outdated

- Playlist: Shorten the track toolbar button label from "Add track" to "Add".
- Gallery: Rename the dynamic variation's "Convert to images" action to "Detach", and confirm it in a dialog explaining that the gallery will keep its current images but stop updating automatically ([#80727](https://github.com/WordPress/gutenberg/pull/80727)).
- Page List: Rename the "Edit" action to "Detach", and confirm it in a dialog explaining that the list will keep its current pages but stop adding new ones automatically, matching the Gallery block.

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tiny nit: should we add the PR number in here? (I often miss this as we don't have the PR number before pushing the branch πŸ˜„)

Copy link
Copy Markdown
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Chicken and egg situation :D

@andrewserong

Copy link
Copy Markdown
Contributor

Clicking or dragging a page inside the list still prompts the same dialog.
This I couldn't quite get working, and I could be testing it wrong.

I could get this work by selecting the Navigation block and then using the list view tab in the right hand sidebar. When I go to pick up pages within the non-detached version of the Page List, it shows the prompt for me:

2026-07-30.14.22.05.mp4

@andrewserong andrewserong left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just gave it a quick re-test and this is looking good to me!

But I do recall "Edit" being chosen specifically, so I'd prefer a broader gut-check on this one.

On this, I do slightly prefer "Detach" over "Edit" because "Edit" makes me think of switching modes, rather than actually changing how the block works, which we're now describing as "Detach". So my vote (though not a strongly held opinion) is to go with "Detach". It'd be easy to change back again if we think folks are finding it confusing.

LGTM πŸš€

@Mamaduka

Copy link
Copy Markdown
Member Author

I do slightly prefer "Detach" over "Edit" because "Edit" makes me think of switching modes, rather than actually changing how the block works, which we're now describing as "Detach".

Good point. Let's go with "Detach" at least for now. We can always change back later.

@Mamaduka
Mamaduka merged commit 96c381f into trunk Jul 30, 2026
45 of 46 checks passed
@Mamaduka
Mamaduka deleted the update/page-list-detach-action branch July 30, 2026 06:00
@github-actions github-actions Bot added this to the Gutenberg 23.8 milestone Jul 30, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

[Block] Page List Affects the Page List Block [Package] Block library /packages/block-library [Type] Enhancement A suggestion for improvement.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants