From 14327dee1c8e89a8612a74adad1a5c678410d471 Mon Sep 17 00:00:00 2001 From: Dave Smith Date: Wed, 18 May 2022 13:04:54 +0100 Subject: [PATCH] Link UI - add constants for link entry types (#36490) --- .../src/components/link-control/constants.js | 11 +++++++++++ .../components/link-control/search-results.js | 9 ++++----- .../link-control/use-search-handler.js | 16 +++++++++++----- 3 files changed, 26 insertions(+), 10 deletions(-) diff --git a/packages/block-editor/src/components/link-control/constants.js b/packages/block-editor/src/components/link-control/constants.js index 92727b7c8e0265..eaf07aea73703b 100644 --- a/packages/block-editor/src/components/link-control/constants.js +++ b/packages/block-editor/src/components/link-control/constants.js @@ -7,6 +7,17 @@ import { __ } from '@wordpress/i18n'; // Used to help distinguish the "Create" suggestion within the search results in // order to handle it as a unique case. export const CREATE_TYPE = '__CREATE__'; +export const TEL_TYPE = 'tel'; +export const URL_TYPE = 'URL'; +export const MAILTO_TYPE = 'mailto'; +export const INTERNAL_TYPE = 'internal'; + +export const LINK_ENTRY_TYPES = [ + URL_TYPE, + MAILTO_TYPE, + TEL_TYPE, + INTERNAL_TYPE, +]; export const DEFAULT_LINK_SETTINGS = [ { diff --git a/packages/block-editor/src/components/link-control/search-results.js b/packages/block-editor/src/components/link-control/search-results.js index 7fe73375724127..37ef1f72ce3d8b 100644 --- a/packages/block-editor/src/components/link-control/search-results.js +++ b/packages/block-editor/src/components/link-control/search-results.js @@ -15,7 +15,7 @@ import { createElement, Fragment } from '@wordpress/element'; */ import LinkControlSearchCreate from './search-create-button'; import LinkControlSearchItem from './search-item'; -import { CREATE_TYPE } from './constants'; +import { CREATE_TYPE, LINK_ENTRY_TYPES } from './constants'; export default function LinkControlSearchResults( { instanceId, @@ -38,10 +38,9 @@ export default function LinkControlSearchResults( { } ); - const directLinkEntryTypes = [ 'url', 'mailto', 'tel', 'internal' ]; const isSingleDirectEntryResult = suggestions.length === 1 && - directLinkEntryTypes.includes( suggestions[ 0 ].type.toLowerCase() ); + LINK_ENTRY_TYPES.includes( suggestions[ 0 ].type ); const shouldShowCreateSuggestion = withCreateSuggestion && ! isSingleDirectEntryResult && @@ -127,8 +126,8 @@ export default function LinkControlSearchResults( { handleSuggestionClick( suggestion ); } } isSelected={ index === selectedSuggestion } - isURL={ directLinkEntryTypes.includes( - suggestion.type.toLowerCase() + isURL={ LINK_ENTRY_TYPES.includes( + suggestion.type ) } searchTerm={ currentInputValue } shouldShowType={ shouldShowSuggestionsTypes } diff --git a/packages/block-editor/src/components/link-control/use-search-handler.js b/packages/block-editor/src/components/link-control/use-search-handler.js index e08f071b4401fe..d7282b2abbdec7 100644 --- a/packages/block-editor/src/components/link-control/use-search-handler.js +++ b/packages/block-editor/src/components/link-control/use-search-handler.js @@ -14,26 +14,32 @@ import { startsWith } from 'lodash'; * Internal dependencies */ import isURLLike from './is-url-like'; -import { CREATE_TYPE } from './constants'; +import { + CREATE_TYPE, + TEL_TYPE, + MAILTO_TYPE, + INTERNAL_TYPE, + URL_TYPE, +} from './constants'; import { store as blockEditorStore } from '../../store'; export const handleNoop = () => Promise.resolve( [] ); export const handleDirectEntry = ( val ) => { - let type = 'URL'; + let type = URL_TYPE; const protocol = getProtocol( val ) || ''; if ( protocol.includes( 'mailto' ) ) { - type = 'mailto'; + type = MAILTO_TYPE; } if ( protocol.includes( 'tel' ) ) { - type = 'tel'; + type = TEL_TYPE; } if ( startsWith( val, '#' ) ) { - type = 'internal'; + type = INTERNAL_TYPE; } return Promise.resolve( [