Editor: Unify the Editor Mode preference. (#57642)

WordPress · Jan 12, 2024 · f89e323 · f89e323
1 parent 7fce392
commit f89e323
Show file tree

Hide file tree

Showing 8 changed files with 23 additions and 11 deletions.
diff --git a/packages/edit-post/src/index.js b/packages/edit-post/src/index.js
@@ -53,7 +53,6 @@ export function initializeEditor(
 	const root = createRoot( target );
 
 	dispatch( preferencesStore ).setDefaults( 'core/edit-post', {
-		editorMode: 'visual',
 		fullscreenMode: true,
 		hiddenBlockTypes: [],
 		isPublishSidebarEnabled: true,
@@ -65,6 +64,7 @@ export function initializeEditor(
 
 	dispatch( preferencesStore ).setDefaults( 'core', {
 		allowRightClickOverrides: true,
+		editorMode: 'visual',
 		fixedToolbar: false,
 		inactivePanels: [],
 		openPanels: [ 'post-status' ],

diff --git a/packages/edit-post/src/store/actions.js b/packages/edit-post/src/store/actions.js
@@ -194,9 +194,7 @@ export const toggleFeature =
 export const switchEditorMode =
 	( mode ) =>
 	( { dispatch, registry } ) => {
-		registry
-			.dispatch( preferencesStore )
-			.set( 'core/edit-post', 'editorMode', mode );
+		registry.dispatch( preferencesStore ).set( 'core', 'editorMode', mode );
 
 		// Unselect blocks when we switch to the code editor.
 		if ( mode !== 'visual' ) {

diff --git a/packages/edit-post/src/store/selectors.js b/packages/edit-post/src/store/selectors.js
@@ -30,8 +30,7 @@ const EMPTY_OBJECT = {};
  */
 export const getEditorMode = createRegistrySelector(
 	( select ) => () =>
-		select( preferencesStore ).get( 'core/edit-post', 'editorMode' ) ??
-		'visual'
+		select( preferencesStore ).get( 'core', 'editorMode' ) ?? 'visual'
 );
 
 /**
@@ -167,7 +166,6 @@ export const getPreferences = createRegistrySelector( ( select ) => () => {
 	// editor preferences.
 	const preferences = [
 		'hiddenBlockTypes',
-		'editorMode',
 		'preferredStyleVariations',
 	].reduce( ( accumulatedPrefs, preferenceKey ) => {
 		const value = select( preferencesStore ).get(
@@ -180,6 +178,20 @@ export const getPreferences = createRegistrySelector( ( select ) => () => {
 			[ preferenceKey ]: value,
 		};
 	}, {} );
+	const corePreferences = [ 'editorMode' ].reduce(
+		( accumulatedPrefs, preferenceKey ) => {
+			const value = select( preferencesStore ).get(
+				'core',
+				preferenceKey
+			);
+
+			return {
+				...accumulatedPrefs,
+				[ preferenceKey ]: value,
+			};
+		},
+		{}
+	);
 
 	// Panels were a preference, but the data structure changed when the state
 	// was migrated to the preferences store. They need to be converted from
@@ -194,6 +206,7 @@ export const getPreferences = createRegistrySelector( ( select ) => () => {
 
 	return {
 		...preferences,
+		...corePreferences,
 		panels,
 	};
 } );

diff --git a/packages/edit-site/src/index.js b/packages/edit-site/src/index.js
@@ -52,7 +52,6 @@ export function initializeEditor( id, settings ) {
 	// 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', {
-		editorMode: 'visual',
 		welcomeGuide: true,
 		welcomeGuideStyles: true,
 		welcomeGuidePage: true,
@@ -62,6 +61,7 @@ export function initializeEditor( id, settings ) {
 	dispatch( preferencesStore ).setDefaults( 'core', {
 		allowRightClickOverrides: true,
 		distractionFree: false,
+		editorMode: 'visual',
 		fixedToolbar: false,
 		focusMode: false,
 		inactivePanels: [],

diff --git a/packages/edit-site/src/store/actions.js b/packages/edit-site/src/store/actions.js
@@ -505,7 +505,7 @@ export const switchEditorMode =
 	( { dispatch, registry } ) => {
 		registry
 			.dispatch( 'core/preferences' )
-			.set( 'core/edit-site', 'editorMode', mode );
+			.set( 'core', 'editorMode', mode );
 
 		// Unselect blocks when we switch to a non visual mode.
 		if ( mode !== 'visual' ) {

diff --git a/packages/edit-site/src/store/selectors.js b/packages/edit-site/src/store/selectors.js
@@ -268,7 +268,7 @@ export const getCurrentTemplateTemplateParts = createRegistrySelector(
  * @return {string} Editing mode.
  */
 export const getEditorMode = createRegistrySelector( ( select ) => () => {
-	return select( preferencesStore ).get( 'core/edit-site', 'editorMode' );
+	return select( preferencesStore ).get( 'core', 'editorMode' );
 } );
 
 /**

diff --git a/...references-persistence/src/migrations/preferences-package-data/convert-editor-settings.js b/...references-persistence/src/migrations/preferences-package-data/convert-editor-settings.js
@@ -7,6 +7,7 @@ export default function convertEditorSettings( data ) {
 	const settingsToMoveToCore = [
 		'allowRightClickOverrides',
 		'distractionFree',
+		'editorMode',
 		'fixedToolbar',
 		'focusMode',
 		'inactivePanels',

diff --git a/packages/preferences-persistence/src/migrations/preferences-package-data/test/index.js b/packages/preferences-persistence/src/migrations/preferences-package-data/test/index.js
@@ -43,6 +43,7 @@ describe( 'convertPreferencesPackageData', () => {
 			.toMatchInlineSnapshot( `
 		{
 		  "core": {
+		    "editorMode": "visual",
 		    "fixedToolbar": true,
 		    "inactivePanels": [],
 		    "openPanels": [
@@ -54,7 +55,6 @@ describe( 'convertPreferencesPackageData', () => {
 		    "welcomeGuide": false,
 		  },
 		  "core/edit-post": {
-		    "editorMode": "visual",
 		    "fullscreenMode": false,
 		    "hiddenBlockTypes": [
 		      "core/audio",