From ae137a375cb36c486db0ea7b733edf1aed4a4823 Mon Sep 17 00:00:00 2001
From: David Arenas <david.arenas@automattic.com>
Date: Tue, 28 Nov 2023 20:30:42 +0100
Subject: [PATCH 1/3] Update templates to the new `store()` API

---
 .../block-templates/render.php.mustache       | 12 ++++-----
 .../block-templates/view.js.mustache          | 25 ++++++++-----------
 2 files changed, 17 insertions(+), 20 deletions(-)

diff --git a/packages/create-block-interactive-template/block-templates/render.php.mustache b/packages/create-block-interactive-template/block-templates/render.php.mustache
index c458473d565e00..814b8671f93b81 100644
--- a/packages/create-block-interactive-template/block-templates/render.php.mustache
+++ b/packages/create-block-interactive-template/block-templates/render.php.mustache
@@ -16,13 +16,13 @@ $unique_id = uniqid( 'p-' );
 
 <div
 	<?php echo get_block_wrapper_attributes(); ?>
-	data-wp-interactive
-	data-wp-context='{ "{{namespace}}": { "isOpen": false } }'
-	data-wp-effect="effects.{{namespace}}.logIsOpen"
+	data-wp-interactive='{ "namespace": "{{namespace}}" }'
+	data-wp-context='{ "isOpen": false }'
+	data-wp-watch="callbacks.logIsOpen"
 >
 	<button
-		data-wp-on--click="actions.{{namespace}}.toggle"
-		data-wp-bind--aria-expanded="context.{{namespace}}.isOpen"
+		data-wp-on--click="actions.toggle"
+		data-wp-bind--aria-expanded="context.isOpen"
 		aria-controls="p-<?php echo esc_attr( $unique_id ); ?>"
 	>
 		<?php esc_html_e( 'Toggle', '{{textdomain}}' ); ?>
@@ -30,7 +30,7 @@ $unique_id = uniqid( 'p-' );
 
 	<p
 		id="p-<?php echo esc_attr( $unique_id ); ?>"
-		data-wp-bind--hidden="!context.{{namespace}}.isOpen"
+		data-wp-bind--hidden="!context.isOpen"
 	>
 		<?php
 			esc_html_e( '{{title}} - hello from an interactive block!', '{{textdomain}}' );
diff --git a/packages/create-block-interactive-template/block-templates/view.js.mustache b/packages/create-block-interactive-template/block-templates/view.js.mustache
index 85d74fec190ba5..b4bae3939461dd 100644
--- a/packages/create-block-interactive-template/block-templates/view.js.mustache
+++ b/packages/create-block-interactive-template/block-templates/view.js.mustache
@@ -1,26 +1,23 @@
 {{#isBasicVariant}}
-
 /**
  * WordPress dependencies
  */
-import { store } from "@wordpress/interactivity";
+import { store, getContext } from "@wordpress/interactivity";
 
-store( {
+store( '{{namespace}}', {
 	actions: {
-		'{{namespace}}': {
-			toggle: ( { context } ) => {
-				context[ '{{namespace}}' ].isOpen = !context[ '{{namespace}}' ].isOpen;
-			},
+		toggle: () => {
+			const context = getContext();
+			context.isOpen = ! context.isOpen;
 		},
 	},
-	effects: {
-		'{{namespace}}': {
-			logIsOpen: ( { context } ) => {
-				// Log the value of `isOpen` each time it changes.
-				console.log( `Is open: ${ context[ '{{namespace}}' ].isOpen }` );
-			},
+	callbacks: {
+		logIsOpen: () => {
+			const { isOpen } = getContext();
+			// Log the value of `isOpen` each time it changes.
+			console.log( `Is open: ${ isOpen }` );
 		},
 	},
 } );
 
-{{/isBasicVariant}}
\ No newline at end of file
+{{/isBasicVariant}}

From 2f434812cf6df8dbe2ce77af549feefbe6e36c4b Mon Sep 17 00:00:00 2001
From: David Arenas <david.arenas@automattic.com>
Date: Tue, 28 Nov 2023 20:39:12 +0100
Subject: [PATCH 2/3] Add changelog entry

---
 packages/create-block-interactive-template/CHANGELOG.md | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/create-block-interactive-template/CHANGELOG.md b/packages/create-block-interactive-template/CHANGELOG.md
index 46e2a04014e6c0..2ee6b58aabc9ed 100644
--- a/packages/create-block-interactive-template/CHANGELOG.md
+++ b/packages/create-block-interactive-template/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 ## Unreleased
 
+### Enhancement
+
+-   Update `view.js` and `render.php` templates to the new `store()` API. [#56613](https://github.com/WordPress/gutenberg/pull/56613)
+
 ## 1.9.0 (2023-11-16)
 
 ## 1.8.0 (2023-11-02)

From e45e091ed71105ea187a6bec0d1a618354a67ddd Mon Sep 17 00:00:00 2001
From: Luis Herranz <luisherranz@gmail.com>
Date: Wed, 29 Nov 2023 11:47:38 +0100
Subject: [PATCH 3/3] Use wp_unique_id

---
 .../block-templates/render.php.mustache                     | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/create-block-interactive-template/block-templates/render.php.mustache b/packages/create-block-interactive-template/block-templates/render.php.mustache
index 814b8671f93b81..efecd748d19ef8 100644
--- a/packages/create-block-interactive-template/block-templates/render.php.mustache
+++ b/packages/create-block-interactive-template/block-templates/render.php.mustache
@@ -11,7 +11,7 @@
  * @see https://github.com/WordPress/gutenberg/blob/trunk/docs/reference-guides/block-api/block-metadata.md#render
  */
 
-$unique_id = uniqid( 'p-' );
+$unique_id = wp_unique_id( 'p-' );
 ?>
 
 <div
@@ -23,13 +23,13 @@ $unique_id = uniqid( 'p-' );
 	<button
 		data-wp-on--click="actions.toggle"
 		data-wp-bind--aria-expanded="context.isOpen"
-		aria-controls="p-<?php echo esc_attr( $unique_id ); ?>"
+		aria-controls="<?php echo esc_attr( $unique_id ); ?>"
 	>
 		<?php esc_html_e( 'Toggle', '{{textdomain}}' ); ?>
 	</button>
 
 	<p
-		id="p-<?php echo esc_attr( $unique_id ); ?>"
+		id="<?php echo esc_attr( $unique_id ); ?>"
 		data-wp-bind--hidden="!context.isOpen"
 	>
 		<?php