Editor: Unify Header component. #61273
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
youknowriad
requested review from
draganescu,
jameskoster,
jeryj,
jasmussen,
richtabor and
ntsekouras
|
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: -2.22 kB (-0.13%) Total Size: 1.74 MB
ℹ️ View Unchanged
|
|
Took this for a spin. Trunk:
This branch:
Behavior-wise, this looks right to me. But I'm noticing a couple of unrelated regressions. The toolbar in the site editor is missing a bottom border: This is easiest to see if you set a white background on your site: There's also something about the panel headers that's acting up. The global styles panel header is now very short, and crops the focus style: The regular inspector looks mostly like trunk, but just for reference:
That is, there's still a double border under the tabs, but since that bug is also present in trunk, it's not the work of this PR. |
Mamaduka
reviewed
May 1, 2024
Mamaduka
reviewed
May 1, 2024
Mamaduka
reviewed
May 1, 2024
Mamaduka
reviewed
May 1, 2024
|
@jasmussen Would you be able to track the style issues we have in trunk in an issue so we don't forget about it. (Small Panel header, double border)? I'll be looking at the issues that are specific to this PR. |
|
I was not actually able to reproduce the tiny global styles panel header, not sure what came up there. But yes, I tracked these two issues: |
|
@jasmussen for the global styles panel header, you need to be on a panel with a long scrollbar I think (like when opening the "blocks panel) |
Mamaduka
reviewed
May 1, 2024
|
Reported the collapsing heading: #61283 |
jeryj
reviewed
May 2, 2024
youknowriad
force-pushed
the
try/unify-header
branch
from
6860edd
to
7ac66fa
Compare
|
This one should be ready for a final review. |
Mamaduka
reviewed
May 8, 2024
|
|
||
| const { Header: EditorHeader } = unlock( editorPrivateApis ); | ||
|
|
||
| function Header( { setEntitiesSavedStatesCallback } ) { | ||
| const _isPreviewingTheme = isPreviewingTheme(); | ||
| const hasDefaultEditorCanvasView = ! useHasEditorCanvasContainer(); |
There was a problem hiding this comment.
Maybe we should change the variable name and then drop the negations?
Mamaduka
approved these changes
May 8, 2024
youknowriad
force-pushed
the
try/unify-header
branch
from
63efe53
to
a55a2ae
Compare
|
Ok I think I found a way to fix the mobile tests by not exposing the Header component in mobile. |
|
Flaky tests detected in aeb2f34. 🔍 Workflow run URL: https://github.com/WordPress/gutenberg/actions/runs/9002358831
|
The error seems similar to the one described here. We solved it by adding the mobile native version of the file to avoid importing the package
Yep, this solution should also work. |
sirreal
added a commit
that referenced
this pull request
May 8, 2024
Squashed commit of the following: commit 40c0fd7 Author: Jon Surrell <sirreal@users.noreply.github.com> Date: Wed May 8 18:55:56 2024 +0200 Patch react-autosize-textarea for updated types commit 69cf754 Author: Jon Surrell <sirreal@users.noreply.github.com> Date: Wed May 8 18:48:37 2024 +0200 upgrade framer-motion commit b383044 Author: Jon Surrell <sirreal@users.noreply.github.com> Date: Wed May 8 18:34:44 2024 +0200 Upgrade @use-gesture/react commit fdf93ae Author: Jon Surrell <sirreal@users.noreply.github.com> Date: Wed May 8 18:32:11 2024 +0200 Go bonkers on the global vars commit cc43b8c Author: Jon Surrell <sirreal@users.noreply.github.com> Date: Wed May 8 16:46:39 2024 +0200 Fix the process problem commit 548145e Author: Jon Surrell <sirreal@users.noreply.github.com> Date: Wed May 8 13:33:23 2024 +0200 No more skipLibCheck commit 1eb7644 Author: Miguel Fonseca <150562+mcsf@users.noreply.github.com> Date: Wed May 8 16:33:10 2024 +0100 build: Suggest workaround if `tsc --build` fails (#61501) Following the merge of #60796, developers may face build issues that require package types to be rebuilt. The problem is that `tsc --build` fails somewhat silently -- or rather, there is some output, but it's not clear in the console which stage of the `build:package-types` command failed, and hence what the workaround should be. This commit alleviates the issue by logging a helpful message in the console if `tsc --build` fails: tsc failed. Try cleaning up first: `npm run clean:package-types` commit 14ecb1d Author: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Date: Wed May 8 09:49:20 2024 -0400 Bump actions/checkout from 4.1.4 to 4.1.5 in the github-actions group (#61449) Bumps the github-actions group with 1 update: [actions/checkout](https://github.com/actions/checkout). Updates `actions/checkout` from 4.1.4 to 4.1.5 - [Release notes](https://github.com/actions/checkout/releases) - [Changelog](https://github.com/actions/checkout/blob/main/CHANGELOG.md) - [Commits](actions/checkout@0ad4b8f...44c2b7a) --- updated-dependencies: - dependency-name: actions/checkout dependency-type: direct:production update-type: version-update:semver-patch dependency-group: github-actions ... Signed-off-by: dependabot[bot] <support@github.com> Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com> Co-authored-by: desrosj <desrosj@git.wordpress.org> commit e899475 Author: Marin Atanasov <8436925+tyxla@users.noreply.github.com> Date: Wed May 8 16:48:50 2024 +0300 RadioControl: Fix shrinking radio controls (#61476) Co-authored-by: tyxla <tyxla@git.wordpress.org> Co-authored-by: jameskoster <jameskoster@git.wordpress.org> commit 839c17d Author: Riad Benguella <benguella@gmail.com> Date: Wed May 8 14:39:34 2024 +0100 Editor: Unify Header component. (#61273) Co-authored-by: youknowriad <youknowriad@git.wordpress.org> Co-authored-by: Mamaduka <mamaduka@git.wordpress.org> Co-authored-by: jeryj <jeryj@git.wordpress.org> Co-authored-by: jasmussen <joen@git.wordpress.org> commit 2c2f899 Author: Ella <4710635+ellatrix@users.noreply.github.com> Date: Wed May 8 20:30:44 2024 +0900 Revert "useBlockSync: remove isControlled effect" (#61480) Co-authored-by: ellatrix <ellatrix@git.wordpress.org> Co-authored-by: youknowriad <youknowriad@git.wordpress.org>
2 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Related #52632
What?
We're in a middle of an effort to merge the post and site editors under the @wordpress/editor abstraction. As part of this, this PR unifies the Header component between both editors.
There are some small differences between the editors though:
Also the PR includes a lot of styles and classnames moved around, so let's make sure we test for any visual regressions in the header in the different modes.
Testing Instructions
Please test the headers of both post and site editors (especially site editors) and check any regressions.