import { configureStore } from '@reduxjs/toolkit';
import { setupListeners } from '@reduxjs/toolkit/query';
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
import authReducer from './slices/authSlice';
import jobReducer from './slices/jobSlice';
import earningsReducer from './slices/earningsSlice';
import { authApi } from './api/authApi';
import { jobApi } from './api/jobApi';
import { earningsApi } from './api/earningsApi';

export const store = configureStore({
  reducer: {
    auth: authReducer,
    job: jobReducer,
    earnings: earningsReducer,
    [authApi.reducerPath]: authApi.reducer,
    [jobApi.reducerPath]: jobApi.reducer,
    [earningsApi.reducerPath]: earningsApi.reducer,
  },
  middleware: (getDefaultMiddleware) =>
    getDefaultMiddleware({
      serializableCheck: false,
    }).concat(
      authApi.middleware,
      jobApi.middleware,
      earningsApi.middleware
    ),
});

setupListeners(store.dispatch);

export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;

export const useAppDispatch = () => useDispatch<AppDispatch>();
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;