I am building a e commerce store with react and redux. I am getting an Error that says I am not importing an action from 'productAction.js' to 'homeScreen.js '. I have tried to auto import the the action but it will not compile. I want the listProduct action to be read and the property of products.
import React, { useEffect } from 'react';
import Product from '../components/product';
import { useDispatch, useSelector } from 'react-redux';
import { listProducts } from '../actions/productActions';
export default function HomeScreen() {
const dispatch = useDispatch();
const productList = useSelector(state =>
state.productList);
const { products } = productList;
useEffect(() => {
dispatch(listProducts());
},[dispatch]);
return (
<div>
<div className="row center">
{products.map((product) => (
<Product key={product._id} product={product}>
</Product>
))}
</div>
</div>
);
}
import { PRODUCT_LIST_FAIL, PRODUCT_LIST_REQUEST, PRODUCT_LIST_SUCCESS } from "../constants/productConstants"
import axios from 'axios'
const listProducts = ( ) => async(dispatch) => {
dispatch({
type: PRODUCT_LIST_REQUEST
})
try{
const { data } = await
axios.get('https://fakestoreapi.com/products')
dispatch({type:PRODUCT_LIST_SUCCESS,payload:data})
}catch (error) {
dispatch({type:PRODUCT_LIST_FAIL,payload:error.message});
}
}
export default listProducts;