title: react hooks dispatch action with use dispatch
body: <p>Hello I have a problem calling my action using usedispatch</p>
  
  <p>he arrives on my action but for some reason he does not pass on my return.
  stop here:     console.log('here is get all products');
  and no go to my getallproducts:</p>
  
  <pre><code>export const getAllProducts = () =&gt; {
      console.log('here is get all products');
      return dispatch =&gt; {
          dispatch(isLoadingFetch());
          api.get('/products')
          .then( response =&gt; { dispatch(FetchSucess(response.data))})
          .catch( err =&gt; { dispatch(FetchFailed(err.message));});
      }
  }
  </code></pre>
  
  <p>my reducer:</p>
  
  <pre><code>import {FETCH_FAIL, FETCH_SUCESS, FETCH_LOADING} from '../../actions/fetch/actionType';
  
  const initialState = {
      loading: false,
      products: [],
      filteredProducts: [],
      fn:[],
      mw:[],
      ft:[],
      ww:[],
      bs:[],
      stattrek:[],
      normal:[],
      error: null
    };
  
    export default function productReducer(state = initialState, action) {
      switch (action.type) {
        case FETCH_LOADING:
          return {
            ...state,
            loading: true
          };
        case FETCH_SUCESS:
          return {
            ...state,
            loading: false,
            error: null,
            filteredProducts: action.data.listProducts,
            products: action.data.listProducts,
            fn: action.data.fn,
            mw: action.data.mw,
            ft: action.data.ft,
            ww: action.data.ww,
            bs: action.data.bs,
            stattrek: action.data.listProducts.filter(value=&gt; value.id_types === 1),
            normal: action.data.listProducts.filter(value=&gt; value.id_types === 2)
          };
        case FETCH_FAIL:
          return {
            ...state,
            loading: false,
            error: action.error
          };
        default:
          return state;
      }
    }
  </code></pre>
  
  <p>my container:</p>
  
  <pre><code>import styles from "../assets/cardStyle";
  import { useDispatch, useSelector } from "react-redux";
  import {useEffect, useCallback} from "react";
  import { getAllProducts } from '../store/actions/fetch/index'
  const useStyles = makeStyles(styles);
  
  export default function Cards() {
  
      const classes = useStyles();
  
      const dispatch = useDispatch();
  
      const loadProducts= useCallback(async () =&gt; {
          dispatch(getAllProducts());
          }, [dispatch]);
  
          useEffect(() =&gt; {
              loadProducts();
              }, [loadProducts]);
  
      const products = useSelector(state =&gt; {
      })
  
      products.map(product=&gt;(
          &lt;div&gt;
          &lt;Container fixed&gt;
              &lt;Grid container direction="row" &gt;
                  &lt;Grid item xs={3}&gt;
                      &lt;Card className={classes.card}&gt;
                          &lt;CardContent className= {classes.cardCarousel}&gt;
                              &lt;Typography variant="body2" color="textSecondary" component="p"&gt;
                                  This impressive paella is a perfect party dish and a fun meal to cook together with your
                                  guests. Add 1 cup of frozen peas along with the mussels, if you like.
                              &lt;/Typography&gt;
                          &lt;/CardContent&gt;
                      &lt;/Card&gt;
  
                  &lt;/Grid&gt;
              &lt;/Grid&gt;
          &lt;/Container&gt;
      &lt;/div&gt; 
      ))
  
      return (
          {products}
      );
  }
  </code></pre>
  
  <p>I can't imagine where I'm going wrong
  it calls my getAllProducts but does not enter my redux</p>