refactor: add typescript support for react hook(useAppDispatch, useAppSelector)

This commit is contained in:
HD
2022-06-20 10:54:23 +08:00
parent e67379ece4
commit 45419bbcf4
+32 -22
View File
@@ -1,23 +1,24 @@
import { configureStore, combineReducers } from "@reduxjs/toolkit";
import { setupListeners } from "@reduxjs/toolkit/query";
import listenerMiddleware from "./listener.middleware";
import authDataReducer from "./slices/auth.data";
import footprintReducer from "./slices/footprint";
import serverReducer from "./slices/server";
import uiReducer from "./slices/ui";
import channelsReducer from "./slices/channels";
import contactsReducer from "./slices/contacts";
import reactionMsgReducer from "./slices/message.reaction";
import channelMsgReducer from "./slices/message.channel";
import userMsgReducer from "./slices/message.user";
import favoritesReducer from "./slices/favorites";
import fileMsgReducer from "./slices/message.file";
import messageReducer from "./slices/message";
import { authApi } from "./services/auth";
import { contactApi } from "./services/contact";
import { channelApi } from "./services/channel";
import { messageApi } from "./services/message";
import { serverApi } from "./services/server";
import { combineReducers, configureStore } from '@reduxjs/toolkit';
import { setupListeners } from '@reduxjs/toolkit/query';
import { TypedUseSelectorHook, useDispatch, useSelector } from 'react-redux';
import listenerMiddleware from './listener.middleware';
import authDataReducer from './slices/auth.data';
import footprintReducer from './slices/footprint';
import serverReducer from './slices/server';
import uiReducer from './slices/ui';
import channelsReducer from './slices/channels';
import contactsReducer from './slices/contacts';
import reactionMsgReducer from './slices/message.reaction';
import channelMsgReducer from './slices/message.channel';
import userMsgReducer from './slices/message.user';
import favoritesReducer from './slices/favorites';
import fileMsgReducer from './slices/message.file';
import messageReducer from './slices/message';
import { authApi } from './services/auth';
import { contactApi } from './services/contact';
import { channelApi } from './services/channel';
import { messageApi } from './services/message';
import { serverApi } from './services/server';
const reducer = combineReducers({
authData: authDataReducer,
@@ -52,7 +53,9 @@ const store = configureStore({
)
.prepend(listenerMiddleware.middleware)
});
let initialized = false;
setupListeners(store.dispatch, (dispatch, { onOnline, onOffline, onFocus, onFocusLost }) => {
const handleFocus = () => dispatch(onFocus());
const handleFocusLost = () => dispatch(onFocusLost());
@@ -78,13 +81,20 @@ setupListeners(store.dispatch, (dispatch, { onOnline, onOffline, onFocus, onFocu
initialized = true;
}
}
const unsubscribe = () => {
return () => {
window.removeEventListener("focus", handleFocus);
window.removeEventListener("visibilitychange", handleVisibilityChange);
window.removeEventListener("online", handleOnline);
window.removeEventListener("offline", handleOffline);
initialized = false;
};
return unsubscribe;
});
export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;
export const useAppDispatch = () => useDispatch<AppDispatch>();
export const useAppSelector: TypedUseSelectorHook<RootState> = useSelector;
export default store;