title: Uncaught TypeError: setLoading is not a function
body: <p>I am trying to pass a React hook to react-redux. I pass in <code>loading</code> and <code>setLoading</code> hook. However, when I try to use <code>setLoading</code> I get an error:</p>
  <p><code>Uncaught TypeError: setLoading is not a function</code></p>
  <p>I'm really not sure what I am misunderstanding but I am new to React and even newer to react-redux. I am using <code>mapStateToProps</code> but can't figure out how to use Hooks with it.</p>
  <pre><code>import React from &quot;react&quot;
  import { connect } from &quot;react-redux&quot;
  import Button from '@material-ui/core/Button';
  
  export const CustomForm = ({ loading, setLoading, doAction }) =&gt; {
    const onClick = (e) =&gt; {
      e.preventDefault();
      setLoading(true);
      doAction(&quot;finish&quot;, setLoading)
    };
  
    return (
      &lt;React.Fragment&gt;
          &lt;form onSubmit={onClick}&gt;
              &lt;Button type=&quot;submit&quot;&gt;
                Submit
              &lt;/Button&gt;
          &lt;/form&gt;
      &lt;/React.Fragment&gt;
    )
  }
  
  const mapStateToProps = state =&gt; {
    return {
      loading: state.loading,
      setLoading: state.setLoading
    }
  }
  
  const mapDispatchToProps = dispatch =&gt; {
    return {
      doAction: (action, setLoading) =&gt; dispatch(action, setLoading),
    }
  }
  
  export default connect(
    mapStateToProps,
    mapDispatchToProps
  )(CustomForm)
  
  </code></pre>
  <p>Here is how I call <code>CustomForm</code>:</p>
  <pre><code>const [loading, setLoading] = React.useState(false);
  &lt;CustomForm loading={loading} setLoading={setLoading} /&gt;
  </code></pre>
  <p>EDIT: I need loading and setLoading defined outside the component because I use them outside of the component also.</p>