fix: change the me endpoint to useQuery api

This commit is contained in:
mengstabketemaw
2026-07-08 13:36:52 +03:00
parent 9dd4c8867f
commit c106ac68d4
13 changed files with 36 additions and 87 deletions

View File

@@ -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'));

View File

@@ -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

View File

@@ -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 =

View File

@@ -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>();

View File

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