React JS - I don't Understand what is going on

Question

In image it is saying It is expected to have ";", can someone explain ?

import React, {useReducer} from 'react';
import CartContext from './cart-context';

const defaultCartState = {
    items : [],
    totalAmount : 0
};

const cartReducer = (state, action) = {
    if (action.type === 'ADD') {
        const updatedItems = state.items.concat(item);
        const updatedTotalAmount = state.totalAmount + action.item.price * action.item.amount;
        return {
            items : updatedItems,
            totalAmount : updatedTotalAmount
        };
    }

    return defaultCartState;
}


const CartProvider = (props) => {
    const [cartState, dispatchCartState] = useReducer(cartReducer, defaultCartState);

    const adder = (item) =>{
        dispatchCartState({type : 'ADD', item : item})
    };
    const remover = (id) => {
        dispatchCartState({type : 'REMOVE', id : id})
    };


    const cartContext = {
        item: [],
        totalAmount : 0,
        addItem : adder,
        removeItem : remover
    }

    return (
        <CartContext.Provider value={cartContext}>
            {props.children}
        </CartContext.Provider>
    );
}

export default CartProvider;

I don't know what code is saying. Picture has been attached.

Answer 1

You are Using the Arrow Function in a Wrong way

Update your cartReducer function like this

const cartReducer = (state, action) => {
if (action.type === 'ADD') {
    const updatedItems = state.items.concat(item);
    const updatedTotalAmount = state.totalAmount + action.item.price * action.item.amount;
    return {
        items : updatedItems,
        totalAmount : updatedTotalAmount
    };
}