Edit Post: Refactor and cleanup InitPatternModal component by Mamaduka · Pull Request #79190 · WordPress/gutenberg

Mamaduka · 2026-06-15T13:04:10Z

What?

PR makes the following changes in the InitPatternModal component:

Use the recommended Stack component.
Simplify the early return condition. Call isCleanNewPost selector directly from the state lazy-init function.
Inline the z-index value. See similar DataViews: Inline z-index values #78315.

P.S. The code is easier to review with whitespace hidden - https://github.com/WordPress/gutenberg/pull/79190/changes?w=1.

Testing Instructions

Navigate to https://example.test/wp-admin/edit.php?post_type=wp_block.
Open the existing pattern, confirm that the "Create pattern" modal isn't rendered.
Try adding a new pattern, and confirm that the "Create pattern" modal is rendered.

Testing Instructions for Keyboard

Same.

Use of AI Tools

None.

github-actions · 2026-06-15T13:12:23Z

Size Change: +298 B (0%)

Total Size: 8.58 MB

📦 View Changed

Filename	Size	Change
`build/scripts/edit-post/index.min.js`	52.9 kB	+298 B (+0.57%)

_{compressed-size-action}

Mamaduka · 2026-06-15T13:14:06Z

-	"packages/editor/src/components/revision-created-panel/index.js": {
-		"@wordpress/use-recommended-components": {
-			"count": 1
-		}
-	},


Looks like leftovers.

github-actions · 2026-06-15T13:14:20Z

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 <[email protected]>
Co-authored-by: ciampo <[email protected]>
Co-authored-by: mirka <[email protected]>
Co-authored-by: jasmussen <[email protected]>

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

github-actions · 2026-06-15T14:38:18Z

Flaky tests detected in 5353e8e.
Some tests passed with failed attempts. The failures may not be related to this commit but are still reported for visibility. See the documentation for more information.

🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/27594720006
📝 Reported issues:

[Flaky Test] shouldn't conflict with server-side autosave #78706 in /test/e2e/specs/editor/various/autosave.spec.js

ciampo · 2026-06-15T15:43:03Z


 	// Should be above the popover (dropdown)
 	".reusable-blocks-menu-items__convert-modal": 1000001,
-	".patterns-menu-items__convert-modal": 1000001,


We may want to keep the z-index value in this file for the time being.

The reason is that this value is not just a "local" z-index, but it relates to the WordPress/Gutenberg app stacking order

Interesting, do any old PRs include comparisons, and when is it a good idea to inline? I can revert this change and reuse the same value for both modals.

Restored this value, and after some testing, I realized InitPatternModal doesn't need z-index. It's triggered for fresh posts, which won't have dropdowns open, and it even stacks properly with the welcome guide.

I've kept the overlay class for now.

Screenshot

Interesting, do any old PRs include comparisons, and when is it a good idea to inline?

A heuristic is whether the value is small, especially single-digit. That usually signals that the value is only meaningful in a local stacking context, and has no reason to be coordinated in a global file. If feasible, we inline the local z-index, and ideally add an isolation: isolate to create or mark the local stacking context so the internal z-index values don't affect anything else outside of it.

The ultimate goal is to remove the need for globally coordinated values as well, but for now we still need them.

Of course, if a z-index value doesn't seem to be needed anymore, it may be outdated and can be removed though!

Thanks for the explanation, @mirka!

ciampo · 2026-06-15T15:48:32Z

+					} );
+				} }
+			>
+				<Stack direction="column" gap="lg">


The previous Stack used a 20px gap (5 * 4px), while the new one currently specifies a 16px.

The new Stack component, in fact, does not offer a 20px option: --wpds-dimension-gap-lg currently maps to 16px, and --wpds-dimension-gap-xl to 24px.

The lack of a 20px option is deliberate (see convo), and therefore I believe that switching to 16px is the correct option. But cc @jasmussen and @fcoveram in case they believe 24px works better, here.

The lg seems to be a common gap for similar small forms. We should also ensure that CreatePatternModalContents uses the same gap when it's refactored.

ciampo · 2026-06-15T15:52:42Z

