Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Site Editor: Unify layout with posts dataviews #67162

Merged
merged 2 commits into from
Nov 27, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 4 additions & 15 deletions packages/edit-site/src/components/app/index.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,6 @@
/**
* WordPress dependencies
*/
import { SlotFillProvider } from '@wordpress/components';
import {
UnsavedChangesWarning,
privateApis as editorPrivateApis,
} from '@wordpress/editor';
import { store as noticesStore } from '@wordpress/notices';
import { useDispatch } from '@wordpress/data';
import { __, sprintf } from '@wordpress/i18n';
Expand All @@ -23,7 +18,6 @@ import useSetCommandContext from '../../hooks/commands/use-set-command-context';
import { useRegisterSiteEditorRoutes } from '../site-editor-routes';

const { RouterProvider } = unlock( routerPrivateApis );
const { GlobalStylesProvider } = unlock( editorPrivateApis );

function AppLayout() {
useCommonCommands();
Expand All @@ -50,14 +44,9 @@ export default function App() {
}

return (
<SlotFillProvider>
Copy link
Contributor

Choose a reason for hiding this comment

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

Is the removal of SlotFillProvider here intentional?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yes, If I'm not wrong it's not really needed at the top level because of a refactor that I did to Slot/Fill at some point where slots will just get inserted under body anyway.

Copy link
Contributor

Choose a reason for hiding this comment

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

I couldn't find where we add it. Do you mean here?

In edit-post we still have this top level.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

In edit-post we still have this top level.

Maybe it's not needed there as well. What issues does it create to drop it?

Copy link
Contributor

Choose a reason for hiding this comment

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

I didn't observe any, but wanted to understand it better.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yes, since that PR you shared, the slot is optional now, Unless I'm missing something, I don't see this having any impact. the "posts dataviews" didn't have that wrapper.

Copy link
Contributor

Choose a reason for hiding this comment

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

Could this removal be the cause to this issue? #67538

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Actually I restored it before merging but I'll take a look at that regression tomorrow.

Copy link
Contributor

@matiasbenedetto matiasbenedetto Dec 3, 2024

Choose a reason for hiding this comment

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

Confirming the issue: #67538 (comment)

<GlobalStylesProvider>
<UnsavedChangesWarning />
<RouterProvider>
<AppLayout />
<PluginArea onError={ onPluginAreaError } />
</RouterProvider>
</GlobalStylesProvider>
</SlotFillProvider>
<RouterProvider>
<AppLayout />
<PluginArea onError={ onPluginAreaError } />
</RouterProvider>
);
}
17 changes: 15 additions & 2 deletions packages/edit-site/src/components/layout/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import {
__unstableMotion as motion,
__unstableAnimatePresence as AnimatePresence,
__unstableUseNavigateRegions as useNavigateRegions,
SlotFillProvider,
} from '@wordpress/components';
import {
useReducedMotion,
Expand All @@ -23,6 +24,7 @@ import { CommandMenu } from '@wordpress/commands';
import { privateApis as blockEditorPrivateApis } from '@wordpress/block-editor';
import {
EditorSnackbars,
UnsavedChangesWarning,
privateApis as editorPrivateApis,
} from '@wordpress/editor';
import { privateApis as coreCommandsPrivateApis } from '@wordpress/core-commands';
Expand All @@ -44,12 +46,12 @@ import SavePanel from '../save-panel';

const { useCommands } = unlock( coreCommandsPrivateApis );
const { useGlobalStyle } = unlock( blockEditorPrivateApis );
const { NavigableRegion } = unlock( editorPrivateApis );
const { NavigableRegion, GlobalStylesProvider } = unlock( editorPrivateApis );
const { useLocation } = unlock( routerPrivateApis );

const ANIMATION_DURATION = 0.3;

export default function Layout( { route } ) {
function Layout( { route } ) {
const { params } = useLocation();
const { canvas = 'view' } = params;
useCommands();
Expand Down Expand Up @@ -78,6 +80,7 @@ export default function Layout( { route } ) {

return (
<>
<UnsavedChangesWarning />
<CommandMenu />
{ canvas === 'view' && <SaveKeyboardShortcut /> }
<div
Expand Down Expand Up @@ -231,3 +234,13 @@ export default function Layout( { route } ) {
</>
);
}

export default function LayoutWithGlobalStylesProvider( props ) {
return (
<SlotFillProvider>
<GlobalStylesProvider>
<Layout { ...props } />
</GlobalStylesProvider>
</SlotFillProvider>
);
}
14 changes: 3 additions & 11 deletions packages/edit-site/src/components/posts-app/index.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
/**
* WordPress dependencies
*/
import {
UnsavedChangesWarning,
privateApis as editorPrivateApis,
} from '@wordpress/editor';
import { privateApis as routerPrivateApis } from '@wordpress/router';

/**
Expand All @@ -15,7 +11,6 @@ import useActiveRoute from './router';
import { unlock } from '../../lock-unlock';

const { RouterProvider } = unlock( routerPrivateApis );
const { GlobalStylesProvider } = unlock( editorPrivateApis );

function PostsLayout() {
const route = useActiveRoute();
Expand All @@ -24,11 +19,8 @@ function PostsLayout() {

export default function PostsApp() {
return (
<GlobalStylesProvider>
<UnsavedChangesWarning />
<RouterProvider>
<PostsLayout />
</RouterProvider>
</GlobalStylesProvider>
<RouterProvider>
<PostsLayout />
</RouterProvider>
);
}
Loading