diff --git a/lib/experimental/posts/load.php b/lib/experimental/posts/load.php
index 3a9feba2750c1c..9be8d6945f19ff 100644
--- a/lib/experimental/posts/load.php
+++ b/lib/experimental/posts/load.php
@@ -11,14 +11,67 @@
* Renders the new posts dashboard page.
*/
function gutenberg_posts_dashboard() {
+ // Flag that we're loading the block editor.
+ // $current_screen = get_current_screen();
+ // $current_screen->is_block_editor( true );
+
+ // Default to is-fullscreen-mode to avoid jumps in the UI.
+ // add_filter(
+ // 'admin_body_class',
+ // static function ( $classes ) {
+ // return "$classes is-fullscreen-mode";
+ // }
+ // );
+
+ $block_editor_context = new WP_Block_Editor_Context( array( 'name' => 'core/edit-site' ) );
+ $custom_settings = array(
+ 'siteUrl' => site_url(),
+ // 'postsPerPage' => get_option( 'posts_per_page' ),
+ 'styles' => get_block_editor_theme_styles(),
+ // 'defaultTemplateTypes' => $indexed_template_types,
+ // 'defaultTemplatePartAreas' => get_allowed_block_template_part_areas(),
+ 'supportsLayout' => wp_theme_has_theme_json(),
+ // 'supportsTemplatePartsMode' => ! wp_is_block_theme() && current_theme_supports( 'block-template-parts' ),
+ );
+ $editor_settings = get_block_editor_settings( $custom_settings, $block_editor_context );
+
+ $active_global_styles_id = WP_Theme_JSON_Resolver::get_user_global_styles_post_id();
+ $active_theme = get_stylesheet();
+
+ // Preload server-registered block schemas.
+ wp_add_inline_script(
+ 'wp-blocks',
+ 'wp.blocks.unstable__bootstrapServerSideBlockDefinitions(' . wp_json_encode( get_block_editor_server_block_settings() ) . ');'
+ );
+
+ wp_add_inline_script(
+ 'wp-blocks',
+ sprintf( 'wp.blocks.setCategories( %s );', wp_json_encode( isset( $editor_settings['blockCategories'] ) ? $editor_settings['blockCategories'] : array() ) ),
+ 'after'
+ );
+
+ /** This action is documented in wp-admin/edit-form-blocks.php */
+ do_action( 'enqueue_block_editor_assets' );
wp_register_style(
'wp-gutenberg-posts-dashboard',
gutenberg_url( 'build/edit-site/posts.css', __FILE__ ),
- array( 'wp-components', 'wp-commands' )
+ array( 'wp-components', 'wp-commands', 'wp-edit-site' )
);
wp_enqueue_style( 'wp-gutenberg-posts-dashboard' );
- wp_add_inline_script( 'wp-edit-site', 'window.wp.editSite.initializePostsDashboard( "gutenberg-posts-dashboard" );', 'after' );
+ // wp_add_inline_script( 'wp-edit-site', 'window.wp.editSite.initializePostsDashboard( "gutenberg-posts-dashboard" );', 'after' );
+ wp_add_inline_script(
+ 'wp-edit-site',
+ sprintf(
+ 'wp.domReady( function() {
+ wp.editSite.initializePostsDashboard( "gutenberg-posts-dashboard", %s );
+ } );',
+ wp_json_encode( $editor_settings )
+ )
+ );
wp_enqueue_script( 'wp-edit-site' );
+ // wp_enqueue_style( 'wp-edit-site' );
+
+ wp_enqueue_media();
echo '
';
}
@@ -29,7 +82,7 @@ function gutenberg_posts_dashboard() {
*/
function gutenberg_add_post_type_arg() {
global $pagenow;
- if ( $pagenow == 'admin.php' && isset( $_GET['page'] ) && $_GET['page'] == 'gutenberg-posts-dashboard' && empty( $_GET['postType'] ) ) {
+ if ( 'admin.php' === $pagenow && isset( $_GET['page'] ) && 'gutenberg-posts-dashboard' === $_GET['page'] && empty( $_GET['postType'] ) ) {
wp_redirect( admin_url( '/admin.php?page=gutenberg-posts-dashboard&postType=post' ) );
exit;
}
diff --git a/packages/edit-site/src/components/editor/index.js b/packages/edit-site/src/components/editor/index.js
index 85a9a428fe2f2f..dc51bd0d31df70 100644
--- a/packages/edit-site/src/components/editor/index.js
+++ b/packages/edit-site/src/components/editor/index.js
@@ -44,12 +44,14 @@ import SiteEditorMoreMenu from '../more-menu';
import SiteIcon from '../site-icon';
import useEditorIframeProps from '../block-editor/use-editor-iframe-props';
import useEditorTitle from './use-editor-title';
+import { useIsSiteEditorLoading } from '../layout/hooks';
const { Editor, BackButton } = unlock( editorPrivateApis );
const { useHistory } = unlock( routerPrivateApis );
const { BlockKeyboardShortcuts } = unlock( blockLibraryPrivateApis );
-export default function EditSiteEditor( { isLoading } ) {
+export default function EditSiteEditor() {
+ const isLoading = useIsSiteEditorLoading();
const {
editedPostType,
editedPostId,
diff --git a/packages/edit-site/src/components/layout/router.js b/packages/edit-site/src/components/layout/router.js
index 64406391c76f0e..36ca52088f6a8f 100644
--- a/packages/edit-site/src/components/layout/router.js
+++ b/packages/edit-site/src/components/layout/router.js
@@ -8,7 +8,6 @@ import { useEffect } from '@wordpress/element';
* Internal dependencies
*/
import { unlock } from '../../lock-unlock';
-import { useIsSiteEditorLoading } from './hooks';
import Editor from '../editor';
import PostsList from '../posts-app/posts-list';
import PagePatterns from '../page-patterns';
@@ -74,7 +73,6 @@ function useRedirectOldPaths() {
}
export default function useLayoutAreas() {
- const isSiteEditorLoading = useIsSiteEditorLoading();
const { params } = useLocation();
const { postType, postId, path, layout, isCustom, canvas } = params;
useRedirectOldPaths();
@@ -93,12 +91,10 @@ export default function useLayoutAreas() {
/>
),
content: ,
- preview: ( isListLayout || canvas === 'edit' ) && (
-
- ),
+ preview: ( isListLayout || canvas === 'edit' ) && ,
mobile:
canvas === 'edit' ? (
-
+
) : (
),
@@ -119,9 +115,7 @@ export default function useLayoutAreas() {
),
content: ,
- preview: ( isListLayout || canvas === 'edit' ) && (
-
- ),
+ preview: ( isListLayout || canvas === 'edit' ) && ,
mobile: ,
},
widths: {
@@ -140,9 +134,7 @@ export default function useLayoutAreas() {
sidebar: ,
content: ,
mobile: ,
- preview: canvas === 'edit' && (
-
- ),
+ preview: canvas === 'edit' && ,
},
};
}
@@ -155,10 +147,8 @@ export default function useLayoutAreas() {
sidebar: (
),
- preview: ,
- mobile: canvas === 'edit' && (
-
- ),
+ preview: ,
+ mobile: canvas === 'edit' && ,
},
};
}
@@ -174,10 +164,8 @@ export default function useLayoutAreas() {
backPath={ { postType: NAVIGATION_POST_TYPE } }
/>
),
- preview: ,
- mobile: canvas === 'edit' && (
-
- ),
+ preview: ,
+ mobile: canvas === 'edit' && ,
},
};
}
@@ -187,10 +175,8 @@ export default function useLayoutAreas() {
sidebar: (
),
- preview: ,
- mobile: canvas === 'edit' && (
-
- ),
+ preview: ,
+ mobile: canvas === 'edit' && ,
},
};
}
@@ -200,10 +186,8 @@ export default function useLayoutAreas() {
key: 'default',
areas: {
sidebar: ,
- preview: ,
- mobile: canvas === 'edit' && (
-
- ),
+ preview: ,
+ mobile: canvas === 'edit' && ,
},
};
}
diff --git a/packages/edit-site/src/components/posts-app/router.js b/packages/edit-site/src/components/posts-app/router.js
index 76c4525e48f22e..3a5f47c17f603e 100644
--- a/packages/edit-site/src/components/posts-app/router.js
+++ b/packages/edit-site/src/components/posts-app/router.js
@@ -9,7 +9,6 @@ import { store as coreStore } from '@wordpress/core-data';
* Internal dependencies
*/
import { unlock } from '../../lock-unlock';
-import { useIsSiteEditorLoading } from '../layout/hooks';
import Editor from '../editor';
import SidebarNavigationScreen from '../sidebar-navigation-screen';
import SidebarNavigationScreenMain from '../sidebar-navigation-screen-main';
@@ -19,7 +18,6 @@ import PostsList from '../posts-app/posts-list';
const { useLocation } = unlock( routerPrivateApis );
export default function useLayoutAreas() {
- const isSiteEditorLoading = useIsSiteEditorLoading();
const { params = {} } = useLocation();
const { postType, layout, canvas } = params;
const labels = useSelect(
@@ -30,25 +28,23 @@ export default function useLayoutAreas() {
);
// Posts list.
- if ( [ 'page', 'post' ].includes( postType ) ) {
+ if ( [ 'post' ].includes( postType ) ) {
const isListLayout = layout === 'list' || ! layout;
return {
- key: 'pages',
+ key: 'posts-list',
areas: {
sidebar: (
}
/>
),
content: ,
- preview: ( isListLayout || canvas === 'edit' ) && (
-
- ),
+ preview: ( isListLayout || canvas === 'edit' ) && ,
mobile:
canvas === 'edit' ? (
-
+
) : (
),
@@ -59,24 +55,13 @@ export default function useLayoutAreas() {
};
}
- // const defaultRoute = {
- // key: 'index',
- // areas: {
- // sidebar: 'Empty Sidebar',
- // content: ,
- // preview: undefined,
- // mobile: Welcome to Posts,
- // },
- // };
// Fallback shows the home page preview
return {
key: 'default',
areas: {
sidebar: ,
- preview: ,
- mobile: canvas === 'edit' && (
-
- ),
+ preview: ,
+ mobile: canvas === 'edit' && ,
},
};
}
diff --git a/packages/edit-site/src/posts.js b/packages/edit-site/src/posts.js
index 04ea525c031536..ede7018a671dfe 100644
--- a/packages/edit-site/src/posts.js
+++ b/packages/edit-site/src/posts.js
@@ -1,7 +1,26 @@
/**
* WordPress dependencies
*/
+import { store as blocksStore } from '@wordpress/blocks';
+import {
+ registerCoreBlocks,
+ __experimentalGetCoreBlocks,
+ __experimentalRegisterExperimentalCoreBlocks,
+} from '@wordpress/block-library';
+import { dispatch } from '@wordpress/data';
import { createRoot, StrictMode } from '@wordpress/element';
+import { store as editorStore } from '@wordpress/editor';
+import { store as preferencesStore } from '@wordpress/preferences';
+import {
+ registerLegacyWidgetBlock,
+ registerWidgetGroupBlock,
+} from '@wordpress/widgets';
+
+/**
+ * Internal dependencies
+ */
+import './hooks';
+import { store as editSiteStore } from './store';
/**
* Internal dependencies
@@ -11,16 +30,67 @@ import PostsApp from './components/posts-app';
/**
* Initializes the "Posts Dashboard"
- * @param {string} id DOM element id.
+ * @param {string} id ID of the root element to render the screen in.
+ * @param {Object} settings Editor settings.
*/
-export function initializePostsDashboard( id ) {
+export function initializePostsDashboard( id, settings ) {
if ( ! globalThis.IS_GUTENBERG_PLUGIN ) {
return;
}
- // initializeEditor( 'site-editor', {} );
const target = document.getElementById( id );
const root = createRoot( target );
+ dispatch( blocksStore ).reapplyBlockTypeFilters();
+ const coreBlocks = __experimentalGetCoreBlocks().filter(
+ ( { name } ) => name !== 'core/freeform'
+ );
+ registerCoreBlocks( coreBlocks );
+ dispatch( blocksStore ).setFreeformFallbackBlockName( 'core/html' );
+ registerLegacyWidgetBlock( { inserter: false } );
+ registerWidgetGroupBlock( { inserter: false } );
+ if ( globalThis.IS_GUTENBERG_PLUGIN ) {
+ __experimentalRegisterExperimentalCoreBlocks( {
+ enableFSEBlocks: true,
+ } );
+ }
+
+ // We dispatch actions and update the store synchronously before rendering
+ // so that we won't trigger unnecessary re-renders with useEffect.
+ dispatch( preferencesStore ).setDefaults( 'core/edit-site', {
+ welcomeGuide: true,
+ welcomeGuideStyles: true,
+ welcomeGuidePage: true,
+ welcomeGuideTemplate: true,
+ } );
+
+ dispatch( preferencesStore ).setDefaults( 'core', {
+ allowRightClickOverrides: true,
+ distractionFree: false,
+ editorMode: 'visual',
+ fixedToolbar: false,
+ focusMode: false,
+ inactivePanels: [],
+ keepCaretInsideBlock: false,
+ openPanels: [ 'post-status' ],
+ showBlockBreadcrumbs: true,
+ showListViewByDefault: false,
+ } );
+
+ dispatch( editSiteStore ).updateSettings( settings );
+
+ // Keep the defaultTemplateTypes in the core/editor settings too,
+ // so that they can be selected with core/editor selectors in any editor.
+ // This is needed because edit-site doesn't initialize with EditorProvider,
+ // which internally uses updateEditorSettings as well.
+ dispatch( editorStore ).updateEditorSettings( {
+ defaultTemplateTypes: settings.defaultTemplateTypes,
+ defaultTemplatePartAreas: settings.defaultTemplatePartAreas,
+ } );
+
+ // Prevent the default browser action for files dropped outside of dropzones.
+ window.addEventListener( 'dragover', ( e ) => e.preventDefault(), false );
+ window.addEventListener( 'drop', ( e ) => e.preventDefault(), false );
+
root.render(