title: How can I use custom hooks in react redux actions
body: <p>What I'm trying to do here is to simplify the code using hooks</p>
  <p>Here is the action file</p>
  <pre><code>export const getThings = (num) =&gt; async dispatch =&gt; {
      dispatch({ type: constants.GET_HOME_PAGE_REQ });
      const [res, error] = useFetch('get', api + &quot;/latest/&quot; + num, {});
      useEffect(() =&gt; {
          res &amp;&amp; dispatch({
              type: constants.GET_HOME_PAGE_RES,
              status: res.status,
              payload: res.data.message,
          });
      }, [res, dispatch]);
      useEffect(() =&gt; {
          error &amp;&amp; dispatch({
              type: constants.GET_HOME_PAGE_ERROR,
              message: error.message,
              status: error.status,
          });
      } , [error, dispatch]);
  };
  </code></pre>
  <p>and the error I'm getting</p>
  <blockquote>
  <p>Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:</p>
  <ol>
  <li>You might have mismatching versions of React and the renderer (such as React DOM)</li>
  <li>You might be breaking the Rules of Hooks</li>
  <li>You might have more than one copy of React in the same app See for tips about how to debug and fix this problem.</li>
  </ol>
  </blockquote>