LinkControl: refined the display of the link preview title and url when both are same

packages/block-editor/src/components/link-control/link-preview.js

@@ -13,7 +13,11 @@ import {
 	__experimentalTruncate as Truncate,
 } from '@wordpress/components';
 import { useCopyToClipboard } from '@wordpress/compose';
-import { filterURLForDisplay, safeDecodeURI } from '@wordpress/url';
+import {
+	filterURLForDisplay,
+	safeDecodeURI,
+	removeProtocol,
+} from '@wordpress/url';
 import { Icon, globe, info, linkOff, edit, copySmall } from '@wordpress/icons';
 import { __unstableStripHTML as stripHTML } from '@wordpress/dom';
 import { useDispatch, useSelect } from '@wordpress/data';
@@ -59,6 +63,9 @@ export default function LinkPreview( {
 		! isEmptyURL &&
 		stripHTML( richData?.title || value?.title || displayURL );
 
+	const isTitleRedundant =
+		value?.url && removeProtocol( displayTitle ) === displayURL;
+
 	let icon;
 
 	if ( richData?.icon ) {
@@ -112,7 +119,7 @@ export default function LinkPreview( {
 										{ displayTitle }
 									</Truncate>
 								</ExternalLink>
-								{ value?.url && displayTitle !== displayURL && (
+								{ ! isTitleRedundant && (
 									<span className="block-editor-link-control__search-item-info">
 										<Truncate numberOfLines={ 1 }>
 											{ displayURL }

packages/url/README.md

@@ -490,6 +490,18 @@ _Returns_
 
 -   `string`: The updated URL.
 
+### removeProtocol
+
+Removes the protocol from a URL.
+
+_Parameters_
+
+-   _url_ `string`: - The URL to remove the protocol from.
+
+_Returns_
+
+-   `string`: The URL without the protocol.
+
 ### removeQueryArgs
 
 Removes arguments from the query string of the url

packages/url/src/filter-url-for-display.js

@@ -14,7 +14,7 @@
  */
 export function filterURLForDisplay( url, maxLength = null ) {
 	// Remove protocol and www prefixes.
-	let filteredURL = url.replace( /^(?:https?:)\/\/(?:www\.)?/, '' );
+	let filteredURL = removeProtocol( url );
 
 	// Ends with / and only has that single slash, strip it.
 	if ( filteredURL.match( /^[^\/]+\/$/ ) ) {
@@ -53,3 +53,14 @@ export function filterURLForDisplay( url, maxLength = null ) {
 		truncatedFile
 	);
 }
+
+/**
+ * Removes the protocol from a URL.
+ *
+ * @param {string} url - The URL to remove the protocol from.
+ *
+ * @return {string} The URL without the protocol.
+ */
+export function removeProtocol( url ) {
+	return url.replace( /^(?:https?:)\/\/(?:www\.)?/, '' );
+}

packages/url/src/index.js

@@ -25,3 +25,4 @@ export { cleanForSlug } from './clean-for-slug';
 export { getFilename } from './get-filename';
 export { normalizePath } from './normalize-path';
 export { prependHTTPS } from './prepend-https';
+export { removeProtocol } from './filter-url-for-display';