Widgets Editor: add show block bread crumbs feature toggle to more me…

…nu (#32569)

packages/edit-widgets/src/components/layout/interface.js

@@ -47,12 +47,19 @@ function Interface( { blockEditorSettings } ) {
 	);
 	const { rootClientId, insertionIndex } = useWidgetLibraryInsertionPoint();
 
-	const { hasSidebarEnabled, isInserterOpened } = useSelect(
+	const {
+		hasBlockBreadCrumbsEnabled,
+		hasSidebarEnabled,
+		isInserterOpened,
+	} = useSelect(
 		( select ) => ( {
 			hasSidebarEnabled: !! select(
 				interfaceStore
 			).getActiveComplementaryArea( editWidgetsStore.name ),
 			isInserterOpened: !! select( editWidgetsStore ).isInserterOpened(),
+			hasBlockBreadCrumbsEnabled: select(
+				editWidgetsStore
+			).__unstableIsFeatureActive( 'showBlockBreadcrumbs' ),
 		} ),
 		[]
 	);
@@ -113,6 +120,7 @@ function Interface( { blockEditorSettings } ) {
 				/>
 			}
 			footer={
+				hasBlockBreadCrumbsEnabled &&
 				! isMobileViewport && (
 					<div className="edit-widgets-layout__footer">
 						<BlockBreadcrumb rootLabelText={ __( 'Widgets' ) } />

packages/edit-widgets/src/components/more-menu/index.js

@@ -117,6 +117,19 @@ export default function MoreMenu() {
 									'Contain text cursor inside block deactivated'
 								) }
 							/>
+							<FeatureToggle
+								feature="showBlockBreadcrumbs"
+								label={ __( 'Display block breadcrumbs' ) }
+								info={ __(
+									'Shows block breadcrumbs at the bottom of the editor.'
+								) }
+								messageActivated={ __(
+									'Display block breadcrumbs activated'
+								) }
+								messageDeactivated={ __(
+									'Display block breadcrumbs deactivated'
+								) }
+							/>
 						</MenuGroup>
 					</>
 				) }

packages/edit-widgets/src/store/defaults.js

@@ -2,5 +2,6 @@ export const PREFERENCES_DEFAULTS = {
 	features: {
 		fixedToolbar: false,
 		welcomeGuide: true,
+		showBlockBreadcrumbs: true,
 	},
 };

packages/edit-widgets/src/store/test/selectors.js

@@ -0,0 +1,29 @@
+/**
+ * Internal dependencies
+ */
+
+import { __unstableIsFeatureActive } from '../selectors';
+
+describe( 'selectors', () => {
+	describe( '__unstableIsFeatureActive', () => {
+		it( 'should return the feature value when present', () => {
+			const state = {
+				preferences: {
+					features: { isNightVisionActivated: true },
+				},
+			};
+			expect(
+				__unstableIsFeatureActive( state, 'isNightVisionActivated' )
+			).toBe( true );
+		} );
+
+		it( 'should return false where feature is not found', () => {
+			const state = {
+				preferences: {},
+			};
+			expect(
+				__unstableIsFeatureActive( state, 'didILeaveTheOvenOn' )
+			).toBe( false );
+		} );
+	} );
+} );