refactor(console): fix user data reloading issue

packages/console/src/hooks/use-current-user.ts

@@ -1,3 +1,4 @@
+import { useLogto } from '@logto/react';
 import type { UserProfileResponse } from '@logto/schemas';
 import useSWR from 'swr';
 
@@ -5,18 +6,17 @@ import { adminTenantEndpoint, meApi } from '@/consts';
 
 import type { RequestError } from './use-api';
 import { useStaticApi } from './use-api';
-import useLogtoUserId from './use-logto-user-id';
 import useSwrFetcher from './use-swr-fetcher';
 
 const useCurrentUser = () => {
-  const userId = useLogtoUserId();
+  const { isAuthenticated } = useLogto();
   const api = useStaticApi({ prefixUrl: adminTenantEndpoint, resourceIndicator: meApi.indicator });
   const fetcher = useSwrFetcher<UserProfileResponse>(api);
   const {
     data: user,
     error,
     mutate,
-  } = useSWR<UserProfileResponse, RequestError>(userId && 'me', fetcher);
+  } = useSWR<UserProfileResponse, RequestError>(isAuthenticated && 'me', fetcher);
 
   const isLoading = !user && !error;
 

packages/console/src/hooks/use-logto-user-id.ts

@@ -1,25 +0,0 @@
-import { useLogto } from '@logto/react';
-import { useEffect, useState } from 'react';
-
-const useLogtoUserId = () => {
-  const { getIdTokenClaims, isAuthenticated } = useLogto();
-  const [userId, setUserId] = useState<string>();
-
-  useEffect(() => {
-    const fetch = async () => {
-      const claims = await getIdTokenClaims();
-      setUserId(claims?.sub);
-    };
-
-    if (isAuthenticated) {
-      void fetch();
-    } else {
-      // eslint-disable-next-line unicorn/no-useless-undefined
-      setUserId(undefined);
-    }
-  }, [getIdTokenClaims, isAuthenticated]);
-
-  return userId;
-};
-
-export default useLogtoUserId;

packages/console/src/hooks/use-me-custom-data.ts

@@ -1,3 +1,4 @@
+import { type JsonObject } from '@logto/schemas';
 import { useCallback } from 'react';
 import { toast } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
@@ -9,19 +10,20 @@ const useMeCustomData = () => {
   const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
 
   const update = useCallback(
-    async (customData: Record<string, unknown>) => {
+    async (customData: JsonObject) => {
       if (!user) {
         toast.error(t('errors.unexpected_error'));
         return;
       }
 
-      const updated = await api
+      await reload({
-        .patch(`me/custom-data`, {
+        ...user,
-          json: customData,
+        customData: await api
-        })
+          .patch(`me/custom-data`, {
-        .json<(typeof user)['customData']>();
+            json: customData,
-
+          })
-      await reload({ ...user, customData: updated });
+          .json<JsonObject>(),
+      });
     },
     [api, reload, t, user]
   );

packages/console/src/hooks/use-validate-tenant-access.ts

@@ -7,7 +7,7 @@ import { getCallbackUrl } from '@/consts';
 import { TenantsContext } from '@/contexts/TenantsProvider';
 
 const useValidateTenantAccess = () => {
-  const { getAccessToken, signIn, isAuthenticated } = useLogto();
+  const { getAccessToken, signIn } = useLogto();
   const { currentTenant, currentTenantId, currentTenantValidated, setCurrentTenantValidated } =
     useContext(TenantsContext);
 
@@ -21,7 +21,7 @@ const useValidateTenantAccess = () => {
       }
     };
 
-    if (isAuthenticated && currentTenantId && !currentTenantValidated) {
+    if (currentTenantId && !currentTenantValidated) {
       setCurrentTenantValidated();
       if (currentTenant) {
         void validate(currentTenant);
@@ -37,7 +37,6 @@ const useValidateTenantAccess = () => {
     currentTenantId,
     currentTenantValidated,
     getAccessToken,
-    isAuthenticated,
     setCurrentTenantValidated,
     signIn,
   ]);

packages/console/src/onboarding/index.tsx

@@ -103,9 +103,9 @@ export function OnboardingRoutes() {
     <Routes>
       <Route element={<ProtectedRoutes />}>
         <Route element={<Layout />}>
-          <Route index element={<Navigate replace to={welcomePathname} />} />
+          <Route path="/" element={<Navigate replace to={welcomePathname} />} />
           <Route path={`/${OnboardingRoute.Onboarding}`} element={<AppContent />}>
-            <Route index element={<Navigate replace to={welcomePathname} />} />
+            <Route path="" element={<Navigate replace to={welcomePathname} />} />
             <Route path={OnboardingPage.Welcome} element={<Welcome />} />
             <Route path={OnboardingPage.AboutUser} element={<About />} />
             <Route path={OnboardingPage.SignInExperience} element={<SignInExperience />} />