fix: logout page reload

frontend/src/components/profile/profile.tsx

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

frontend/src/hooks/entities/auth-hooks.ts

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

frontend/src/hooks/useAuth.tsx

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