import { configureStore } from '@reduxjs/toolkit'
import { TypedUseSelectorHook, useSelector } from 'react-redux'

import { api } from './api/api'
import { userSlice } from './slices/user'

export const createStore = (preloadedState = {}) =>
  configureStore({
    preloadedState,
    reducer: {
      [api.reducerPath]: api.reducer,
      [userSlice.name]: userSlice.reducer,
    },
    middleware: (getDefaultMiddleware) =>
      getDefaultMiddleware({
        immutableCheck: false,
        serializableCheck: false,
      }).concat(api.middleware),
  })

export type Store = ReturnType<ReturnType<typeof createStore>['getState']>

export const useAppSelector: TypedUseSelectorHook<Store> = useSelector
