refactoring

src/components/HelpCenter.js

@@ -1,5 +1,4 @@
 import { useEffect, useState, useMemo, useRef } from '@wordpress/element';
-import apiFetch from '@wordpress/api-fetch';
 import { debounce } from 'lodash';
 import moduleAI from '@newfold-labs/wp-module-ai';
 import SearchResults from './SearchResults';
@@ -43,34 +42,36 @@ const HelpCenter = ( props ) => {
 			setHelpEnabled( false );
 		}
 	};
+
 	useEffect( () => {
-		getHelpStatus();
-	}, [] );
+		if ( props.refresh && searchInput !== '' ) {
+			setSearchInput( '' );
+		}
+	}, [ props.refresh ] );
 
 	useEffect( () => {
+		// Check help center capability
+		getHelpStatus();
+
+		// Fetch initial data
+		fetchInitialData();
+
+		// Add event listener for localStorage changes
 		const updateVisibility = () => {
 			setVisible( LocalStorageUtils.getHelpVisible() );
 		};
-
-		// Add the event listener on component mount
 		window.addEventListener( 'storage', updateVisibility );
 
 		// Remove the event listener when the component unmounts
 		return () => {
+			// Cancel any debounced calls
+			debouncedResults.cancel();
+
+			// Remove the storage event listener
 			window.removeEventListener( 'storage', updateVisibility );
 		};
 	}, [] );
 
-	useEffect( () => {
-		if ( props.refresh && searchInput !== '' ) {
-			setSearchInput( '' );
-		}
-	}, [ props.refresh ] );
-
-	useEffect( () => {
-		fetchInitialData();
-	}, [] );
-
 	useEffect( () => {
 		if ( initComplete ) {
 			adjustPadding();
@@ -82,12 +83,6 @@ const HelpCenter = ( props ) => {
 		adjustPadding();
 	}, [ showSuggestions ] );
 
-	// Clear any debounce problems
-	useEffect( () => {
-		debouncedResults.cancel();
-		// eslint-disable-next-line react-hooks/exhaustive-deps
-	}, [] );
-
 	const populateSearchResult = ( postContent, postId, postTitle ) => {
 		const resultContentFormatted =
 			postContent && postContent.replace( /\n/g, '<br />' );