From fa8b36fb1406dd27528c9f8a0385a5e0d31fcc25 Mon Sep 17 00:00:00 2001 From: Riad Benguella Date: Sat, 12 Oct 2024 21:43:17 +0200 Subject: [PATCH] Write/Design tool: Persist as a user preference (#65945) Co-authored-by: youknowriad Co-authored-by: oandregal Co-authored-by: mtias Co-authored-by: draganescu Co-authored-by: ndiego Co-authored-by: richtabor --- packages/block-editor/src/store/actions.js | 5 +++-- packages/block-editor/src/store/reducer.js | 17 ----------------- packages/block-editor/src/store/selectors.js | 11 +++++++---- .../src/store/test/private-selectors.js | 8 +++++++- .../block-editor/src/store/test/selectors.js | 15 +++++++++++++-- packages/edit-site/src/store/private-actions.js | 3 --- .../reusable-blocks/src/store/test/actions.js | 2 ++ 7 files changed, 32 insertions(+), 29 deletions(-) diff --git a/packages/block-editor/src/store/actions.js b/packages/block-editor/src/store/actions.js index ee11838395ec5..d92f8bc08569d 100644 --- a/packages/block-editor/src/store/actions.js +++ b/packages/block-editor/src/store/actions.js @@ -21,6 +21,7 @@ import { __, _n, sprintf } from '@wordpress/i18n'; import { store as noticesStore } from '@wordpress/notices'; import { create, insert, remove, toHTMLString } from '@wordpress/rich-text'; import deprecated from '@wordpress/deprecated'; +import { store as preferencesStore } from '@wordpress/preferences'; /** * Internal dependencies @@ -1668,7 +1669,7 @@ export const setNavigationMode = */ export const __unstableSetEditorMode = ( mode ) => - ( { dispatch, select } ) => { + ( { dispatch, select, registry } ) => { // When switching to zoom-out mode, we need to select the parent section if ( mode === 'zoom-out' ) { const firstSelectedClientId = select.getBlockSelectionStart(); @@ -1708,7 +1709,7 @@ export const __unstableSetEditorMode = } } - dispatch( { type: 'SET_EDITOR_MODE', mode } ); + registry.dispatch( preferencesStore ).set( 'core', 'editorTool', mode ); if ( mode === 'navigation' ) { speak( diff --git a/packages/block-editor/src/store/reducer.js b/packages/block-editor/src/store/reducer.js index f6445f8a3681c..1435e815813c4 100644 --- a/packages/block-editor/src/store/reducer.js +++ b/packages/block-editor/src/store/reducer.js @@ -1786,22 +1786,6 @@ export const blockListSettings = ( state = {}, action ) => { return state; }; -/** - * Reducer returning which mode is enabled. - * - * @param {string} state Current state. - * @param {Object} action Dispatched action. - * - * @return {string} Updated state. - */ -export function editorMode( state = 'edit', action ) { - if ( action.type === 'SET_EDITOR_MODE' ) { - return action.mode; - } - - return state; -} - /** * Reducer return an updated state representing the most recent block attribute * update. The state is structured as an object where the keys represent the @@ -2117,7 +2101,6 @@ const combinedReducers = combineReducers( { preferences, lastBlockAttributesChange, lastFocus, - editorMode, expandedBlock, highlightedBlock, lastBlockInserted, diff --git a/packages/block-editor/src/store/selectors.js b/packages/block-editor/src/store/selectors.js index 6cf6aae296141..a81d88de33466 100644 --- a/packages/block-editor/src/store/selectors.js +++ b/packages/block-editor/src/store/selectors.js @@ -16,6 +16,7 @@ import { symbol } from '@wordpress/icons'; import { create, remove, toHTMLString } from '@wordpress/rich-text'; import deprecated from '@wordpress/deprecated'; import { createSelector, createRegistrySelector } from '@wordpress/data'; +import { store as preferencesStore } from '@wordpress/preferences'; /** * Internal dependencies @@ -2691,7 +2692,7 @@ export function __experimentalGetLastBlockAttributeChanges( state ) { * @return {boolean} Is navigation mode enabled. */ export function isNavigationMode( state ) { - return state.editorMode === 'navigation'; + return __unstableGetEditorMode( state ) === 'navigation'; } /** @@ -2701,9 +2702,11 @@ export function isNavigationMode( state ) { * * @return {string} the editor mode. */ -export function __unstableGetEditorMode( state ) { - return state.editorMode; -} +export const __unstableGetEditorMode = createRegistrySelector( + ( select ) => () => { + return select( preferencesStore ).get( 'core', 'editorTool' ); + } +); /** * Returns whether block moving mode is enabled. diff --git a/packages/block-editor/src/store/test/private-selectors.js b/packages/block-editor/src/store/test/private-selectors.js index cbb75daa4baaa..73c14faa6fd06 100644 --- a/packages/block-editor/src/store/test/private-selectors.js +++ b/packages/block-editor/src/store/test/private-selectors.js @@ -11,7 +11,7 @@ import { isDragging, getBlockStyles, } from '../private-selectors'; -import { getBlockEditingMode } from '../selectors'; +import { getBlockEditingMode, __unstableGetEditorMode } from '../selectors'; describe( 'private selectors', () => { describe( 'isBlockInterfaceHidden', () => { @@ -125,11 +125,17 @@ describe( 'private selectors', () => { }; const hasContentRoleAttribute = jest.fn( () => false ); + const get = jest.fn( () => 'edit' ); getBlockEditingMode.registry = { select: jest.fn( () => ( { hasContentRoleAttribute, } ) ), }; + __unstableGetEditorMode.registry = { + select: jest.fn( () => ( { + get, + } ) ), + }; it( 'should return false when top level block is not disabled', () => { const state = { diff --git a/packages/block-editor/src/store/test/selectors.js b/packages/block-editor/src/store/test/selectors.js index a08c2e0dde150..00aa085f66709 100644 --- a/packages/block-editor/src/store/test/selectors.js +++ b/packages/block-editor/src/store/test/selectors.js @@ -9,6 +9,7 @@ import { import { RawHTML } from '@wordpress/element'; import { symbol } from '@wordpress/icons'; import { select, dispatch } from '@wordpress/data'; +import { store as preferencesStore } from '@wordpress/preferences'; /** * Internal dependencies @@ -4470,7 +4471,6 @@ describe( 'getBlockEditingMode', () => { const navigationModeStateWithRootSection = { ...baseState, - editorMode: 'navigation', settings: { [ sectionRootClientIdKey ]: 'ef45d5fd-5234-4fd5-ac4f-c3736c7f9337', // The group is the "main" container }, @@ -4480,12 +4480,18 @@ describe( 'getBlockEditingMode', () => { const fauxPrivateAPIs = {}; - lock( fauxPrivateAPIs, { hasContentRoleAttribute } ); + lock( fauxPrivateAPIs, { + hasContentRoleAttribute, + } ); getBlockEditingMode.registry = { select: jest.fn( () => fauxPrivateAPIs ), }; + afterEach( () => { + dispatch( preferencesStore ).set( 'core', 'editorTool', undefined ); + } ); + it( 'should return default by default', () => { expect( getBlockEditingMode( @@ -4610,6 +4616,7 @@ describe( 'getBlockEditingMode', () => { } ); it( 'in navigation mode, the root section container is default', () => { + dispatch( preferencesStore ).set( 'core', 'editorTool', 'navigation' ); expect( getBlockEditingMode( navigationModeStateWithRootSection, @@ -4619,6 +4626,7 @@ describe( 'getBlockEditingMode', () => { } ); it( 'in navigation mode, anything outside the section container is disabled', () => { + dispatch( preferencesStore ).set( 'core', 'editorTool', 'navigation' ); expect( getBlockEditingMode( navigationModeStateWithRootSection, @@ -4628,6 +4636,7 @@ describe( 'getBlockEditingMode', () => { } ); it( 'in navigation mode, sections are contentOnly', () => { + dispatch( preferencesStore ).set( 'core', 'editorTool', 'navigation' ); expect( getBlockEditingMode( navigationModeStateWithRootSection, @@ -4643,6 +4652,7 @@ describe( 'getBlockEditingMode', () => { } ); it( 'in navigation mode, blocks with content attributes within sections are contentOnly', () => { + dispatch( preferencesStore ).set( 'core', 'editorTool', 'navigation' ); hasContentRoleAttribute.mockReturnValueOnce( true ); expect( getBlockEditingMode( @@ -4661,6 +4671,7 @@ describe( 'getBlockEditingMode', () => { } ); it( 'in navigation mode, blocks without content attributes within sections are disabled', () => { + dispatch( preferencesStore ).set( 'core', 'editorTool', 'navigation' ); expect( getBlockEditingMode( navigationModeStateWithRootSection, diff --git a/packages/edit-site/src/store/private-actions.js b/packages/edit-site/src/store/private-actions.js index 37164690ed7fc..94bcc490b6fd6 100644 --- a/packages/edit-site/src/store/private-actions.js +++ b/packages/edit-site/src/store/private-actions.js @@ -19,9 +19,6 @@ export const setCanvasMode = registry.batch( () => { registry.dispatch( blockEditorStore ).clearSelectedBlock(); registry.dispatch( editorStore ).setDeviceType( 'Desktop' ); - registry - .dispatch( blockEditorStore ) - .__unstableSetEditorMode( 'edit' ); const isPublishSidebarOpened = registry .select( editorStore ) .isPublishSidebarOpened(); diff --git a/packages/reusable-blocks/src/store/test/actions.js b/packages/reusable-blocks/src/store/test/actions.js index b2feae1195ee1..debd656868389 100644 --- a/packages/reusable-blocks/src/store/test/actions.js +++ b/packages/reusable-blocks/src/store/test/actions.js @@ -12,6 +12,7 @@ import { import { store as coreStore } from '@wordpress/core-data'; import apiFetch from '@wordpress/api-fetch'; +import { store as preferencesStore } from '@wordpress/preferences'; /** * Internal dependencies @@ -31,6 +32,7 @@ function createRegistryWithStores() { registry.register( blockEditorStore ); registry.register( reusableBlocksStore ); registry.register( blocksStore ); + registry.register( preferencesStore ); // Register entity here instead of mocking API handlers for loadPostTypeEntities() registry.dispatch( coreStore ).addEntities( [