-	const [ isModalOpen, setIsModalOpen ] = useState( () => isNewPost );
-
-	if ( ! isNewPost ) {
+	if ( ! isModalOpen ) {


The new logic here makes sense because the post, in theory, can't transition to non-clean while the modal is open 👍

Maybe worth a comment to why this simple check is fine ?

IMO, it should be clear why a simple check is fine, a common modal pattern and reading store values in a similar manner isn't new.

I don't count this as a clever hack, otherwise we will have to annotate the whole codebase 😅

jasmussen · 2026-06-16T07:01:58Z

Thanks for the ping. I see this:

That's the main beat to review, yes? The other steps test well for me. IMO 16px gap looks fine there.

Mamaduka · 2026-06-16T07:09:02Z

@jasmussen, the remaining question was whether we should go with a 16px or a 24px gap.

jasmussen · 2026-06-16T07:13:05Z

Oh, the gap is currently 20?

My instinct would veer towards 16, as I recall that as being the generally most common gap. But it could be a little tight. Here's some older guidance:

I say older because it very literally is in the deprecated design library. So I think we need to look at what's the padding used for adjacent componentry, such as "lock design", make the choice we think looks best, and move forward. So 16 if that doesn't look too tight, otherwise 24.

Mamaduka · 2026-06-16T07:17:22Z

Yes, the gap on trunk is 20px, but I think that was mostly up to implementors since we didn't have more standardized variations. Format Library popover forms and a couple of others are using a 16px gap as well.

ciampo · 2026-06-16T14:36:56Z

~~Modal in @wordpress/components and Dialog in @wordpress/ui both use 24px, so I guess we should do the same here?~~

Nevermind, I got confused. We're not talking about padding, but vertical spacing. 16px feels like a good start.

Mamaduka · 2026-06-16T14:53:15Z

If there are no more blockers, can I get a green check on this.

ciampo

LGTM 🚀

Mamaduka · 2026-06-16T15:53:37Z

Thanks for the feedback, everyone!

fcoveram · 2026-06-17T10:09:32Z

Great work ❤️

Mamaduka added 2 commits June 15, 2026 16:50

Use recommended Stack component

2ad8b82

Simplify early return logic

a32b404

Mamaduka self-assigned this Jun 15, 2026

Mamaduka requested a review from manzoorwanijk as a code owner June 15, 2026 13:04

Mamaduka added [Type] Code Quality Issues or PRs that relate to code quality [Package] Edit Post /packages/edit-post labels Jun 15, 2026

Mamaduka requested review from ciampo and mirka June 15, 2026 13:04

github-actions Bot added [Package] Base styles /packages/base-styles [Package] Patterns /packages/patterns labels Jun 15, 2026

Mamaduka mentioned this pull request Jun 15, 2026

Make @wordpress/reusable-blocks a no-op compatibility package #79186

Open

Mamaduka commented Jun 15, 2026

View reviewed changes

Inline z-index

6884531

Mamaduka force-pushed the update/edit-post-init-pattern-modal branch from 5f534f6 to 6884531 Compare June 15, 2026 14:04

ciampo reviewed Jun 15, 2026

View reviewed changes

Feedback

5353e8e

github-actions Bot removed [Package] Base styles /packages/base-styles [Package] Patterns /packages/patterns labels Jun 16, 2026

ciampo approved these changes Jun 16, 2026

View reviewed changes

Mamaduka merged commit d356a69 into trunk Jun 16, 2026
45 of 49 checks passed

Mamaduka deleted the update/edit-post-init-pattern-modal branch June 16, 2026 15:53

github-actions Bot added this to the Gutenberg 23.5 milestone Jun 16, 2026

Uh oh!

Conversation

Mamaduka commented Jun 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

What?

Testing Instructions

Testing Instructions for Keyboard

Use of AI Tools

Uh oh!

github-actions Bot commented Jun 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Jun 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

github-actions Bot commented Jun 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Screenshot

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

jasmussen commented Jun 16, 2026

Uh oh!

Mamaduka commented Jun 16, 2026

Uh oh!

jasmussen commented Jun 16, 2026

Uh oh!

Mamaduka commented Jun 16, 2026

Uh oh!

ciampo commented Jun 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Mamaduka commented Jun 16, 2026

Uh oh!

ciampo left a comment

Choose a reason for hiding this comment

Uh oh!

Mamaduka commented Jun 16, 2026

Uh oh!

Uh oh!

fcoveram commented Jun 17, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

Mamaduka commented Jun 15, 2026 •

edited

Loading

github-actions Bot commented Jun 15, 2026 •

edited

Loading

github-actions Bot commented Jun 15, 2026 •

edited

Loading

github-actions Bot commented Jun 15, 2026 •

edited

Loading

ciampo commented Jun 16, 2026 •

edited

Loading