Hope this is an easy one - i'm sure an experienced dev will pick it up immediately, but looks like iv'e missed it.
My local host is not crashing, but it looks like it's not connecting to the store/dispatching.
For one, I do have the app connected to my store:
ReactDOM.render(
<Provider store={store}>
<App />
</Provider>,
document.getElementById('root')
);
Which is pointing to my store creation:
import {configureStore} from "@reduxjs/toolkit"
import cartReducer from "./cartRedux";
export default configureStore({
reducer: {
cart: cartReducer,
},
});
const cartSlice = createSlice({
name: "cart",
initialState: {
products: [],
quantity: 0,
total: 0,
},
reducers: {
addProduct: (state, action) => {
state.quantity += 1;
state.products.push(action.payload);
state.total += action.payload.price;
},
},
});
export const { addProduct } = cartSlice.actions;
export default cartSlice.reducer;
This is then pointing to an onClick event which is being handled below:
const handleClick = () => {
dispatch(
addProduct({ product, quantity})
)
};
<Button onClick={handleClick}>ADD TO CART</Button>
Despite this, my quantity is not transferring over and it does not appear the handleClick is functioning properly or the store is not being connected to.
Does anyone see anything obvious?