From 3ff64d841aeddd42a494c880cb239c73f8d28f8e Mon Sep 17 00:00:00 2001 From: Philipp Stracker Date: Wed, 5 Mar 2025 11:32:06 +0100 Subject: [PATCH] =?UTF-8?q?=E2=9A=A1=EF=B8=8F=20Leverage=20memoization=20f?= =?UTF-8?q?or=20selector?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../resources/js/data/onboarding/hooks.js | 32 ++----------------- 1 file changed, 3 insertions(+), 29 deletions(-) diff --git a/modules/ppcp-settings/resources/js/data/onboarding/hooks.js b/modules/ppcp-settings/resources/js/data/onboarding/hooks.js index a12ecd189..4d7549f5a 100644 --- a/modules/ppcp-settings/resources/js/data/onboarding/hooks.js +++ b/modules/ppcp-settings/resources/js/data/onboarding/hooks.js @@ -12,31 +12,6 @@ import { useSelect, useDispatch } from '@wordpress/data'; import { createHooksForStore } from '../utils'; import { PRODUCT_TYPES } from './configuration'; import { STORE_NAME } from './constants'; -import { useMemo } from '@wordpress/element'; - -/** - * Single source of truth for access Redux details. - * - * This hook returns a stable API to access actions, selectors and special hooks to generate - * getter- and setters for transient or persistent properties. - * - * @return {{select, dispatch, useTransient, usePersistent}} Store data API. - */ -const useStoreData = () => { - const select = useSelect( ( selectors ) => selectors( STORE_NAME ), [] ); - const dispatch = useDispatch( STORE_NAME ); - const { useTransient, usePersistent } = createHooksForStore( STORE_NAME ); - - return useMemo( - () => ( { - select, - dispatch, - useTransient, - usePersistent, - } ), - [ select, dispatch, useTransient, usePersistent ] - ); -}; const useHooks = () => { const { useTransient, usePersistent } = createHooksForStore( STORE_NAME ); @@ -161,10 +136,9 @@ export const useNavigationState = () => { }; export const useDetermineProducts = () => { - const { select } = useStoreData(); - const { determineProductsAndCaps } = select; - - return determineProductsAndCaps; + return useSelect( ( select ) => { + return select( STORE_NAME ).determineProductsAndCaps(); + }, [] ); }; export const useFlags = () => {