From 4ecd07b453e85ccbd51c28208a64b1a4749bb6e9 Mon Sep 17 00:00:00 2001
From: Philipp Stracker <p.stracker@syde.com>
Date: Thu, 13 Feb 2025 16:22:40 +0100
Subject: [PATCH] =?UTF-8?q?=F0=9F=9A=9A=20Rename=20UI=20hook=20to=20make?=
 =?UTF-8?q?=20it=20more=20generic?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../Components/ReusableComponents/AccordionSection.js |  4 ++--
 .../hooks/{useAccordionState.js => useToggleState.js} | 11 ++++++++++-
 2 files changed, 12 insertions(+), 3 deletions(-)
 rename modules/ppcp-settings/resources/js/hooks/{useAccordionState.js => useToggleState.js} (56%)

diff --git a/modules/ppcp-settings/resources/js/Components/ReusableComponents/AccordionSection.js b/modules/ppcp-settings/resources/js/Components/ReusableComponents/AccordionSection.js
index 44c5beb27..379a16580 100644
--- a/modules/ppcp-settings/resources/js/Components/ReusableComponents/AccordionSection.js
+++ b/modules/ppcp-settings/resources/js/Components/ReusableComponents/AccordionSection.js
@@ -2,7 +2,7 @@ import { Icon } from '@wordpress/components';
 import { chevronDown, chevronUp } from '@wordpress/icons';
 import classNames from 'classnames';
 
-import { useAccordionState } from '../../hooks/useAccordionState';
+import { useToggleState } from '../../hooks/useToggleState';
 import {
 	Content,
 	Description,
@@ -21,7 +21,7 @@ const Accordion = ( {
 	children = null,
 	className = '',
 } ) => {
-	const { isOpen, toggleOpen } = useAccordionState( { id, initiallyOpen } );
+	const { isOpen, toggleOpen } = useToggleState( { id, initiallyOpen } );
 	const wrapperClasses = classNames( 'ppcp-r-accordion', className, {
 		'ppcp--is-open': isOpen,
 	} );
diff --git a/modules/ppcp-settings/resources/js/hooks/useAccordionState.js b/modules/ppcp-settings/resources/js/hooks/useToggleState.js
similarity index 56%
rename from modules/ppcp-settings/resources/js/hooks/useAccordionState.js
rename to modules/ppcp-settings/resources/js/hooks/useToggleState.js
index f54018262..bc1ad0e98 100644
--- a/modules/ppcp-settings/resources/js/hooks/useAccordionState.js
+++ b/modules/ppcp-settings/resources/js/hooks/useToggleState.js
@@ -11,7 +11,16 @@ const determineInitialState = ( id, initiallyOpen ) => {
 	return checkIfCurrentTab( id );
 };
 
-export function useAccordionState( { id = '', initiallyOpen = null } ) {
+/**
+ * Allows managing a toggle-able component, such as an accordion or a modal dialog.
+ *
+ * @param {Object}       props
+ * @param {string}       props.id            - Optional, if provided, the toggle can be opened via the URL.
+ * @param {null|boolean} props.initiallyOpen - Optional. If provided, it defines the initial open state.
+ *                                           If omitted, the initial open state is determined by using the "id" logic (inspecting the URL).
+ * @return {{isOpen: unknown, toggleOpen: (function(*): boolean)}} Hook object.
+ */
+export function useToggleState( { id = '', initiallyOpen = null } ) {
 	const [ isOpen, setIsOpen ] = useState(
 		determineInitialState( id, initiallyOpen )
 	);