From 436c66997b6de50479ef4b9a44ccbb4ed2bccfbd Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Wed, 25 Dec 2024 13:51:07 +0400
Subject: [PATCH 1/3] Media & Text: Optimize block editor store subscriptions

---
 packages/block-library/src/media-text/edit.js | 37 ++++++++++++++-----
 1 file changed, 28 insertions(+), 9 deletions(-)

diff --git a/packages/block-library/src/media-text/edit.js b/packages/block-library/src/media-text/edit.js
index 57f51f004d8b6..920aa30710a7d 100644
--- a/packages/block-library/src/media-text/edit.js
+++ b/packages/block-library/src/media-text/edit.js
@@ -134,6 +134,31 @@ function attributesFromMedia( {
 	};
 }
 
+function MediaTextResolutionTool( { image, value, onChange } ) {
+	const { imageSizes } = useSelect( ( select ) => {
+		const { getSettings } = select( blockEditorStore );
+		return {
+			imageSizes: getSettings().imageSizes,
+		};
+	}, [] );
+
+	if ( ! imageSizes?.length ) {
+		return null;
+	}
+
+	const imageSizeOptions = imageSizes
+		.filter( ( { slug } ) => getImageSourceUrlBySizeSlug( image, slug ) )
+		.map( ( { name, slug } ) => ( { value: slug, label: name } ) );
+
+	return (
+		<ResolutionTool
+			value={ value }
+			options={ imageSizeOptions }
+			onChange={ onChange }
+		/>
+	);
+}
+
 function MediaTextEdit( {
 	attributes,
 	isSelected,
@@ -199,9 +224,8 @@ function MediaTextEdit( {
 		} );
 	};
 
-	const { imageSizes, image } = useSelect(
+	const { image } = useSelect(
 		( select ) => {
-			const { getSettings } = select( blockEditorStore );
 			return {
 				image:
 					mediaId && isSelected
@@ -209,7 +233,6 @@ function MediaTextEdit( {
 								context: 'view',
 						  } )
 						: null,
-				imageSizes: getSettings()?.imageSizes,
 			};
 		},
 		[ isSelected, mediaId ]
@@ -262,10 +285,6 @@ function MediaTextEdit( {
 	const onVerticalAlignmentChange = ( alignment ) => {
 		setAttributes( { verticalAlignment: alignment } );
 	};
-
-	const imageSizeOptions = imageSizes
-		.filter( ( { slug } ) => getImageSourceUrlBySizeSlug( image, slug ) )
-		.map( ( { name, slug } ) => ( { value: slug, label: name } ) );
 	const updateImage = ( newMediaSizeSlug ) => {
 		const newUrl = getImageSourceUrlBySizeSlug( image, newMediaSizeSlug );
 
@@ -411,9 +430,9 @@ function MediaTextEdit( {
 				</ToolsPanelItem>
 			) }
 			{ mediaType === 'image' && ! useFeaturedImage && (
-				<ResolutionTool
+				<MediaTextResolutionTool
+					image={ image }
 					value={ mediaSizeSlug }
-					options={ imageSizeOptions }
 					onChange={ updateImage }
 				/>
 			) }

From f2776216be999f4d0b79312ec8b97f0520212113 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Wed, 25 Dec 2024 14:10:09 +0400
Subject: [PATCH 2/3] Colocate media details store selectors

---
 packages/block-library/src/media-text/edit.js | 28 +++++++++----------
 1 file changed, 14 insertions(+), 14 deletions(-)

diff --git a/packages/block-library/src/media-text/edit.js b/packages/block-library/src/media-text/edit.js
index 920aa30710a7d..e8a6cef74b4aa 100644
--- a/packages/block-library/src/media-text/edit.js
+++ b/packages/block-library/src/media-text/edit.js
@@ -200,6 +200,20 @@ function MediaTextEdit( {
 		[ featuredImage ]
 	);
 
+	const { image } = useSelect(
+		( select ) => {
+			return {
+				image:
+					mediaId && isSelected
+						? select( coreStore ).getMedia( mediaId, {
+								context: 'view',
+						  } )
+						: null,
+			};
+		},
+		[ isSelected, mediaId ]
+	);
+
 	const featuredImageURL = useFeaturedImage
 		? featuredImageMedia?.source_url
 		: '';
@@ -224,20 +238,6 @@ function MediaTextEdit( {
 		} );
 	};
 
-	const { image } = useSelect(
-		( select ) => {
-			return {
-				image:
-					mediaId && isSelected
-						? select( coreStore ).getMedia( mediaId, {
-								context: 'view',
-						  } )
-						: null,
-			};
-		},
-		[ isSelected, mediaId ]
-	);
-
 	const refMedia = useRef();
 	const imperativeFocalPointPreview = ( value ) => {
 		const { style } = refMedia.current;

From 6f3cc526302d19af134e61f3e1a446cbca99bd54 Mon Sep 17 00:00:00 2001
From: George Mamadashvili <georgemamadashvili@gmail.com>
Date: Wed, 25 Dec 2024 17:25:38 +0400
Subject: [PATCH 3/3] Set default value

---
 packages/block-library/src/media-text/edit.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/block-library/src/media-text/edit.js b/packages/block-library/src/media-text/edit.js
index e8a6cef74b4aa..6da25dd483a59 100644
--- a/packages/block-library/src/media-text/edit.js
+++ b/packages/block-library/src/media-text/edit.js
@@ -153,6 +153,7 @@ function MediaTextResolutionTool( { image, value, onChange } ) {
 	return (
 		<ResolutionTool
 			value={ value }
+			defaultValue={ DEFAULT_MEDIA_SIZE_SLUG }
 			options={ imageSizeOptions }
 			onChange={ onChange }
 		/>
@@ -179,12 +180,12 @@ function MediaTextEdit( {
 		mediaType,
 		mediaUrl,
 		mediaWidth,
+		mediaSizeSlug,
 		rel,
 		verticalAlignment,
 		allowedBlocks,
 		useFeaturedImage,
 	} = attributes;
-	const mediaSizeSlug = attributes.mediaSizeSlug || DEFAULT_MEDIA_SIZE_SLUG;
 
 	const [ featuredImage ] = useEntityProp(
 		'postType',