From 3f010e6c72a04cd6f314d1061842cf40c3b68daa Mon Sep 17 00:00:00 2001
From: Carlos Bravo <37012961+c4rl0sbr4v0@users.noreply.github.com>
Date: Thu, 18 Jan 2024 17:56:16 +0100
Subject: [PATCH] Interactivity API: Remove unused `state` and rename `props`
 to `attributes` in `getElement()` (#57974)

* Remove state from getElement()

* Refactor props to attributes in getElement()

* Update changelog

* Update spaces in CHANGELOG

* Fix spaces in changelog

* Fix duplicate section

---------

Co-authored-by: Luis Herranz <luisherranz@gmail.com>
---
 packages/interactivity/CHANGELOG.md  |  8 +++-----
 packages/interactivity/src/hooks.tsx | 15 ++++++---------
 2 files changed, 9 insertions(+), 14 deletions(-)

diff --git a/packages/interactivity/CHANGELOG.md b/packages/interactivity/CHANGELOG.md
index b96dce6ffdcd4..71ec27e50a87e 100644
--- a/packages/interactivity/CHANGELOG.md
+++ b/packages/interactivity/CHANGELOG.md
@@ -4,20 +4,18 @@
 
 ### Enhancements
 
-- Prevent the usage of Preact components in `wp-text`. ([#57879](https://github.com/WordPress/gutenberg/pull/57879))
+-   Prevent the usage of Preact components in `wp-text`. ([#57879](https://github.com/WordPress/gutenberg/pull/57879))
+-   Update `preact`, `@preact/signals` and `deepsignal` dependencies. ([57891](https://github.com/WordPress/gutenberg/pull/57891))
 
 ### New Features
 
 -   Add the `data-wp-run` directive along with the `useInit` and `useWatch` hooks. ([57805](https://github.com/WordPress/gutenberg/pull/57805))
 
-### Enhancements
-
--  Update `preact`, `@preact/signals` and `deepsignal` dependencies. ([57891](https://github.com/WordPress/gutenberg/pull/57891))
-
 ### Breaking Changes
 
 -   Remove `data-wp-slot` and `data-wp-fill`. ([#57854](https://github.com/WordPress/gutenberg/pull/57854))
 -   Remove `wp-data-navigation-link` directive. ([#57853](https://github.com/WordPress/gutenberg/pull/57853))
+-   Remove unused `state` and rename `props` to `attributes` in `getElement()`. ([#57974](https://github.com/WordPress/gutenberg/pull/57974))
 
 ### Bug Fix
 
diff --git a/packages/interactivity/src/hooks.tsx b/packages/interactivity/src/hooks.tsx
index 14f0dc6683b46..0f3bb145b6559 100644
--- a/packages/interactivity/src/hooks.tsx
+++ b/packages/interactivity/src/hooks.tsx
@@ -3,7 +3,6 @@
  */
 import { h, options, createContext, cloneElement } from 'preact';
 import { useRef, useCallback, useContext } from 'preact/hooks';
-import { deepSignal } from 'deepsignal';
 import type { VNode, Context, RefObject } from 'preact';
 
 /**
@@ -60,8 +59,7 @@ interface Scope {
 	evaluate: Evaluate;
 	context: Context< any >;
 	ref: RefObject< HTMLElement >;
-	state: any;
-	props: any;
+	attributes: h.JSX.HTMLAttributes;
 }
 
 interface Evaluate {
@@ -142,11 +140,10 @@ export const getElement = () => {
 			'Cannot call `getElement()` outside getters and actions used by directives.'
 		);
 	}
-	const { ref, state, props } = getScope();
+	const { ref, attributes } = getScope();
 	return Object.freeze( {
 		ref: ref.current,
-		state,
-		props: deepImmutable( props ),
+		attributes: deepImmutable( attributes ),
 	} );
 };
 
@@ -313,12 +310,12 @@ const Directives = ( {
 	scope.context = useContext( context );
 	/* eslint-disable react-hooks/rules-of-hooks */
 	scope.ref = previousScope?.ref || useRef( null );
-	scope.state = previousScope?.state || useRef( deepSignal( {} ) ).current;
 	/* eslint-enable react-hooks/rules-of-hooks */
 
-	// Create a fresh copy of the vnode element and add the props to the scope.
+	// Create a fresh copy of the vnode element and add the props to the scope,
+	// named as attributes (HTML Attributes).
 	element = cloneElement( element, { ref: scope.ref } );
-	scope.props = element.props;
+	scope.attributes = element.props;
 
 	// Recursively render the wrapper for the next priority level.
 	const children =