Used existing function instead of static directives for data-wp-context

src/blocks/interactive/movie-like-icon/render.php

@@ -8,6 +8,7 @@
 $post               = get_post();
 $wrapper_attributes = get_block_wrapper_attributes();
 $play_icon          = file_get_contents( get_template_directory() . '/assets/empty-heart.svg' );
+$context            = array( 'post' => array( 'id' => $post->ID ) );
 
 wp_interactivity_state(
 	'wpmovies',
@@ -21,7 +22,7 @@
 <div
 	data-wp-interactive="wpmovies"
 	<?php echo $wrapper_attributes; ?>
-	data-wp-context='{ "post": { "id": <?php echo $post->ID; ?> } }'
+	<?php echo wp_interactivity_data_wp_context( $context ); ?>
 >
 	<div
 		data-wp-on--click="actions.toggleMovie"

src/blocks/interactive/movie-tabs/render.php

@@ -12,6 +12,7 @@
 
 $images = json_decode( get_post_meta( $post->ID, '_wpmovies_images', true ), true );
 $videos = json_decode( get_post_meta( $post->ID, '_wpmovies_videos', true ), true );
+$context            = array( 'tab' => 'images' );
 
 wp_interactivity_state(
 	'wpmovies',
@@ -25,7 +26,7 @@
 <div
 	data-wp-interactive="wpmovies"
 	<?php echo $wrapper_attributes; ?>
-	data-wp-context='{ "tab": "images" }'
+	<?php echo wp_interactivity_data_wp_context( $context ); ?>
 >
 	<ul role="tablist">
 		<li class="wpmovies-tabs-title">
@@ -82,8 +83,9 @@ class="wpmovies-tab-button"
 			<?php
 			foreach ( $videos as $video ) {
 				$video_id = substr( $video['url'], strpos( $video['url'], '?v=' ) + 3 );
+				$context            = array( 'videoId' => $video_id );
 				?>
-				<div class="wpmovies-tabs-video-wrapper" data-wp-context='{ "videoId": "<?php echo $video_id; ?>" }'>
+				<div class="wpmovies-tabs-video-wrapper" <?php echo wp_interactivity_data_wp_context( $context ); ?>>
 					<div data-wp-on--click="actions.setVideo" aria-controls="wp-movies-video-player">
 						<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#ffffff" class="play-icon">
 							<path d="M3 22v-20l18 10-18 10z" />