Uncaught TypeError: Cannot read properties of undefined (reading 'push') for shopping cart project

I'm creating shooping cart that can add product to cart page. But when I click the add to cart button, there is an error "Uncaught TypeError: Cannot read properties of undefined (reading 'push')"

thees is my code

cartSlice.js

import { createSlice } from "@reduxjs/toolkit";
import { toast } from "react-toastify";
const initialState = {
cartItems: localStorage.getItem("cartItems") ? JSON.parse(localStorage.getItem("cartItems")) : [],
cartTotalQuantity: 0,
cartTotalAmount: 0,
};
const cartSlice = createSlice({
name: "cart",
initialState,
reducers: {
addToCart(state, action) {
let itemIndex = state.cartItems.findIndex(
(item) => item.id === action.payload.id
);
if (itemIndex >= 0) {
state.cartItems[itemIndex].cartQuantity += 1;
toast.info("added product to cart", { position: "top-center" });
} else {
const tempProduct = { ...action.payload, cartQuantity: 1 };
state.itemIndex.push(tempProduct);
toast.success("succes to add product", { position: "top-center" });
}
localStorage.setItem("cartItems", JSON.stringify(state.cartItems));
},
},
});
export const { addToCart } = cartSlice.actions;
export default cartSlice.reducer;

index.js

import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";
import { configureStore } from "@reduxjs/toolkit";
import { Provider } from "react-redux";
import { productsApi } from "./redux/productsAPI";
import productsReducer from "./redux/productSlice";
import cartReducer from "./redux/cartSlice";
const store = configureStore({
reducer: {
products: productsReducer,
cart: cartReducer,
[productsApi.reducerPath]: productsApi.reducer,
},
middleware: (getDefaultMiddleware) =>
getDefaultMiddleware().concat(productsApi.middleware),
});
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
<React.StrictMode>
<Provider store={store}>
<App />
</Provider>
</React.StrictMode>
);
reportWebVitals();

Home.jsx

import React from "react";
import { useGetAllProductsQuery } from "../redux/productsAPI";
import { useNavigate } from "react-router";
import { useDispatch } from "react-redux";
import { addToCart } from "../redux/cartSlice";
const Home = () => {
const { data, error, isLoading } = useGetAllProductsQuery();
const navigate = useNavigate();
const dispatch = useDispatch();
const handleAddToCart = (product) => {
dispatch(addToCart(product));
navigate("/cart");
};
return (
<section className="px-4 py-12 w-full h-full flex flex-col items-center justify-center mt-10">
{isLoading ? (
<p className="duration-500">Loading...</p>
) : error ? (
<p>Oh no, there was an</p>
) : (
<>
<h2 className="font-bold text-2xl md:text-4xl mb-8">Products</h2>
<div className="grid grid-cols-2 lg:grid-cols-3 gap-6">
{data?.map((item) => (
<div
key={item.id}
className="flex flex-col items-center justify-center p-2 shadow-lg border border-gray-300"
>
<h3 className="mb-2 font-bold">{item.name}</h3>
<div className="w-full h-[250px] md:h-[350px]">
<img
className="w-full h-full object-contain"
src={item.image}
alt={item.name}
/>
</div>
<div className="w-full flex flex-col gap-3">
<div className="md:mt-4">
<p className="p-1 text-xs md:text-sm text-gray-600 font-bold">
{item.description}
</p>
<p className="p-1 font-bold">${item.price}</p>
</div>
<button
onClick={()=>handleAddToCart(item)}
className="w-full bg-red-600 text-white rounded-xl py-1 hover:bg-red-500"
>
Add to cart
</button>
</div>
</div>
))}
</div>
</>
)}
</section>
);
};
export default Home;

I've search the problem solving but I can't get through this problem. Thankyou for your help guys

because of a typo in the addToCart reducer. You are trying to push an object into an undefined variable named "state.itemIndex", but it should be "state.cartItems"

reducers: {
addToCart(state, action) {
let itemIndex = state.cartItems.findIndex(
(item) => item.id === action.payload.id
);
if (itemIndex >= 0) {
state.cartItems[itemIndex].cartQuantity += 1;
toast.info("added product to cart", { position: "top-center" });
} else {
const tempProduct = { ...action.payload, cartQuantity: 1 };
state.cartItems.push(tempProduct);
toast.success("success to add product", { position: "top-center" });
}
localStorage.setItem("cartItems", JSON.stringify(state.cartItems));
},
},

state.cartItems not state.itemIndex in cartSlice.js else statement.