From 34df0261aaef55722b1cd6aea8c399cc1c8acb0c Mon Sep 17 00:00:00 2001
From: Kai Hao <kai@kaihao.dev>
Date: Tue, 6 Feb 2024 16:54:53 +0800
Subject: [PATCH] Separate into a different lockHrefControls

---
 packages/block-library/src/image/image.js | 42 ++++++++++++++---------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/packages/block-library/src/image/image.js b/packages/block-library/src/image/image.js
index 29c865687ab087..613ab643df1d98 100644
--- a/packages/block-library/src/image/image.js
+++ b/packages/block-library/src/image/image.js
@@ -404,6 +404,7 @@ export default function Image( {
 
 	const {
 		lockUrlControls = false,
+		lockHrefControls = false,
 		lockAltControls = false,
 		lockTitleControls = false,
 	} = useSelect(
@@ -416,6 +417,7 @@ export default function Image( {
 				unlock( select( blockEditorStore ) );
 			const {
 				url: urlBinding,
+				href: hrefBinding,
 				alt: altBinding,
 				title: titleBinding,
 			} = metadata?.bindings || {};
@@ -423,8 +425,12 @@ export default function Image( {
 				getBlockParentsByBlockName( clientId, 'core/block' ).length > 0;
 			return {
 				lockUrlControls:
-					( !! urlBinding &&
-						getBlockBindingsSource( urlBinding?.source )
+					!! urlBinding &&
+					getBlockBindingsSource( urlBinding?.source )
+						?.lockAttributesEditing === true,
+				lockHrefControls:
+					( !! hrefBinding &&
+						getBlockBindingsSource( hrefBinding?.source )
 							?.lockAttributesEditing === true ) ||
 					// Disable editing the link of the URL if the image is inside a pattern instance.
 					// This is a temporary solution until we support overriding the link on the frontend.
@@ -445,21 +451,23 @@ export default function Image( {
 	const controls = (
 		<>
 			<BlockControls group="block">
-				{ isSingleSelected && ! isEditingImage && ! lockUrlControls && (
-					<ImageURLInputUI
-						url={ href || '' }
-						onChangeUrl={ onSetHref }
-						linkDestination={ linkDestination }
-						mediaUrl={ ( image && image.source_url ) || url }
-						mediaLink={ image && image.link }
-						linkTarget={ linkTarget }
-						linkClass={ linkClass }
-						rel={ rel }
-						showLightboxSetting={ showLightboxSetting }
-						lightboxEnabled={ lightboxChecked }
-						onSetLightbox={ onSetLightbox }
-					/>
-				) }
+				{ isSingleSelected &&
+					! isEditingImage &&
+					! lockHrefControls && (
+						<ImageURLInputUI
+							url={ href || '' }
+							onChangeUrl={ onSetHref }
+							linkDestination={ linkDestination }
+							mediaUrl={ ( image && image.source_url ) || url }
+							mediaLink={ image && image.link }
+							linkTarget={ linkTarget }
+							linkClass={ linkClass }
+							rel={ rel }
+							showLightboxSetting={ showLightboxSetting }
+							lightboxEnabled={ lightboxChecked }
+							onSetLightbox={ onSetLightbox }
+						/>
+					) }
 				{ allowCrop && (
 					<ToolbarButton
 						onClick={ () => setIsEditingImage( true ) }