♻️ Convert todo-store hooks to new code pattern

modules/ppcp-settings/resources/js/data/todos/hooks.js

@@ -10,6 +10,31 @@
 import { useSelect, useDispatch } from '@wordpress/data';
 import { STORE_NAME } from './constants';
 import { createHooksForStore } from '../utils';
+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 ensureArray = ( value ) => {
 	if ( ! value ) {
@@ -19,12 +44,8 @@ const ensureArray = ( value ) => {
 };
 
 const useHooks = () => {
-	const { useTransient } = createHooksForStore( STORE_NAME );
+	const { dispatch } = useStoreData();
-	const { fetchTodos, setDismissedTodos, setCompletedTodos, persist } =
+	const { fetchTodos, setDismissedTodos, setCompletedTodos } = dispatch;
-		useDispatch( STORE_NAME );
-
-	// Read-only flags and derived state.
-	const [ isReady ] = useTransient( 'isReady' );
 
 	// Get todos data from store
 	const { todos, dismissedTodos, completedTodos } = useSelect( ( select ) => {
@@ -62,8 +83,6 @@ const useHooks = () => {
 	);
 
 	return {
-		persist,
-		isReady,
 		todos: filteredTodos,
 		dismissedTodos,
 		completedTodos,
@@ -74,8 +93,11 @@ const useHooks = () => {
 };
 
 export const useStore = () => {
-	const { persist, isReady } = useHooks();
+	const { dispatch, useTransient } = useStoreData();
-	return { persist, isReady };
+	const { persist, refresh } = dispatch;
+	const [ isReady ] = useTransient( 'isReady' );
+
+	return { persist, refresh, isReady };
 };
 
 export const useTodos = () => {