@wordpress/edit-site 4.19.0 → 5.0.0

package/src/store/actions.js

@@ -63,16 +63,19 @@ export const setTemplate =
 	( templateId, templateSlug ) =>
 	async ( { dispatch, registry } ) => {
 		if ( ! templateSlug ) {
-			const template = await registry
-				.resolveSelect( coreStore )
-				.getEntityRecord( 'postType', 'wp_template', templateId );
-			templateSlug = template?.slug;
+			try {
+				const template = await registry
+					.resolveSelect( coreStore )
+					.getEntityRecord( 'postType', 'wp_template', templateId );
+				templateSlug = template?.slug;
+			} catch ( error ) {}
 		}
 
 		dispatch( {
-			type: 'SET_TEMPLATE',
-			templateId,
-			page: { context: { templateSlug } },
+			type: 'SET_EDITED_POST',
+			postType: 'wp_template',
+			id: templateId,
+			context: { templateSlug },
 		} );
 	};
 
@@ -103,9 +106,10 @@ export const addTemplate =
 		}
 
 		dispatch( {
-			type: 'SET_TEMPLATE',
-			templateId: newTemplate.id,
-			page: { context: { templateSlug: newTemplate.slug } },
+			type: 'SET_EDITED_POST',
+			postType: 'wp_template',
+			id: newTemplate.id,
+			context: { templateSlug: newTemplate.slug },
 		} );
 	};
 
@@ -165,21 +169,37 @@ export const removeTemplate =
  */
 export function setTemplatePart( templatePartId ) {
 	return {
-		type: 'SET_TEMPLATE_PART',
-		templatePartId,
+		type: 'SET_EDITED_POST',
+		postType: 'wp_template_part',
+		id: templatePartId,
+	};
+}
+
+/**
+ * @deprecated
+ */
+export function setHomeTemplateId() {
+	deprecated( "dispatch( 'core/edit-site' ).setHomeTemplateId", {
+		since: '6.2',
+		version: '6.4',
+	} );
+
+	return {
+		type: 'NOTHING',
 	};
 }
 
 /**
- * Action that sets the home template ID to the template ID of the page resolved
- * from a given path.
+ * Set's the current block editor context.
  *
- * @param {number} homeTemplateId The template ID for the homepage.
+ * @param {Object} context The context object.
+ *
+ * @return {number} The resolved template ID for the page route.
  */
-export function setHomeTemplateId( homeTemplateId ) {
+export function setEditedPostContext( context ) {
 	return {
-		type: 'SET_HOME_TEMPLATE',
-		homeTemplateId,
+		type: 'SET_EDITED_POST_CONTEXT',
+		context,
 	};
 }
 
@@ -219,17 +239,13 @@ export const setPage =
 		}
 
 		dispatch( {
-			type: 'SET_PAGE',
-			page: template.slug
-				? {
-						...page,
-						context: {
-							...page.context,
-							templateSlug: template.slug,
-						},
-				  }
-				: page,
-			templateId: template.id,
+			type: 'SET_EDITED_POST',
+			postType: 'wp_template',
+			id: template.id,
+			context: {
+				...page.context,
+				templateSlug: template.slug,
+			},
 		} );
 
 		return template.id;
@@ -238,40 +254,45 @@ export const setPage =
 /**
  * Action that sets the active navigation panel menu.
  *
- * @param {string} menu Menu prop of active menu.
+ * @deprecated
  *
  * @return {Object} Action object.
  */
