Codecademy export

App.js

import React from 'react';

import { Inventory } from '../features/inventory/Inventory.js';
import { CurrencyFilter } from '../features/currencyFilter/CurrencyFilter.js';
// Import the Cart component here.
import { Cart } from '../features/cart/Cart.js';

// Render the Cart component below <Inventory />
export const App = (props) => {

  const { state, dispatch } = props;

  return (
    <div>
     
      <CurrencyFilter
        currencyFilter={state.currencyFilter}
        dispatch={dispatch}
      />
   

      <Inventory
        inventory={state.inventory}
        currencyFilter={state.currencyFilter}
        dispatch={dispatch}
      />
      <Cart
      cart={state.cart}
      currencyFilter={state.currencyFilter}
      dispatch={dispatch}
      />
    </div>
  );
};

cartSlice.js

export const addItem = (itemToAdd) => {
  return {
    type: 'cart/addItem',
    payload: itemToAdd,
  };
};

// Create your changeItemQuantity action creator here.
export const changeItemQuantity = (name, newQuantity) => {
  return{
    type: 'cart/changeItemQuantity',
    payload: {name:name, newQuantity:newQuantity}
  }

}

const initialCart = {};
export const cartReducer = (cart = initialCart, action) => {
  switch (action.type) {
    case 'cart/addItem': {
      const { name, price } = action.payload;

      // if the item already exists, increase the quantity by 1, otherwise set it to 1
      const quantity = cart[name] ? cart[name].quantity + 1 : 1;
      const newItem = { price, quantity };

      // Add the new item to the cart (or replace it if it existed already)
      return { 
        ...cart, 
        [name]: newItem 
      };
    }
    case 'cart/changeItemQuantity': {
      const { name, newQuantity } = action.payload;
      const itemToUpdate = cart[name];
      const updateditem = { ...itemToUpdate, quantity: newQuantity }
      // Create a copy of itemToUpdate and update the quantity prop.

      // Return a copy of the cart with the updatedItem included.
      return {
        ...cart, 
        [name]: updatedItem 

      };
    }
    default: {
      return cart;
    }
  }
};

index.js

import React from 'react';
import ReactDOM from 'react-dom';

import { App } from './app/App.js';
// Import the store here.
import {store} from './app/store.js';
// Pass state and dispatch props to the <App /> component.
const render = () => {
  ReactDOM.render(
    <App 
      state={store.getState()}
      dispatch={store.dispatch}
    />,
    document.getElementById('root')
  )
};
render();

// Subscribe render to the store.
store.subscribe(render)

store.js

// Import createStore and combineReducers here.
import {createStore, combineReducers} from 'redux'

// Import the slice reducers here.
import {inventoryReducer} from '../features/inventory/inventorySlice.js'
import {cartReducer} from '../features/cart/cartSlice.js'
import {currencyFilterReducer} from '../features/currencyFilter/currencyFilterSlice.js'

// Create and export the store here.
export const store = createStore(combineReducers({inventory:inventoryReducer,cart: cartReducer, currency:currencyFilterReducer }))