Почему я не получаю состояние в своем приложении

Я новичок в редуксе, пытаюсь добавить элемент в корзину, но получаю TypeError: Невозможно прочитать свойства неопределенного (чтение «getState»). почему я не могу получить состояние, есть ли что-то, что мне нужно сделать, что я не делаю, пожалуйста, что я делаю неправильно. я использую хук useDispatch для чтения хранилища и отправки действия

привет мой код

import { createSlice } from '@reduxjs/toolkit';

const initialState = {
    items: [],
}

export const basketSlice = createSlice({
    name: "basket",
    initialState,
    reducers: {
        addToBasket: (state, action) => {
            state.items = [...state.items, action.payload]
        },
        removeFromBasket: (state, action) => {},
    }
});

export const { addToBasket, removeFromBasket} = basketSlice.actions;
export const selectItems = (state) => state.basket.items;
export default basketSlice.reducer;



import { configureStore } from "@reduxjs/toolkit";
import basketReducer from "../slices/basketSlice";

export const store = configureStore({
    reducer: {
        basket: basketReducer,
    },
});

import '../styles/globals.css'
import { SessionProvider } from "next-auth/react"
import { Provider } from 'react-redux'
import store from '../app/store'

export default function App({
  Component,
  pageProps: { session, ...pageProps },
}) {
  return (
    <Provider store = {store}>
      <SessionProvider session = {session}>
        <Component {...pageProps} />
      </SessionProvider>
    </Provider>  
  )
}

import { useDispatch } from 'react-redux'
import {addToBasket} from "../slices/basketSlice"

const Product = ({id, title, description, price, image, category }) => {

  const dispatch = useDispatch();

      const addItemToBasket = () => {
          const product = {
            id,
            title, 
            description, 
            price, 
            image, 
            category 
          }

          dispatch(addToBasket(product))
      }

  return (
    <div className = "relative flex flex-col m-10 p-10 bg-white rounded-3xl">
        <button onClick = {addItemToBasket} className = " button">Add to basket</button>
    </div>
  )
}

export default Product;