-export function setNavigationPanelActiveMenu( menu ) {
-	return {
-		type: 'SET_NAVIGATION_PANEL_ACTIVE_MENU',
-		menu,
-	};
+export function setNavigationPanelActiveMenu() {
+	deprecated( "dispatch( 'core/edit-site' ).setNavigationPanelActiveMenu", {
+		since: '6.2',
+		version: '6.4',
+	} );
+
+	return { type: 'NOTHING' };
 }
 
 /**
  * Opens the navigation panel and sets its active menu at the same time.
  *
- * @param {string} menu Identifies the menu to open.
+ * @deprecated
  */
-export function openNavigationPanelToMenu( menu ) {
-	return {
-		type: 'OPEN_NAVIGATION_PANEL_TO_MENU',
-		menu,
-	};
+export function openNavigationPanelToMenu() {
+	deprecated( "dispatch( 'core/edit-site' ).openNavigationPanelToMenu", {
+		since: '6.2',
+		version: '6.4',
+	} );
+
+	return { type: 'NOTHING' };
 }
 
 /**
  * Sets whether the navigation panel should be open.
  *
- * @param {boolean} isOpen If true, opens the nav panel. If false, closes it. It
- *                         does not toggle the state, but sets it directly.
+ * @deprecated
  */
-export function setIsNavigationPanelOpened( isOpen ) {
-	return {
-		type: 'SET_IS_NAVIGATION_PANEL_OPENED',
-		isOpen,
-	};
+export function setIsNavigationPanelOpened() {
+	deprecated( "dispatch( 'core/edit-site' ).setIsNavigationPanelOpened", {
+		since: '6.2',
+		version: '6.4',
+	} );
+
+	return { type: 'NOTHING' };
 }
 
 /**
@@ -509,3 +530,27 @@ export const switchEditorMode =
 			speak( __( 'Mosaic view selected' ), 'assertive' );
 		}
 	};
+
+/**
+ * Action that switches the canvas mode.
+ *
+ * @param {?string} mode Canvas mode.
+ */
+export const __unstableSetCanvasMode =
+	( mode ) =>
+	( { registry, dispatch } ) => {
+		registry.dispatch( blockEditorStore ).__unstableSetEditorMode( 'edit' );
+		dispatch( {
+			type: 'SET_CANVAS_MODE',
+			mode,
+		} );
+		// Check if the block list view should be open by default.
+		if (
+			mode === 'edit' &&
+			registry
+				.select( preferencesStore )
+				.get( 'core/edit-site', 'showListViewByDefault' )
+		) {
+			dispatch.setIsListViewOpened( true );
+		}
+	};

package/src/store/reducer.js

@@ -3,11 +3,6 @@
  */
 import { combineReducers } from '@wordpress/data';
 
-/**
- * Internal dependencies
- */
-import { MENU_ROOT } from '../components/navigation-sidebar/navigation-panel/constants';
-
 /**
  * Reducer returning the editing canvas device type.
  *
@@ -56,85 +51,19 @@ export function settings( state = {}, action ) {
  */
 export function editedPost( state = {}, action ) {
 	switch ( action.type ) {
-		case 'SET_TEMPLATE':
-		case 'SET_PAGE':
+		case 'SET_EDITED_POST':
 			return {
-				type: 'wp_template',
-				id: action.templateId,
-				page: action.page,
+				postType: action.postType,
+				id: action.id,
+				context: action.context,
 			};
-		case 'SET_TEMPLATE_PART':
-			return {
-				type: 'wp_template_part',
-				id: action.templatePartId,
-			};
-	}
-
-	return state;
-}
-
-/**
- * Reducer for information about the site's homepage.
- *
- * @param {Object} state  Current state.
- * @param {Object} action Dispatched action.
- *
- * @return {Object} Updated state.
- */
-export function homeTemplateId( state, action ) {
-	switch ( action.type ) {
-		case 'SET_HOME_TEMPLATE':
-			return action.homeTemplateId;
-	}
-
-	return state;
-}
-
-/**
- * Reducer for information about the navigation panel, such as its active menu
- * and whether it should be opened or closed.
- *
- * Note: this reducer interacts with the inserter and list view panels reducers
- * to make sure that only one of the three panels is open at the same time.
- *
- * @param {Object} state  Current state.
- * @param {Object} action Dispatched action.
- */
-export function navigationPanel(
-	state = { menu: MENU_ROOT, isOpen: false },
-	action
-) {
-	switch ( action.type ) {
-		case 'SET_NAVIGATION_PANEL_ACTIVE_MENU':
+		case 'SET_EDITED_POST_CONTEXT':
 			return {
 				...state,
-				menu: action.menu,
-			};
-		case 'OPEN_NAVIGATION_PANEL_TO_MENU':
-			return {
-				...state,
-				isOpen: true,
-				menu: action.menu,
-			};
-		case 'SET_IS_NAVIGATION_PANEL_OPENED':
-			return {
-				...state,
-				menu: ! action.isOpen ? MENU_ROOT : state.menu, // Set menu to root when closing panel.
-				isOpen: action.isOpen,
-			};
-		case 'SET_IS_LIST_VIEW_OPENED':
-			return {
-				...state,
-				menu: state.isOpen && action.isOpen ? MENU_ROOT : state.menu, // Set menu to root when closing panel.
-				isOpen: action.isOpen ? false : state.isOpen,
-			};
-		case 'SET_IS_INSERTER_OPENED':
-			return {
-				...state,
-				menu: state.isOpen && action.value ? MENU_ROOT : state.menu, // Set menu to root when closing panel.
-				isOpen: action.value ? false : state.isOpen,
+				context: action.context,
 			};
 	}
+
 	return state;
 }
 
@@ -149,13 +78,12 @@ export function navigationPanel(
  */
 export function blockInserterPanel( state = false, action ) {
 	switch ( action.type ) {
-		case 'OPEN_NAVIGATION_PANEL_TO_MENU':
-			return false;
-		case 'SET_IS_NAVIGATION_PANEL_OPENED':
 		case 'SET_IS_LIST_VIEW_OPENED':
 			return action.isOpen ? false : state;
 		case 'SET_IS_INSERTER_OPENED':
 			return action.value;
+		case 'SET_CANVAS_MODE':
+			return false;
 	}
 	return state;
 }
@@ -171,14 +99,12 @@ export function blockInserterPanel( state = false, action ) {
  */
 export function listViewPanel( state = false, action ) {
 	switch ( action.type ) {
-		case 'OPEN_NAVIGATION_PANEL_TO_MENU':
-			return false;
-		case 'SET_IS_NAVIGATION_PANEL_OPENED':
-			return action.isOpen ? false : state;
 		case 'SET_IS_INSERTER_OPENED':
 			return action.value ? false : state;
 		case 'SET_IS_LIST_VIEW_OPENED':
 			return action.isOpen;
+		case 'SET_CANVAS_MODE':
+			return false;
 	}
 	return state;
 }
@@ -191,13 +117,26 @@ export function listViewPanel( state = false, action ) {
  */
 export function saveViewPanel( state = false, action ) {
 	switch ( action.type ) {
-		case 'OPEN_NAVIGATION_PANEL_TO_MENU':
-			return false;
-		case 'SET_IS_NAVIGATION_PANEL_OPENED':
-			return action.isOpen ? false : state;
 		case 'SET_IS_SAVE_VIEW_OPENED':
 			return action.isOpen;
+		case 'SET_CANVAS_MODE':
+			return false;
+	}
+	return state;
+}
+
+/**
+ * Reducer used to track the site editor canvas mode (edit or view).
+ *
+ * @param {Object} state  Current state.
+ * @param {Object} action Dispatched action.
+ */
+function canvasMode( state = 'view', action ) {
+	switch ( action.type ) {
+		case 'SET_CANVAS_MODE':
+			return action.mode;
 	}
+
 	return state;
 }
 
@@ -205,9 +144,8 @@ export default combineReducers( {
 	deviceType,
 	settings,
 	editedPost,
-	homeTemplateId,
-	navigationPanel,
 	blockInserterPanel,
 	listViewPanel,
 	saveViewPanel,
+	canvasMode,
 } );

package/src/store/selectors.js

@@ -1,7 +1,6 @@
 /**
  * External dependencies
  */
-import { map } from 'lodash';
 import createSelector from 'rememo';
 
 /**
@@ -15,20 +14,6 @@ import { isTemplatePart } from '@wordpress/blocks';
 import { Platform } from '@wordpress/element';
 import { store as preferencesStore } from '@wordpress/preferences';
 
-/**
- * Internal dependencies
- */
-import {
-	MENU_ROOT,
-	MENU_TEMPLATE_PARTS,
-	MENU_TEMPLATES_UNUSED,
-	TEMPLATE_PARTS_SUB_MENUS,
-} from '../components/navigation-sidebar/navigation-panel/constants';
-import {
-	getTemplateLocation,
-	isTemplateSuperseded,
-} from '../components/navigation-sidebar/navigation-panel/template-hierarchy';
-
 /**
  * @typedef {'template'|'template_type'} TemplateType Template type.
  */
@@ -161,18 +146,13 @@ export const getSettings = createSelector(
 );
 
 /**
- * Returns the current home template ID.
- *
- * @param {Object} state Global application state.
- *
- * @return {number?} Home template ID.
+ * @deprecated
  */
-export function getHomeTemplateId( state ) {
-	return state.homeTemplateId;
-}
-
-function getCurrentEditedPost( state ) {
-	return state.editedPost;
+export function getHomeTemplateId() {
+	deprecated( "select( 'core/edit-site' ).getHomeTemplateId", {
+		since: '6.2',
+		version: '6.4',
+	} );
 }
 
 /**
@@ -183,7 +163,7 @@ function getCurrentEditedPost( state ) {
  * @return {TemplateType?} Template type.
  */
 export function getEditedPostType( state ) {
-	return getCurrentEditedPost( state ).type;
+	return state.editedPost.postType;
 }
 
 /**
@@ -194,95 +174,31 @@ export function getEditedPostType( state ) {
  * @return {string?} Post ID.
  */
 export function getEditedPostId( state ) {
-	return getCurrentEditedPost( state ).id;
+	return state.editedPost.id;
 }
 
 /**
- * Returns the current page object.
+ * Returns the edited post's context object.
  *
+ * @deprecated
  * @param {Object} state Global application state.
  *
  * @return {Object} Page.
  */
-export function getPage( state ) {
-	return getCurrentEditedPost( state ).page;
+export function getEditedPostContext( state ) {
+	return state.editedPost.context;
 }
 
 /**
- * Returns the active menu in the navigation panel.
- *
- * @param {Object} state Global application state.
- *
- * @return {string} Active menu.
- */
-export function getNavigationPanelActiveMenu( state ) {
-	return state.navigationPanel.menu;
-}
-
-/**
- * Returns the current template or template part's corresponding
- * navigation panel's sub menu, to be used with `openNavigationPanelToMenu`.
- *
- * @param {Object} state Global application state.
- *
- * @return {string} The current template or template part's sub menu.
- */
-export const getCurrentTemplateNavigationPanelSubMenu = createRegistrySelector(
-	( select ) => ( state ) => {
-		const templateType = getEditedPostType( state );
-		const templateId = getEditedPostId( state );
-		const template = templateId
-			? select( coreDataStore ).getEntityRecord(
-					'postType',
-					templateType,
-					templateId
-			  )
-			: null;
-
-		if ( ! template ) {
-			return MENU_ROOT;
-		}
-
-		if ( 'wp_template_part' === templateType ) {
-			return (
-				TEMPLATE_PARTS_SUB_MENUS.find(
-					( submenu ) => submenu.area === template?.area
-				)?.menu || MENU_TEMPLATE_PARTS
-			);
-		}
-
-		const templates = select( coreDataStore ).getEntityRecords(
-			'postType',
-			'wp_template'
-		);
-		const showOnFront = select( coreDataStore ).getEditedEntityRecord(
-			'root',
-			'site'
-		).show_on_front;
-
-		if (
-			isTemplateSuperseded(
-				template.slug,
-				map( templates, 'slug' ),
-				showOnFront
-			)
-		) {
-			return MENU_TEMPLATES_UNUSED;
-		}
-
-		return getTemplateLocation( template.slug );
-	}
-);
-
-/**
- * Returns the current opened/closed state of the navigation panel.
+ * Returns the current page object.
  *
+ * @deprecated
  * @param {Object} state Global application state.
  *
- * @return {boolean} True if the navigation panel should be open; false if closed.
+ * @return {Object} Page.
  */
-export function isNavigationOpened( state ) {
-	return state.navigationPanel.isOpen;
+export function getPage( state ) {
+	return { context: state.editedPost.context };
 }
 
 /**
@@ -391,3 +307,47 @@ export const getCurrentTemplateTemplateParts = createRegistrySelector(
 export function getEditorMode( state ) {
 	return __unstableGetPreference( state, 'editorMode' );
 }
+
+/**
+ * Returns the current canvas mode.
+ *
+ * @param {Object} state Global application state.
+ *
+ * @return {string} Canvas mode.
+ */
+export function __unstableGetCanvasMode( state ) {
+	return state.canvasMode;
+}
+
+/**
+ * @deprecated
+ */
+export function getCurrentTemplateNavigationPanelSubMenu() {
+	deprecated(
+		"dispatch( 'core/edit-site' ).getCurrentTemplateNavigationPanelSubMenu",
+		{
+			since: '6.2',
+			version: '6.4',
+		}
+	);
+}
+
+/**
+ * @deprecated
+ */
+export function getNavigationPanelActiveMenu() {
+	deprecated( "dispatch( 'core/edit-site' ).getNavigationPanelActiveMenu", {
+		since: '6.2',
+		version: '6.4',
+	} );
+}
+
+/**
+ * @deprecated
+ */
+export function isNavigationOpened() {
+	deprecated( "dispatch( 'core/edit-site' ).isNavigationOpened", {
+		since: '6.2',
+		version: '6.4',
+	} );
+}

package/src/store/test/actions.js

@@ -81,7 +81,7 @@ describe( 'actions', () => {
 
 			const select = registry.select( editSiteStore );
 			expect( select.getEditedPostId() ).toBe( ID );
-			expect( select.getPage().context.templateSlug ).toBe( SLUG );
+			expect( select.getEditedPostContext().templateSlug ).toBe( SLUG );
 		} );
 
 		it( 'should set the template by fetching the template slug', async () => {
@@ -109,7 +109,7 @@ describe( 'actions', () => {
 
 			const select = registry.select( editSiteStore );
 			expect( select.getEditedPostId() ).toBe( ID );
-			expect( select.getPage().context.templateSlug ).toBe( SLUG );
+			expect( select.getEditedPostContext().templateSlug ).toBe( SLUG );
 		} );
 	} );
 
@@ -146,7 +146,7 @@ describe( 'actions', () => {
 
 			const select = registry.select( editSiteStore );
 			expect( select.getEditedPostId() ).toBe( ID );
-			expect( select.getPage().context.templateSlug ).toBe( SLUG );
+			expect( select.getEditedPostContext().templateSlug ).toBe( SLUG );
 		} );
 	} );
 
@@ -207,18 +207,6 @@ describe( 'actions', () => {
 			const select = registry.select( editSiteStore );
 			expect( select.getEditedPostId() ).toBe( 'emptytheme//single' );
 			expect( select.getEditedPostType() ).toBe( 'wp_template' );
-			expect( select.getPage().path ).toBe( '/' );
-		} );
-	} );
-
-	describe( 'setHomeTemplateId', () => {
-		it( 'should set the home template ID', () => {
-			const registry = createRegistryWithStores();
-
-			registry.dispatch( editSiteStore ).setHomeTemplateId( 90 );
-			expect( registry.select( editSiteStore ).getHomeTemplateId() ).toBe(
-				90
-			);
 		} );
 	} );