title: Dispatch is not a function - React Testing Library with React Redux Hooks
body: <p>I want to test if the component is dispatching an action to the store, for this, i have to mock the functionalities of React Hooks. </p>
  
  <p>I'm using the useDispatch hook to get the dispatcher function and put inside a variable so them i can call it. </p>
  
  <p>When i run my test suits, even if the useDispatch function is mocked, it returns an error saying that it's not a function. </p>
  
  <pre><code>jest.mock('react-redux', () =&gt; ({
    useSelector: jest.fn(),
    useDispatch: jest.fn(() =&gt; {}),
  }));
  
  it('should be able open modal', () =&gt; {
    const { getByTestId } = render(&lt;Dropdown /&gt;);
  
    fireEvent.click(getByTestId('dropdown'));
    fireEvent.click(getByTestId('button-Transactions'));
  
    const dispatch = jest.fn();
    useDispatch.mockReturnValue(dispatch);
  
    expect(dispatch).toHaveBeenCalledWith(openModal('transactions'));
  });
  </code></pre>
  
  <p>The error: </p>
  
  <pre><code>    TypeError: dispatch is not a function
  
        19 | 
        20 |     if (item.action) {
      &gt; 21 |       dispatch(item.action);
           |       ^
        22 |     }
        23 | 
        24 |     return item;
  </code></pre>
  
  <p>My component: </p>
  
  <pre><code>const history = useHistory();
    const dispatch = useDispatch();
  
    function handleNavigation(item) {
      if (item.path) return history.push(item.path);
  
      if (item.action) {
        dispatch(item.action);
      }
  
      return item;
    }
  </code></pre>