mirror of https://github.com/usememos/memos
refactor(frontend): use auth service
Steven
2 years ago
parent
b944418257
commit
e83d483454
@ -1,19 +1,9 @@
|
||||
import { useEffect } from "react";
|
||||
import { useUserStore } from "@/store/module";
|
||||
import { useUserV1Store } from "@/store/v1";
|
||||
import { User } from "@/types/proto/api/v2/user_service";
|
||||
|
||||
const useCurrentUser = () => {
|
||||
const userStore = useUserStore();
|
||||
const userV1Store = useUserV1Store();
|
||||
const currentUsername = userStore.state.user?.username;
|
||||
|
||||
useEffect(() => {
|
||||
if (currentUsername) {
|
||||
userV1Store.getOrFetchUserByUsername(currentUsername);
|
||||
}
|
||||
}, [currentUsername]);
|
||||
|
||||
return userV1Store.getUserByUsername(currentUsername || "");
|
||||
return userV1Store.currentUser as User;
|
||||
};
|
||||
|
||||
export default useCurrentUser;
|
||||
|
||||
@ -1,132 +0,0 @@
|
||||
import { camelCase } from "lodash-es";
|
||||
import { authServiceClient, userServiceClient } from "@/grpcweb";
|
||||
import * as api from "@/helpers/api";
|
||||
import storage from "@/helpers/storage";
|
||||
import { getSystemColorScheme } from "@/helpers/utils";
|
||||
import { User as UserPb } from "@/types/proto/api/v2/user_service";
|
||||
import store, { useAppSelector } from "..";
|
||||
import { setAppearance, setLocale } from "../reducer/global";
|
||||
import { patchUser, setHost, setUser } from "../reducer/user";
|
||||
|
||||
const defaultSetting: Setting = {
|
||||
locale: "en",
|
||||
appearance: getSystemColorScheme(),
|
||||
memoVisibility: "PRIVATE",
|
||||
telegramUserId: "",
|
||||
};
|
||||
|
||||
const defaultLocalSetting: LocalSetting = {
|
||||
enableDoubleClickEditing: false,
|
||||
};
|
||||
|
||||
export const convertResponseModelUser = (user: User): User => {
|
||||
// user default 'Basic Setting' should follow server's setting
|
||||
// 'Basic Setting' fields: locale, appearance
|
||||
const { systemStatus } = store.getState().global;
|
||||
const { locale, appearance } = systemStatus.customizedProfile;
|
||||
const systemSetting = { locale, appearance };
|
||||
|
||||
const setting: Setting = {
|
||||
...defaultSetting,
|
||||
...systemSetting,
|
||||
};
|
||||
const { localSetting: storageLocalSetting } = storage.get(["localSetting"]);
|
||||
const localSetting: LocalSetting = {
|
||||
...defaultLocalSetting,
|
||||
...storageLocalSetting,
|
||||
};
|
||||
|
||||
if (user.userSettingList) {
|
||||
for (const userSetting of user.userSettingList) {
|
||||
(setting as any)[camelCase(userSetting.key)] = JSON.parse(userSetting.value);
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
...user,
|
||||
setting,
|
||||
localSetting,
|
||||
createdTs: user.createdTs * 1000,
|
||||
updatedTs: user.updatedTs * 1000,
|
||||
};
|
||||
};
|
||||
|
||||
export const initialUserState = async () => {
|
||||
const { systemStatus } = store.getState().global;
|
||||
|
||||
if (systemStatus.host) {
|
||||
store.dispatch(setHost(convertResponseModelUser(systemStatus.host)));
|
||||
}
|
||||
|
||||
const user = await fetchCurrentUser();
|
||||
if (user) {
|
||||
if (user.setting.locale) {
|
||||
store.dispatch(setLocale(user.setting.locale));
|
||||
}
|
||||
if (user.setting.appearance) {
|
||||
store.dispatch(setAppearance(user.setting.appearance));
|
||||
}
|
||||
return user;
|
||||
}
|
||||
};
|
||||
|
||||
const doSignOut = async () => {
|
||||
await api.signout();
|
||||
localStorage.removeItem("userId");
|
||||
};
|
||||
|
||||
const fetchCurrentUser = async () => {
|
||||
const userId = localStorage.getItem("userId");
|
||||
if (userId) {
|
||||
const { user } = await authServiceClient.getAuthStatus({});
|
||||
if (!user) {
|
||||
localStorage.removeItem("userId");
|
||||
return;
|
||||
}
|
||||
const { data } = await api.getUserById(Number(userId));
|
||||
const userMessage = convertResponseModelUser(data);
|
||||
if (userMessage) {
|
||||
store.dispatch(setUser(userMessage));
|
||||
return userMessage;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
export const useUserStore = () => {
|
||||
const state = useAppSelector((state) => state.user);
|
||||
|
||||
return {
|
||||
state,
|
||||
getState: () => {
|
||||
return store.getState().user;
|
||||
},
|
||||
doSignOut,
|
||||
fetchCurrentUser,
|
||||
setCurrentUser: async (user: User) => {
|
||||
localStorage.setItem("userId", String(user.id));
|
||||
},
|
||||
upsertUserSetting: async (key: string, value: any) => {
|
||||
await api.upsertUserSetting({
|
||||
key: key as any,
|
||||
value: JSON.stringify(value),
|
||||
});
|
||||
await fetchCurrentUser();
|
||||
},
|
||||
upsertLocalSetting: async (localSetting: LocalSetting) => {
|
||||
storage.set({ localSetting });
|
||||
store.dispatch(patchUser({ localSetting }));
|
||||
},
|
||||
patchUser: async (user: UserPb, updateMask: string[]): Promise<void> => {
|
||||
await userServiceClient.updateUser({ user, updateMask });
|
||||
// If the user is the current user and the username is changed, reload the page.
|
||||
if (user.id === store.getState().user.user?.id) {
|
||||
window.location.reload();
|
||||
}
|
||||
},
|
||||
deleteUser: async (name: string) => {
|
||||
await userServiceClient.deleteUser({
|
||||
name,
|
||||
});
|
||||
},
|
||||
};
|
||||
};
|
||||
@ -1,40 +0,0 @@
|
||||
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
|
||||
|
||||
interface State {
|
||||
// host is the user who hist the system
|
||||
host?: User;
|
||||
// user is the user who is currently logged in
|
||||
user?: User;
|
||||
}
|
||||
|
||||
const userSlice = createSlice({
|
||||
name: "user",
|
||||
initialState: {} as State,
|
||||
reducers: {
|
||||
setHost: (state, action: PayloadAction<User | undefined>) => {
|
||||
return {
|
||||
...state,
|
||||
host: action.payload,
|
||||
};
|
||||
},
|
||||
setUser: (state, action: PayloadAction<User | undefined>) => {
|
||||
return {
|
||||
...state,
|
||||
user: action.payload,
|
||||
};
|
||||
},
|
||||
patchUser: (state, action: PayloadAction<Partial<User>>) => {
|
||||
return {
|
||||
...state,
|
||||
user: {
|
||||
...state.user,
|
||||
...action.payload,
|
||||
} as User,
|
||||
};
|
||||
},
|
||||
},
|
||||
});
|
||||
|
||||
export const { setHost, setUser, patchUser } = userSlice.actions;
|
||||
|
||||
export default userSlice.reducer;
|
||||
Loading…
Reference in New Issue