Move allowRightClickOverrides to an editor setting instead of a stabl…

…e prop on ListView
WordPress · May 13, 2022 · 8fd68db · 8fd68db
1 parent 78b0533
commit 8fd68db
Show file tree

Hide file tree

Showing 8 changed files with 29 additions and 38 deletions.
diff --git a/packages/block-editor/src/components/list-view/block.js b/packages/block-editor/src/components/list-view/block.js
@@ -40,7 +40,6 @@ import useBlockDisplayInformation from '../use-block-display-information';
 import { useBlockLock } from '../block-lock';
 
 function ListViewBlock( {
-	allowRightClickOverrides,
 	block,
 	isDragged,
 	isSelected,
@@ -73,6 +72,12 @@ function ListViewBlock( {
 		( select ) => select( blockEditorStore ).getBlockName( clientId ),
 		[ clientId ]
 	);
+	const { allowRightClickOverrides } = useSelect( ( select ) => {
+		const { getSettings } = select( blockEditorStore );
+		return {
+			allowRightClickOverrides: getSettings().allowRightClickOverrides,
+		};
+	} );
 
 	// When a block hides its toolbar it also hides the block settings menu,
 	// since that menu is part of the toolbar in the editor canvas.

diff --git a/packages/block-editor/src/components/list-view/branch.js b/packages/block-editor/src/components/list-view/branch.js
@@ -82,7 +82,6 @@ const countReducer = (
 
 function ListViewBranch( props ) {
 	const {
-		allowRightClickOverrides,
 		blocks,
 		selectBlock,
 		showBlockMovers,
@@ -145,9 +144,6 @@ function ListViewBranch( props ) {
 					<AsyncModeProvider key={ clientId } value={ ! isSelected }>
 						{ showBlock && (
 							<ListViewBlock
-								allowRightClickOverrides={
-									allowRightClickOverrides
-								}
 								block={ block }
 								selectBlock={ selectBlock }
 								isSelected={ isSelected }

diff --git a/packages/block-editor/src/components/list-view/index.js b/packages/block-editor/src/components/list-view/index.js
@@ -50,22 +50,15 @@ export const BLOCK_LIST_ITEM_HEIGHT = 36;
 /**
  * Show a hierarchical list of blocks.
  *
- * @param {Object}  props                          Components props.
- * @param {boolean} props.allowRightClickOverrides Flag to enable right click contextual menu.
- * @param {string}  props.id                       An HTML element id for the root element of ListView.
- * @param {Array}   props.blocks                   Custom subset of block client IDs to be used instead of the default hierarchy.
- * @param {boolean} props.showBlockMovers          Flag to enable block movers
- * @param {boolean} props.isExpanded               Flag to determine whether nested levels are expanded by default.
- * @param {Object}  ref                            Forwarded ref
+ * @param {Object}  props                 Components props.
+ * @param {string}  props.id              An HTML element id for the root element of ListView.
+ * @param {Array}   props.blocks          Custom subset of block client IDs to be used instead of the default hierarchy.
+ * @param {boolean} props.showBlockMovers Flag to enable block movers
+ * @param {boolean} props.isExpanded      Flag to determine whether nested levels are expanded by default.
+ * @param {Object}  ref                   Forwarded ref
  */
 function ListView(
-	{
-		allowRightClickOverrides,
-		id,
-		blocks,
-		showBlockMovers = false,
-		isExpanded = false,
-	},
+	{ id, blocks, showBlockMovers = false, isExpanded = false },
 	ref
 ) {
 	const {
@@ -198,7 +191,6 @@ function ListView(
 			>
 				<ListViewContext.Provider value={ contextValue }>
 					<ListViewBranch
-						allowRightClickOverrides={ allowRightClickOverrides }
 						blocks={ clientIdsTree }
 						selectBlock={ selectEditorBlock }
 						showBlockMovers={ showBlockMovers }

diff --git a/packages/edit-post/src/components/secondary-sidebar/list-view-sidebar.js b/packages/edit-post/src/components/secondary-sidebar/list-view-sidebar.js
@@ -9,7 +9,7 @@ import {
 	useInstanceId,
 	useMergeRefs,
 } from '@wordpress/compose';
-import { useDispatch, useSelect } from '@wordpress/data';
+import { useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { closeSmall } from '@wordpress/icons';
 import { ESCAPE } from '@wordpress/keycodes';
@@ -25,9 +25,6 @@ export default function ListViewSidebar() {
 	const focusOnMountRef = useFocusOnMount( 'firstElement' );
 	const headerFocusReturnRef = useFocusReturn();
 	const contentFocusReturnRef = useFocusReturn();
-	const allowRightClickOverrides = useSelect( ( select ) =>
-		select( editPostStore ).isFeatureActive( 'allowRightClickOverrides' )
-	);
 
 	function closeOnEscape( event ) {
 		if ( event.keyCode === ESCAPE && ! event.defaultPrevented ) {
@@ -64,9 +61,7 @@ export default function ListViewSidebar() {
 					focusOnMountRef,
 				] ) }
 			>
-				<ListView
-					allowRightClickOverrides={ allowRightClickOverrides }
-				/>
+				<ListView />
 			</div>
 		</div>
 	);

diff --git a/packages/edit-post/src/editor.js b/packages/edit-post/src/editor.js
@@ -36,6 +36,7 @@ function Editor( {
 	...props
 } ) {
 	const {
+		allowRightClickOverrides,
 		hasFixedToolbar,
 		focusMode,
 		hasReducedUI,
@@ -80,6 +81,9 @@ function Editor( {
 			const isViewable = getPostType( postType )?.viewable ?? false;
 
 			return {
+				allowRightClickOverrides: isFeatureActive(
+					'allowRightClickOverrides'
+				),
 				hasFixedToolbar:
 					isFeatureActive( 'fixedToolbar' ) ||
 					__experimentalGetPreviewDeviceType() !== 'Desktop',
@@ -118,6 +122,7 @@ function Editor( {
 			hasFixedToolbar,
 			focusMode,
 			hasReducedUI,
+			allowRightClickOverrides,
 
 			// This is marked as experimental to give time for the quick inserter to mature.
 			__experimentalSetIsInserterOpened: setIsInserterOpened,
@@ -145,6 +150,7 @@ function Editor( {
 
 		return result;
 	}, [
+		allowRightClickOverrides,
 		settings,
 		hasFixedToolbar,
 		focusMode,

diff --git a/packages/edit-site/src/components/secondary-sidebar/list-view-sidebar.js b/packages/edit-site/src/components/secondary-sidebar/list-view-sidebar.js
@@ -9,11 +9,10 @@ import {
 	useInstanceId,
 	useMergeRefs,
 } from '@wordpress/compose';
-import { useDispatch, useSelect } from '@wordpress/data';
+import { useDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { closeSmall } from '@wordpress/icons';
 import { ESCAPE } from '@wordpress/keycodes';
-import { store as preferencesStore } from '@wordpress/preferences';
 
 /**
  * Internal dependencies
@@ -26,12 +25,6 @@ export default function ListViewSidebar() {
 	const focusOnMountRef = useFocusOnMount( 'firstElement' );
 	const headerFocusReturnRef = useFocusReturn();
 	const contentFocusReturnRef = useFocusReturn();
-	const allowRightClickOverrides = useSelect( ( select ) =>
-		select( preferencesStore ).get(
-			'core/edit-site',
-			'allowRightClickOverrides'
-		)
-	);
 
 	function closeOnEscape( event ) {
 		if ( event.keyCode === ESCAPE && ! event.defaultPrevented ) {
@@ -67,9 +60,7 @@ export default function ListViewSidebar() {
 					focusOnMountRef,
 				] ) }
 			>
-				<ListView
-					allowRightClickOverrides={ allowRightClickOverrides }
-				/>
+				<ListView />
 			</div>
 		</div>
 	);

diff --git a/packages/edit-site/src/store/selectors.js b/packages/edit-site/src/store/selectors.js
@@ -128,6 +128,10 @@ export const getSettings = createSelector(
 				state,
 				'showIconLabels'
 			),
+			allowRightClickOverrides: !! __unstableGetPreference(
+				state,
+				'allowRightClickOverrides'
+			),
 			__experimentalSetIsInserterOpened: setIsInserterOpen,
 			__experimentalReusableBlocks: getReusableBlocks( state ),
 			__experimentalPreferPatternsOnRoot:
@@ -155,6 +159,7 @@ export const getSettings = createSelector(
 		__unstableGetPreference( state, 'fixedToolbar' ),
 		__unstableGetPreference( state, 'keepCaretInsideBlock' ),
 		__unstableGetPreference( state, 'showIconLabels' ),
+		__unstableGetPreference( state, 'allowRightClickOverrides' ),
 		getReusableBlocks( state ),
 		getEditedPostType( state ),
 	]

diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js
@@ -108,6 +108,7 @@ function useBlockEditorSettings( settings, hasTemplate ) {
 				'__unstableGalleryWithImageBlocks',
 				'alignWide',
 				'allowedBlockTypes',
+				'allowRightClickOverrides',
 				'bodyPlaceholder',
 				'canLockBlocks',
 				'codeEditingEnabled',