Merge pull request #36 from Hexastack/fix/logout-glitch

fix: logout page reload
This commit is contained in:
Mohamed Marrouchi 2024-09-18 10:13:11 +01:00 committed by GitHub
commit 549b946452
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 11 additions and 14 deletions

View File

@ -25,6 +25,7 @@ import { Adornment } from "@/app-components/inputs/Adornment";
import { Input } from "@/app-components/inputs/Input"; import { Input } from "@/app-components/inputs/Input";
import { PasswordInput } from "@/app-components/inputs/PasswordInput"; import { PasswordInput } from "@/app-components/inputs/PasswordInput";
import { useUpdateProfile } from "@/hooks/entities/auth-hooks"; import { useUpdateProfile } from "@/hooks/entities/auth-hooks";
import { CURRENT_USER_KEY } from "@/hooks/useAuth";
import { useToast } from "@/hooks/useToast"; import { useToast } from "@/hooks/useToast";
import { useValidationRules } from "@/hooks/useValidationRules"; import { useValidationRules } from "@/hooks/useValidationRules";
import { IUser, IUserAttributes } from "@/types/user.types"; import { IUser, IUserAttributes } from "@/types/user.types";
@ -43,7 +44,7 @@ export const ProfileForm: FC<ProfileFormProps> = ({ user }) => {
toast.error(t("message.internal_server_error")); toast.error(t("message.internal_server_error"));
}, },
onSuccess: (data) => { onSuccess: (data) => {
queryClient.setQueryData("current-user", data); queryClient.setQueryData([CURRENT_USER_KEY], data);
toast.success(t("message.account_update_success")); toast.success(t("message.account_update_success"));
}, },
}); });

View File

@ -8,17 +8,15 @@
*/ */
import { useEffect } from "react"; import { useEffect } from "react";
import { useMutation, useQuery } from "react-query"; import { useMutation, useQuery, useQueryClient } from "react-query";
import { EntityType, TMutationOptions } from "@/services/types"; import { EntityType, TMutationOptions } from "@/services/types";
import { ILoginAttributes } from "@/types/auth/login.types"; import { ILoginAttributes } from "@/types/auth/login.types";
import { IUserPermissions } from "@/types/auth/permission.types";
import { IUser, IUserAttributes, IUserStub } from "@/types/user.types"; import { IUser, IUserAttributes, IUserStub } from "@/types/user.types";
import { useFind } from "../crud/useFind"; import { useFind } from "../crud/useFind";
import { useApiClient } from "../useApiClient"; import { useApiClient } from "../useApiClient";
import { useAuth } from "../useAuth"; import { useAuth } from "../useAuth";
import { useLocalStorageState } from "../useLocalStorageState";
export const useLogin = ( export const useLogin = (
options?: Omit< options?: Omit<
@ -63,27 +61,25 @@ export const PERMISSIONS_STORAGE_KEY = "current-permissions";
export const useUserPermissions = () => { export const useUserPermissions = () => {
const { apiClient } = useApiClient(); const { apiClient } = useApiClient();
const { user, isAuthenticated } = useAuth(); const { user, isAuthenticated } = useAuth();
const { persist, value } = useLocalStorageState(PERMISSIONS_STORAGE_KEY); const queryClient = useQueryClient();
const storedPermissions = value
? (JSON.parse(value || JSON.stringify({})) as IUserPermissions)
: undefined;
const query = useQuery({ const query = useQuery({
enabled: isAuthenticated, enabled: isAuthenticated,
queryKey: [PERMISSIONS_STORAGE_KEY], queryKey: [PERMISSIONS_STORAGE_KEY],
async queryFn() { async queryFn() {
return await apiClient.getUserPermissions(user?.id as string); return await apiClient.getUserPermissions(user?.id as string);
}, },
onSuccess(data) { initialData: {
persist(JSON.stringify(data));
},
initialData: storedPermissions || {
roles: [], roles: [],
permissions: [], permissions: [],
}, },
}); });
useEffect(() => { useEffect(() => {
if (isAuthenticated) {
query.refetch(); query.refetch();
} else {
queryClient.removeQueries([PERMISSIONS_STORAGE_KEY]);
}
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [isAuthenticated]); }, [isAuthenticated]);

View File

@ -73,10 +73,10 @@ export const AuthProvider = ({ children }: AuthProviderProps): JSX.Element => {
}; };
const { mutateAsync: logoutSession } = useLogout(); const { mutateAsync: logoutSession } = useLogout();
const logout = async () => { const logout = async () => {
logoutRedirection();
queryClient.removeQueries([CURRENT_USER_KEY]); queryClient.removeQueries([CURRENT_USER_KEY]);
updateLanguage(publicRuntimeConfig.lang.default); updateLanguage(publicRuntimeConfig.lang.default);
await logoutSession(); await logoutSession();
logoutRedirection();
toast.success(t("message.logout_success")); toast.success(t("message.logout_success"));
}; };
const authRedirection = async (isAuthenticated: boolean) => { const authRedirection = async (isAuthenticated: boolean) => {