add gallery_id to block context attributes

packages/block-library/src/gallery/block.json

@@ -9,6 +9,9 @@
 	"keywords": [ "images", "photos" ],
 	"textdomain": "default",
 	"attributes": {
+		"galleryId": {
+			"type": "number"
+		},
 		"images": {
 			"type": "array",
 			"default": [],
@@ -105,6 +108,7 @@
 		}
 	},
 	"providesContext": {
+		"galleryId": "galleryId",
 		"allowResize": "allowResize",
 		"imageCrop": "imageCrop",
 		"fixedHeight": "fixedHeight"

packages/block-library/src/gallery/index.php

@@ -40,30 +40,32 @@ function block_core_gallery_data_id_backcompatibility( $parsed_block ) {
  * @since 6.7.0
  *
  * @param string $block_content Rendered block content.
- * @param array  $block         Block object.
  *
  * @return string Filtered block content.
  */
-function block_core_gallery_interactivity_state( $block_content, $block ) {
-	if ( 'core/gallery' !== $block['blockName'] ) {
+function block_core_gallery_interactivity_state( $block_content ) {
+	if ( 'core/gallery' !== $block_content['blockName'] ) {
 		return $block_content;
 	}
 
 	$unique_gallery_id = uniqid();
-	interactive_block_gallery_id( $unique_gallery_id );
+	$filter_block_context = static function ( $context ) use ( $unique_gallery_id ) {
+		$context['galleryId']   = $unique_gallery_id;
+		return $context;
+	};
+	add_filter( 'render_block_context', $filter_block_context, 1 );
 
 	wp_interactivity_state(
 		'core/gallery',
 		array(
 			'images'    => array(),
-			'galleryId' => $unique_gallery_id,
 		)
 	);
 
 	return $block_content;
 }
 
-add_filter( 'render_block_data', 'block_core_gallery_interactivity_state', 15, 2 );
+add_filter( 'render_block_data', 'block_core_gallery_interactivity_state' );
 
 /**
  * Returns the current gallery block id.
@@ -91,7 +93,7 @@ function interactive_block_gallery_id( $id = null ) {
  * @param string $content Content of the block being rendered.
  * @return string The content of the block being rendered.
  */
-function block_core_gallery_render( $attributes, $content ) {
+function block_core_gallery_render( $attributes, $content, $block ) {
 	// Adds a style tag for the --wp--style--unstable-gallery-gap var.
 	// The Gallery block needs to recalculate Image block width based on
 	// the current gap setting in order to maintain the number of flex columns
@@ -169,8 +171,7 @@ function block_core_gallery_render( $attributes, $content ) {
 		)
 	);
 
-	$state      = wp_interactivity_state( 'core/gallery' );
-	$gallery_id = interactive_block_gallery_id( );
+	$gallery_id = $block->context['galleryId'];
 
 	$processed_content->set_attribute( 'data-wp-interactive', 'core/gallery' );
 	$processed_content->set_attribute(
@@ -184,7 +185,7 @@ function block_core_gallery_render( $attributes, $content ) {
 		)
 	);
 
-	add_filter( 'render_block_core/gallery', 'block_core_gallery_render_lightbox' );
+	add_filter( 'render_block_core/gallery', 'block_core_gallery_render_lightbox', 15, 3 );
 
 	// The WP_HTML_Tag_Processor class calls get_updated_html() internally
 	// when the instance is treated as a string, but here we explicitly
@@ -245,9 +246,9 @@ static function () use ( $image_blocks, &$i ) {
  *
  * @return string Filtered block content.
  */
-function block_core_gallery_render_lightbox( $block_content ) {
+function block_core_gallery_render_lightbox( $block_content, $content, $block ) {
 	$state        = wp_interactivity_state( 'core/gallery' );
-	$gallery_id   = interactive_block_gallery_id();
+	$gallery_id   = $block->context['galleryId'];
 	$images       = $state['images'][ $gallery_id ] ?? array();
 	$translations = array();
 

packages/block-library/src/image/block.json

@@ -4,7 +4,7 @@
 	"name": "core/image",
 	"title": "Image",
 	"category": "media",
-	"usesContext": [ "allowResize", "imageCrop", "fixedHeight" ],
+	"usesContext": [ "galleryId", "allowResize", "imageCrop", "fixedHeight" ],
 	"description": "Insert an image to make a visual statement.",
 	"keywords": [ "img", "photo", "picture" ],
 	"textdomain": "default",

packages/block-library/src/image/index.php

@@ -92,7 +92,7 @@ function render_block_core_image( $attributes, $content, $block ) {
 		 * if the way the blocks are rendered changes, or if a new kind of filter is
 		 * introduced.
 		 */
-		add_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 15, 2 );
+		add_filter( 'render_block_core/image', 'block_core_image_render_lightbox', 15, 3 );
 	} else {
 		/*
 		 * Remove the filter if previously added by other Image blocks.
@@ -142,12 +142,13 @@ function block_core_image_get_lightbox_settings( $block ) {
  *
  * @since 6.4.0
  *
- * @param string $block_content Rendered block content.
- * @param array  $block         Block object.
+ * @param string $block_content  Rendered block content.
+ * @param array  $block          Block object.
+ * @param array  $block_instance Block instance.
  *
  * @return string Filtered block content.
  */
-function block_core_image_render_lightbox( $block_content, $block ) {
+function block_core_image_render_lightbox( $block_content, $block, $block_instance ) {
 	/*
 	 * If there's no IMG tag in the block then return the given block content
 	 * as-is. There's nothing that this code can knowingly modify to add the
@@ -205,9 +206,10 @@ function block_core_image_render_lightbox( $block_content, $block ) {
 		)
 	);
 
-	$state      = wp_interactivity_state( 'core/gallery' );
-	$gallery_id = gutenberg_interactive_block_gallery_id( );
+	$gallery_id = $block_instance->context['galleryId'] ?? null;
+
 	if ( isset( $gallery_id ) ) {
+		$state  = wp_interactivity_state( 'core/gallery' );
 		$images = $state['images'][ $gallery_id ];
 		if ( ! isset( $images ) ) {
 			$images = array();