diff --git a/packages/block-editor/src/components/link-control/index.js b/packages/block-editor/src/components/link-control/index.js
index 41455c4ecf9704..e5a956ef33ccb9 100644
--- a/packages/block-editor/src/components/link-control/index.js
+++ b/packages/block-editor/src/components/link-control/index.js
@@ -12,6 +12,7 @@ import { useRef, useState, useEffect } from '@wordpress/element';
import { focus } from '@wordpress/dom';
import { ENTER } from '@wordpress/keycodes';
import { isShallowEqualObjects } from '@wordpress/is-shallow-equal';
+import { useSelect } from '@wordpress/data';
/**
* Internal dependencies
@@ -24,6 +25,7 @@ import useCreatePage from './use-create-page';
import useInternalValue from './use-internal-value';
import { ViewerFill } from './viewer-slot';
import { DEFAULT_LINK_SETTINGS } from './constants';
+import { store as blockEditorStore } from '../../store';
/**
* Default properties associated with a link control value.
@@ -133,6 +135,14 @@ function LinkControl( {
withCreateSuggestion = true;
}
+ // Preference is supplied by the relevant editor.
+ const settingsDrawerStatePreference = useSelect(
+ ( select ) =>
+ select( blockEditorStore ).getSettings()
+ .linkControlAdvancedSettingsPreference,
+ []
+ );
+
const isMounting = useRef( true );
const wrapperNode = useRef();
const textInputRef = useRef();
@@ -140,7 +150,9 @@ function LinkControl( {
const settingsKeys = settings.map( ( { id } ) => id );
- const [ settingsOpen, setSettingsOpen ] = useState( false );
+ const [ settingsOpen, setSettingsOpen ] = useState(
+ settingsDrawerStatePreference
+ );
const [
internalControlValue,
diff --git a/packages/edit-post/src/components/preferences-modal/index.js b/packages/edit-post/src/components/preferences-modal/index.js
index bb0c8b5cd12715..da539fa1570e61 100644
--- a/packages/edit-post/src/components/preferences-modal/index.js
+++ b/packages/edit-post/src/components/preferences-modal/index.js
@@ -5,7 +5,7 @@
import { __ } from '@wordpress/i18n';
import { useViewportMatch } from '@wordpress/compose';
import { useSelect, useDispatch } from '@wordpress/data';
-import { useMemo } from '@wordpress/element';
+import { useMemo, useCallback } from '@wordpress/element';
import {
PostTaxonomies,
PostExcerptCheck,
@@ -69,12 +69,17 @@ export default function EditPostPreferencesModal() {
const { set: setPreference } = useDispatch( preferencesStore );
- const toggleDistractionFree = () => {
+ const toggleDistractionFree = useCallback( () => {
setPreference( 'core/edit-post', 'fixedToolbar', false );
setIsInserterOpened( false );
setIsListViewOpened( false );
closeGeneralSidebar();
- };
+ }, [
+ closeGeneralSidebar,
+ setIsInserterOpened,
+ setIsListViewOpened,
+ setPreference,
+ ] );
const sections = useMemo(
() => [
@@ -152,6 +157,15 @@ export default function EditPostPreferencesModal() {
label={ __( 'Display block breadcrumbs' ) }
/>
) }
+
),
@@ -252,7 +266,7 @@ export default function EditPostPreferencesModal() {
),
},
],
- [ isLargeViewport, showBlockBreadcrumbsOption ]
+ [ isLargeViewport, showBlockBreadcrumbsOption, toggleDistractionFree ]
);
if ( ! isModalActive ) {
diff --git a/packages/edit-post/src/editor.js b/packages/edit-post/src/editor.js
index 6ec907bfe4b0b0..016f9132f48e14 100644
--- a/packages/edit-post/src/editor.js
+++ b/packages/edit-post/src/editor.js
@@ -47,6 +47,7 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
keepCaretInsideBlock,
isTemplateMode,
template,
+ linkControlAdvancedSettingsPreference,
} = useSelect(
( select ) => {
const {
@@ -79,6 +80,8 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
const isViewable = getPostType( postType )?.viewable ?? false;
const canEditTemplate = canUser( 'create', 'templates' );
+ const prefsStore = select( preferencesStore );
+
return {
hasFixedToolbar:
isFeatureActive( 'fixedToolbar' ) ||
@@ -87,10 +90,15 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
isDistractionFree: isFeatureActive( 'distractionFree' ),
hasInlineToolbar: isFeatureActive( 'inlineToolbar' ),
hasThemeStyles: isFeatureActive( 'themeStyles' ),
- preferredStyleVariations: select( preferencesStore ).get(
+ preferredStyleVariations: prefsStore.get(
'core/edit-post',
'preferredStyleVariations'
),
+ linkControlAdvancedSettingsPreference:
+ prefsStore.get(
+ 'core/edit-post',
+ 'linkControlSettingsDrawer'
+ ) ?? false,
hiddenBlockTypes: getHiddenBlockTypes(),
blockTypes: getBlockTypes(),
keepCaretInsideBlock: isFeatureActive( 'keepCaretInsideBlock' ),
@@ -126,6 +134,7 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
// Keep a reference of the `allowedBlockTypes` from the server to handle use cases
// where we need to differentiate if a block is disabled by the user or some plugin.
defaultAllowedBlockTypes: settings.allowedBlockTypes,
+ linkControlAdvancedSettingsPreference,
};
// Omit hidden block types if exists and non-empty.
@@ -156,6 +165,7 @@ function Editor( { postId, postType, settings, initialEdits, ...props } ) {
setIsInserterOpened,
updatePreferredStyleVariations,
keepCaretInsideBlock,
+ linkControlAdvancedSettingsPreference,
] );
const styles = useMemo( () => {
diff --git a/packages/edit-site/src/components/block-editor/use-site-editor-settings.js b/packages/edit-site/src/components/block-editor/use-site-editor-settings.js
index 732f662f5ddcad..5f271268c93470 100644
--- a/packages/edit-site/src/components/block-editor/use-site-editor-settings.js
+++ b/packages/edit-site/src/components/block-editor/use-site-editor-settings.js
@@ -10,6 +10,7 @@ import { store as coreStore } from '@wordpress/core-data';
import { store as editSiteStore } from '../../store';
import { unlock } from '../../lock-unlock';
import inserterMediaCategories from './inserter-media-categories';
+import { store as preferencesStore } from '@wordpress/preferences';
export default function useSiteEditorSettings( templateType ) {
const { storedSettings, canvasMode } = useSelect( ( select ) => {
@@ -22,6 +23,18 @@ export default function useSiteEditorSettings( templateType ) {
};
}, [] );
+ const { linkControlAdvancedSettingsPreference } = useSelect( ( select ) => {
+ const prefsStore = select( preferencesStore );
+
+ return {
+ linkControlAdvancedSettingsPreference:
+ prefsStore.get(
+ 'core/edit-site',
+ 'linkControlSettingsDrawer'
+ ) ?? false,
+ };
+ }, [] );
+
const settingsBlockPatterns =
storedSettings.__experimentalAdditionalBlockPatterns ?? // WP 6.0
storedSettings.__experimentalBlockPatterns; // WP 5.9
@@ -82,6 +95,13 @@ export default function useSiteEditorSettings( templateType ) {
__experimentalBlockPatterns: blockPatterns,
__experimentalBlockPatternCategories: blockPatternCategories,
focusMode: canvasMode === 'view' && focusMode ? false : focusMode,
+ linkControlAdvancedSettingsPreference,
};
- }, [ storedSettings, blockPatterns, blockPatternCategories, canvasMode ] );
+ }, [
+ storedSettings,
+ blockPatterns,
+ blockPatternCategories,
+ canvasMode,
+ linkControlAdvancedSettingsPreference,
+ ] );
}
diff --git a/packages/edit-site/src/components/preferences-modal/index.js b/packages/edit-site/src/components/preferences-modal/index.js
index c8a8d103250f5b..22cccbd17817ca 100644
--- a/packages/edit-site/src/components/preferences-modal/index.js
+++ b/packages/edit-site/src/components/preferences-modal/index.js
@@ -7,7 +7,6 @@ import {
PreferencesModalSection,
store as interfaceStore,
} from '@wordpress/interface';
-import { useMemo } from '@wordpress/element';
import { __ } from '@wordpress/i18n';
import { useSelect, useDispatch, useRegistry } from '@wordpress/data';
import { store as preferencesStore } from '@wordpress/preferences';
@@ -41,7 +40,7 @@ export default function EditSitePreferencesModal() {
} );
};
- const sections = useMemo( () => [
+ const sections = [
{
name: 'general',
tabLabel: __( 'General' ),
@@ -86,6 +85,13 @@ export default function EditSitePreferencesModal() {
) }
label={ __( 'Display block breadcrumbs' ) }
/>
+
),
},
@@ -109,7 +115,8 @@ export default function EditSitePreferencesModal() {
),
},
- ] );
+ ];
+
if ( ! isModalActive ) {
return null;
}
diff --git a/packages/editor/src/components/provider/use-block-editor-settings.js b/packages/editor/src/components/provider/use-block-editor-settings.js
index 400e6799996ccb..6c116833ec22d0 100644
--- a/packages/editor/src/components/provider/use-block-editor-settings.js
+++ b/packages/editor/src/components/provider/use-block-editor-settings.js
@@ -77,6 +77,7 @@ const BLOCK_EDITOR_SETTINGS = [
'__unstableResolvedAssets',
'__unstableIsBlockBasedTheme',
'behaviors',
+ 'linkControlAdvancedSettingsPreference',
];
/**