feat: useActions to memoize several actions

Author: animify

example/Count.tsx

@@ -1,21 +1,23 @@
 import React from 'react';
-import { useRestate, useAction, useDispatch } from '../src';
+import { useRestate, useActions, useDispatch } from '../src';
 
 export default function Component() {
     const dispatch = useDispatch();
     const { count } = useRestate((state: { count: number }) => {
         return { count: state.count };
     });
 
-    const incrementAction = { type: 'INCREMENT' };
-    const derementAction = { type: 'DECREMENT' };
-    const increment = useAction(incrementAction);
+    const { increment, decrement } = useActions({
+        increment: { type: 'INCREMENT' },
+        decrement: { type: 'DECREMENT' },
+    });
 
     return (
         <div>
             <p>{count}</p>
             <a onClick={increment}>Increment count</a>
-            <a onClick={() => dispatch(derementAction)}>Decrement count</a>
+            <a onClick={() => dispatch({ type: 'DECREMENT' })}>Decrement count</a>
+            <a onClick={decrement}>Decrement other</a>
         </div>
     );
 }

src/index.ts

@@ -62,3 +62,22 @@ export function useAction<TAction extends Action>(action: TAction): () => TActio
 
     return memoizedDispatch;
 }
+
+export function useActions<TAction extends Action>(actions: {
+    [index: string]: TAction;
+}): {
+    [index: string]: () => TAction;
+} {
+    const dispatch = useDispatch();
+    const memoizedActions = Object.entries(actions).reduce(
+        (obj, [key, action]) => {
+            obj[key] = useCallback(() => dispatch(action), [action]);
+            return obj;
+        },
+        {} as {
+            [index: string]: () => TAction;
+        },
+    );
+
+    return memoizedActions;
+}