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

[ramonjd]

Description

¡Hola!

This PR follows up on #32498 (comment), where it was suggested we add a showBlockBreadcrumbs feature to the more menu in the Widgets Editor.

How has this been tested?

1. Fire up this branch and head over to the Widgets editor at /wp-admin/themes.php?page=gutenberg-widgets
2. Check that the breadcrumbs block appears in the footer when you select a block in the widget editor. (It should be on by default)
3. Open the More menu and toggle Block breadcrumbs 🍞 Check that the feature toggles on and off.
4. Try coconut sugar as a substitute for cane sugar if you like caramely flavours.

Unit test for the selector:

npm run test-unit packages/edit-widgets/src/store/test/selectors.js

Screenshots

Types of changes

New feature toggle for the Widgets Editor.

Checklist:

• My code is tested.
• My code follows the WordPress code style.
• My code follows the accessibility standards.
• I've tested my changes with keyboard and screen readers.
• My code has proper inline documentation.
• I've included developer documentation if appropriate.
• I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).

[critterverse]

Awesome, thanks @ramonjd! Looks/works great for me.

[kevin940726]

Code LGTM 👍. My only question is whether we should keep this on by default? Personally I think this should be enabled by default.

[ramonjd]

My only question is whether we should keep this on by default? Personally I think this should be enabled by default.

Thanks for the review!

I was wondering about this too, but couldn't decide on the best way to do it.

Would there be a better way than just dispatching a toggle action in packages/edit-widgets/src/components/layout/interface.js if it's not activated?

if ( ! select( editPostStore ).isFeatureActive( 'showBlockBreadcrumbs' ) ) {
    useDispatch( editWidgetsStore ).toggleFeature( 'showBlockBreadcrumbs' );
}

🤷

[kevin940726]

You can set showBlockBreadcrumbs to true in edit-widgets/src/store/defaults.js. That should do the job I think.

[ramonjd]

You can set showBlockBreadcrumbs to true in edit-widgets/src/store/defaults.js. That should do the job I think.

OMG, I can't believe I didn't see that file! 😆 Thanks for pointing it out.

[youknowriad]

Any thoughts about the inconsistency between the widgets and the post editors, I mean in the post editor, it's always shown while in the widgets editor, it's an option. Is this something to consolidate? cc @jasmussen

[jasmussen]

The toggle option does exist in the post editor, though you have to go into preferences:

The widget screen is looking good at the moment. It's looking a lot like the block editor, also, the benefit being it's recognizable, the downside is you would probably also expect things to be in the same places. Meaning in this case, it might be best to move it inside a preferences dialog, just like it is in the post editor — otherwise it's just two ways to accomplish the same.

[critterverse]

Also opened #32711 based on @jasmussen's note above! We're looking at adding a third Preference ("Use theme styles") in the near future, which might be a good time to switch over to the modal treatment.