fix: change the me endpoint to useQuery api

apps/backoffice/src/app/features/profile/pages/ProfilePage.tsx

@@ -43,8 +43,7 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { z } from 'zod';
 import { useTranslation } from 'react-i18next';
 import { notify, PageHeader } from '@ema-platform/ui';
-import { useApiMutation } from '@ema-platform/api';
-import { setUser } from '@ema-platform/auth';
+import { useApiMutation, useGetMeQuery, baseApi } from '@ema-platform/api';
 import type { AuthUser } from '@ema-platform/auth';
 import { SUPPORTED_LANGUAGES, type AppLanguage } from '../../../i18n/config';
 import { useAppDispatch, useAppSelector } from '../../../store/hooks';
@@ -74,12 +73,13 @@ function passwordScore(pw: string) {
 export function ProfilePage() {
   const { t, i18n } = useTranslation();
   const dispatch = useAppDispatch();
-  const user = useAppSelector((state) => state.auth.user);
   const { colorScheme, setColorScheme } = useMantineColorScheme();
   const layoutMode = useAppSelector((state) => state.preferences.layoutMode);
 
+  const { data: me } = useGetMeQuery();
+  const storeUser = useAppSelector((state) => state.auth.user);
+  const user = (me as AuthUser | undefined) ?? storeUser;
   const [updateTrigger] = useApiMutation<AuthUser>();
-  const [meTrigger] = useApiMutation<AuthUser>();
   const [passwordTrigger] = useApiMutation<unknown>();
 
   const [isSavingProfile, setIsSavingProfile] = useState(false);
@@ -89,25 +89,6 @@ export function ProfilePage() {
   const [twoStepEnabled, setTwoStepEnabled] = useState(false);
   const [emailNotifications, setEmailNotifications] = useState(true);
 
-  // Load the latest profile from the server on mount so the form always
-  // reflects the current account information (the cached user may be stale).
-  useEffect(() => {
-    let active = true;
-    meTrigger({ url: '/auth/me', method: 'GET' })
-      .unwrap()
-      .then((me) => {
-        if (active) dispatch(setUser(me));
-      })
-      .catch(() => {
-        /* fall back to the cached user already in the store */
-      });
-    return () => {
-      active = false;
-    };
-    // meTrigger/dispatch are stable; run once on mount.
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
   // ---- Profile form ----
   const profileSchema = z.object({
     nameEn: z.string().min(1, { message: t('profile.validation.nameRequired') }),
@@ -152,9 +133,7 @@ export function ProfilePage() {
         },
       }).unwrap();
 
-      const me = await meTrigger({ url: '/auth/me', method: 'GET' }).unwrap();
-      dispatch(setUser(me));
-
+      dispatch(baseApi.util.invalidateTags(['Me']));
       notify.success(t('profile.profileUpdated'));
     } catch {
       notify.error(t('profile.updateFailed'));

apps/backoffice/src/app/features/user-management/UserManagementPage.tsx

@@ -138,8 +138,8 @@ export default function UserManagementPage() {
     style.textContent = UM_OVERRIDES;
     document.head.appendChild(style);
 
-    const token = localStorage.getItem('ema-backoffice-auth-token') ?? '';
-    const refreshToken = localStorage.getItem('ema-backoffice-refresh-token') ?? undefined;
+    const token = localStorage.getItem('auth-token') ?? '';
+    const refreshToken = localStorage.getItem('refresh-token') ?? undefined;
 
     const session: UserManagementSessionOptions = {
       initialSession: token

apps/backoffice/src/app/i18n/config.ts

@@ -6,7 +6,7 @@ import { am } from './locales/am';
 export const SUPPORTED_LANGUAGES = ['en', 'am'] as const;
 export type AppLanguage = (typeof SUPPORTED_LANGUAGES)[number];
 
-const STORAGE_KEY = 'ema-backoffice-lang';
+const STORAGE_KEY = 'app-lang';
 
 function getInitialLanguage(): AppLanguage {
   const stored =

apps/backoffice/src/app/store/index.ts

@@ -3,7 +3,6 @@ import { baseApi, configureTokenRefresh } from '@ema-platform/api';
 import {
   authReducer,
   signupReducer,
-  configureAuthStorage,
   authStorage,
   refreshAccessToken,
   logout,
@@ -11,8 +10,6 @@ import {
 import type { AuthUser, CurrentProfile } from '@ema-platform/auth';
 import { preferencesReducer } from './preferences.slice';
 
-configureAuthStorage('ema-backoffice');
-
 const preloadedAuth = (() => {
   const token = authStorage.getToken();
   const user = authStorage.getUser<AuthUser>();

apps/backoffice/src/app/store/preferences.slice.ts

@@ -6,7 +6,7 @@ interface PreferencesState {
   layoutMode: LayoutMode;
 }
 
-const PREFERENCES_KEY = 'ema-backoffice-preferences';
+const PREFERENCES_KEY = 'app-preferences';
 
 const loadPreferences = (): PreferencesState => {
   try {

apps/portal/src/app/features/profile/pages/ProfilePage.tsx

@@ -44,8 +44,8 @@ import { zodResolver } from '@hookform/resolvers/zod';
 import { z } from 'zod';
 import { useTranslation } from 'react-i18next';
 import { notify, PageHeader } from '@ema-platform/ui';
-import { useApiMutation } from '@ema-platform/api';
-import { authStorage, setUser, setCurrentProfile } from '@ema-platform/auth';
+import { useApiMutation, useGetMeQuery, baseApi } from '@ema-platform/api';
+import { authStorage, setCurrentProfile } from '@ema-platform/auth';
 import type { CurrentProfile } from '@ema-platform/auth';
 import { SUPPORTED_LANGUAGES, type AppLanguage } from '../../../i18n/config';
 import { useAppDispatch, useAppSelector } from '../../../store/hooks';
@@ -83,12 +83,13 @@ function passwordScore(pw: string) {
 export function ProfilePage() {
   const { t, i18n } = useTranslation();
   const dispatch = useAppDispatch();
-  const user = useAppSelector((state) => state.auth.user);
   const currentProfile = useAppSelector((state) => state.auth.currentProfile);
   const { colorScheme, setColorScheme } = useMantineColorScheme();
 
+  const { data: me } = useGetMeQuery();
+  const storeUser = useAppSelector((state) => state.auth.user);
+  const user = (me as AuthUser | undefined) ?? storeUser;
   const [updateTrigger] = useApiMutation<AuthUser>();
-  const [meTrigger] = useApiMutation<AuthUser>();
   const [passwordTrigger] = useApiMutation<unknown>();
   const [fetchProfessions] = useApiMutation<{ count: number; items: Array<{ id: string; name: { en: string } }> }>();
 
@@ -198,19 +199,6 @@ export function ProfilePage() {
     }
   }, [currentProfile, user, fetchProfile, dispatch]);
 
-  // Load the latest user from the server on mount
-  useEffect(() => {
-    let active = true;
-    meTrigger({ url: '/auth/me', method: 'GET' })
-      .unwrap()
-      .then((me) => {
-        if (active) dispatch(setUser(me));
-      })
-      .catch(() => {});
-    return () => { active = false; };
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
   // ---- Personal form (auth user data) ----
   const personalSchema = z.object({
     nameEn: z.string().min(1, { message: t('profile.validation.nameRequired') }),
@@ -251,9 +239,7 @@ export function ProfilePage() {
         },
       }).unwrap();
 
-      const me = await meTrigger({ url: '/auth/me', method: 'GET' }).unwrap();
-      dispatch(setUser(me));
-
+      dispatch(baseApi.util.invalidateTags(['Me']));
       notify.success(t('profile.profileUpdated'));
     } catch {
       notify.error(t('profile.updateFailed'));

apps/portal/src/app/i18n/config.ts

@@ -6,7 +6,7 @@ import { am } from './locales/am';
 export const SUPPORTED_LANGUAGES = ['en', 'am'] as const;
 export type AppLanguage = (typeof SUPPORTED_LANGUAGES)[number];
 
-const STORAGE_KEY = 'ema-portal-lang';
+const STORAGE_KEY = 'app-lang';
 
 function getInitialLanguage(): AppLanguage {
   const stored =

apps/portal/src/app/store/index.ts

@@ -3,15 +3,12 @@ import { baseApi, configureTokenRefresh } from '@ema-platform/api';
 import {
   authReducer,
   signupReducer,
-  configureAuthStorage,
   authStorage,
   refreshAccessToken,
   logout,
 } from '@ema-platform/auth';
 import type { AuthUser, CurrentProfile } from '@ema-platform/auth';
 
-configureAuthStorage('ema-portal');
-
 const preloadedAuth = (() => {
   const token = authStorage.getToken();
   const user = authStorage.getUser<AuthUser>();