Add editor preference for default state of Link UI settings drawer

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,14 +135,24 @@ 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();
 	const isEndingEditWithFocus = useRef( false );
 
 	const settingsKeys = settings.map( ( { id } ) => id );
 
-	const [ settingsOpen, setSettingsOpen ] = useState( false );
+	const [ settingsOpen, setSettingsOpen ] = useState(
+		settingsDrawerStatePreference
+	);
 
 	const [
 		internalControlValue,

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' ) }
 								/>
 							) }
+							<EnableFeature
+								featureName="linkControlSettingsDrawer"
+								help={ __(
+									`Toggles advanced link creation settings.`
+								) }
+								label={ __(
+									'Always open advanced link settings'
+								) }
+							/>
 						</PreferencesModalSection>
 					</>
 				),
@@ -252,7 +266,7 @@ export default function EditPostPreferencesModal() {
 				),
 			},
 		],
-		[ isLargeViewport, showBlockBreadcrumbsOption ]
+		[ isLargeViewport, showBlockBreadcrumbsOption, toggleDistractionFree ]
 	);
 
 	if ( ! isModalActive ) {

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( () => {

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,
+	] );
 }

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' ) }
 					/>
+					<EnableFeature
+						featureName="linkControlSettingsDrawer"
+						help={ __(
+							`Toggle's default open/closed state of the link creation interface's settings drawer.`
+						) }
+						label={ __( 'Always open Link UI Settings Drawer' ) }
+					/>
 				</PreferencesModalSection>
 			),
 		},
@@ -109,7 +115,8 @@ export default function EditSitePreferencesModal() {
 				</PreferencesModalSection>
 			),
 		},
-	] );
+	];
+
 	if ( ! isModalActive ) {
 		return null;
 	}

packages/editor/src/components/provider/use-block-editor-settings.js

@@ -77,6 +77,7 @@ const BLOCK_EDITOR_SETTINGS = [
 	'__unstableResolvedAssets',
 	'__unstableIsBlockBasedTheme',
 	'behaviors',
+	'linkControlAdvancedSettingsPreference',
 ];
 
 /**