refactor: 将全局设置参数移动到redux中,并将redux的api接口改为全局定义

为此,需要将退出登录操作改为刷新页面以清理上下文
pull/70/head
moonrailgun 2 years ago
parent 6be47e1f57
commit 4d554df237

@ -210,7 +210,7 @@ export {
} from './redux/slices';
export type { ChatConverseState } from './redux/slices/chat';
export { setupRedux } from './redux/setup';
export { createStore, ReduxProvider } from './redux/store';
export { reduxStore, ReduxProvider } from './redux/store';
export type { AppStore, AppState, AppDispatch } from './redux/store';
// utils

@ -1,4 +1,7 @@
import { request } from '../api/request';
import { globalActions } from '../redux/slices';
import { defaultGlobalConfig } from '../redux/slices/global';
import { reduxStore } from '../redux/store';
/**
*
@ -9,26 +12,25 @@ export interface GlobalConfig {
* 1m
*/
uploadFileLimit: number;
/**
*
*/
emailVerification: boolean;
}
let globalConfig = {
uploadFileLimit: 1 * 1024 * 1024,
emailVerification: false, // 是否在注册时校验邮箱
};
export function getGlobalConfig() {
return {
...globalConfig,
};
export function getGlobalConfig(): GlobalConfig {
return reduxStore.getState().global.config;
}
export async function fetchGlobalClientConfig(): Promise<GlobalConfig> {
const { data: config } = await request.get('/api/config/client');
globalConfig = {
...globalConfig,
...config,
};
reduxStore.dispatch(
globalActions.setGlobalConfig({
...defaultGlobalConfig,
...config,
})
);
return config;
}

@ -1,4 +1,10 @@
import { createSlice, PayloadAction } from '@reduxjs/toolkit';
import type { GlobalConfig } from '../../model/config';
export const defaultGlobalConfig: GlobalConfig = {
uploadFileLimit: 1 * 1024 * 1024,
emailVerification: false,
};
export interface GlobalState {
/**
@ -6,11 +12,13 @@ export interface GlobalState {
*/
networkStatus: 'initial' | 'connected' | 'reconnecting' | 'disconnected';
reconnectNum: number;
config: GlobalConfig;
}
const initialState: GlobalState = {
networkStatus: 'initial',
reconnectNum: 0,
config: defaultGlobalConfig,
};
const globalSlice = createSlice({
@ -26,6 +34,9 @@ const globalSlice = createSlice({
incReconnectNum(state) {
state.reconnectNum += 1;
},
setGlobalConfig(state, action: PayloadAction<GlobalConfig>) {
state.config = action.payload;
},
},
});

@ -1,7 +1,7 @@
import { configureStore } from '@reduxjs/toolkit';
import { appReducer } from './slices';
export function createStore() {
function createStore() {
const store = configureStore({
reducer: appReducer,
middleware: (getDefaultMiddleware) => getDefaultMiddleware(),
@ -11,6 +11,8 @@ export function createStore() {
return store;
}
export const reduxStore = createStore();
export type AppStore = ReturnType<typeof createStore>;
export type AppState = ReturnType<AppStore['getState']>;
export type AppDispatch = AppStore['dispatch'];

@ -82,9 +82,8 @@ export const SettingsAccount: React.FC = React.memo(() => {
// 登出
const handleLogout = useCallback(async () => {
await setUserJWT(null);
getGlobalSocket()?.disconnect();
setGlobalUserLoginInfo(null);
navigate('/');
window.location.replace('/'); // 重载页面以清空所有状态
}, []);
if (!userInfo) {

@ -1,12 +1,12 @@
import {
createSocket,
createStore,
setupRedux,
useAsync,
userActions,
t,
ReduxProvider,
UserLoginInfo,
reduxStore,
} from 'tailchat-shared';
import React, { PropsWithChildren } from 'react';
import { LoadingSpinner } from '@/components/LoadingSpinner';
@ -41,7 +41,7 @@ function useAppState() {
// 到这里 userLoginInfo 必定存在
// 创建Redux store
const store = createStore();
const store = reduxStore;
store.dispatch(userActions.setUserInfo(userLoginInfo));
setGlobalStore(store);

Loading…
Cancel
Save