feat: integrate user retrieval and authentication state management; add getUserAction and isSignedIn actions; refactor AsgardeoNextClient and AsgardeoProvider components

Author: brionmario

packages/nextjs/src/AsgardeoNextClient.ts

@@ -36,6 +36,7 @@ import {
   generateUserProfile,
   flattenUserSchema,
   getScim2Me,
+  getSchemas,
 } from '@asgardeo/node';
 import {NextRequest, NextResponse} from 'next/server';
 import {AsgardeoNextConfig} from './models/config';
@@ -131,8 +132,19 @@ class AsgardeoNextClient<T extends AsgardeoNextConfig = AsgardeoNextConfig> exte
       const configData = await this.asgardeo.getConfigData();
       const baseUrl = configData?.baseUrl;
 
-      const profile = await getScim2Me({baseUrl});
-      const schemas = await getSchemas({url: `${baseUrl}/scim2/Schemas`});
+      const profile = await getScim2Me({
+        baseUrl,
+        headers: {
+          Authorization: `Bearer ${await this.getAccessToken(userId)}`,
+        },
+      });
+
+      const schemas = await getSchemas({
+        baseUrl,
+        headers: {
+          Authorization: `Bearer ${await this.getAccessToken(userId)}`,
+        },
+      });
 
       return generateUserProfile(profile, flattenUserSchema(schemas));
     } catch (error) {
@@ -164,6 +176,10 @@ class AsgardeoNextClient<T extends AsgardeoNextConfig = AsgardeoNextConfig> exte
     return this.asgardeo.isSignedIn(sessionId as string);
   }
 
+  getAccessToken(sessionId?: string): Promise<string> {
+    return this.asgardeo.getAccessToken(sessionId as string);
+  }
+
   override getConfiguration(): T {
     return this.asgardeo.getConfigData() as unknown as T;
   }

packages/nextjs/src/client/contexts/Asgardeo/AsgardeoProvider.tsx

@@ -23,7 +23,6 @@ import {I18nProvider, FlowProvider, UserProvider, ThemeProvider, AsgardeoProvide
 import {FC, PropsWithChildren, useEffect, useMemo, useState} from 'react';
 import {useRouter} from 'next/navigation';
 import AsgardeoContext, {AsgardeoContextProps} from './AsgardeoContext';
-import {getUserAction} from '../../../server/actions/authActions';
 
 /**
  * Props interface of {@link AsgardeoClientProvider}
@@ -33,6 +32,7 @@ export type AsgardeoClientProviderProps = Partial<Omit<AsgardeoProviderProps, 'b
     signOut: AsgardeoContextProps['signOut'];
     signIn: AsgardeoContextProps['signIn'];
     isSignedIn: boolean;
+    user: User | null;
   };
 
 const AsgardeoClientProvider: FC<PropsWithChildren<AsgardeoClientProviderProps>> = ({
@@ -42,10 +42,10 @@ const AsgardeoClientProvider: FC<PropsWithChildren<AsgardeoClientProviderProps>>
   preferences,
   isSignedIn,
   signInUrl,
+  user
 }: PropsWithChildren<AsgardeoClientProviderProps>) => {
   const router = useRouter();
   const [isDarkMode, setIsDarkMode] = useState(false);
-  const [user, setUser] = useState<User | null>(null);
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
@@ -57,30 +57,9 @@ const AsgardeoClientProvider: FC<PropsWithChildren<AsgardeoClientProviderProps>>
   }, [preferences?.theme?.mode]);
 
   useEffect(() => {
-    if (!isSignedIn) {
-      return;
-    }
-
-    (async () => {
-      try {
-        setIsLoading(true);
-
-        if (isSignedIn) {
-          console.log('[AsgardeoClientProvider] Fetching user data...');
-          const userResult = await getUserAction();
-
-          console.log('[AsgardeoClientProvider] User fetched:', userResult);
-          setUser(userResult?.data?.user);
-        } else {
-          setUser(null);
-        }
-      } catch (error) {
-        setUser(null);
-      } finally {
-        setIsLoading(false);
-      }
-    })();
-  }, [isSignedIn]);
+    // Set loading to false when server has resolved authentication state
+    setIsLoading(false);
+  }, [isSignedIn, user]);
 
   const handleSignIn = async (
     payload: EmbeddedSignInFlowHandleRequestPayload,
@@ -96,6 +75,13 @@ const AsgardeoClientProvider: FC<PropsWithChildren<AsgardeoClientProviderProps>>
         return;
       }
 
+      // After the Embedded flow is successful, the URL to navigate next is sent as `afterSignInUrl` in the response.
+      if (result?.data?.afterSignInUrl) {
+        router.push(result.data.afterSignInUrl);
+
+        return;
+      }
+
       if (result?.error) {
         throw new Error(result.error);
       }
@@ -134,7 +120,7 @@ const AsgardeoClientProvider: FC<PropsWithChildren<AsgardeoClientProviderProps>>
       signOut: handleSignOut,
       signInUrl,
     }),
-    [user, isSignedIn, isLoading],
+    [user, isSignedIn, isLoading, signInUrl],
   );
 
   return (

packages/nextjs/src/server/AsgardeoProvider.tsx

@@ -17,13 +17,15 @@
  */
 
 import {FC, PropsWithChildren, ReactElement} from 'react';
-import {AsgardeoRuntimeError} from '@asgardeo/node';
+import {AsgardeoRuntimeError, User} from '@asgardeo/node';
 import AsgardeoClientProvider, {AsgardeoClientProviderProps} from '../client/contexts/Asgardeo/AsgardeoProvider';
 import AsgardeoNextClient from '../AsgardeoNextClient';
 import signInAction from './actions/signInAction';
 import signOutAction from './actions/signOutAction';
 import {AsgardeoNextConfig} from '../models/config';
 import isSignedIn from './actions/isSignedIn';
+import getUserAction from './actions/getUserAction';
+import getSessionId from './actions/getSessionId';
 
 /**
  * Props interface of {@link AsgardeoServerProvider}
@@ -74,6 +76,15 @@ const AsgardeoServerProvider: FC<PropsWithChildren<AsgardeoServerProviderProps>>
     return <></>;
   }
 
+  const _isSignedIn: boolean = await isSignedIn();
+  let user: User = {};
+
+  if (_isSignedIn) {
+    const response = await getUserAction((await getSessionId()) as string);
+
+    user = response.data?.user || {};
+  }
+
   return (
     <AsgardeoClientProvider
       baseUrl={config.baseUrl}
@@ -82,7 +93,8 @@ const AsgardeoServerProvider: FC<PropsWithChildren<AsgardeoServerProviderProps>>
       signInUrl={configuration?.signInUrl}
       preferences={config.preferences}
       clientId={config.clientId}
-      isSignedIn={await isSignedIn()}
+      user={user}
+      isSignedIn={_isSignedIn}
     >
       {children}
     </AsgardeoClientProvider>

…nextjs/src/server/actions/authActions.ts …xtjs/src/server/actions/getUserAction.tspackages/nextjs/src/server/actions/authActions.ts renamed to packages/nextjs/src/server/actions/getUserAction.ts packages/nextjs/src/server/actions/authActions.ts renamed to packages/nextjs/src/server/actions/getUserAction.ts

@@ -35,12 +35,14 @@ import deleteSessionId from './deleteSessionId';
  * Server action to get the current user.
  * Returns the user profile if signed in.
  */
-export async function getUserAction() {
+const getUserAction = async (sessionId: string) => {
   try {
     const client = AsgardeoNextClient.getInstance();
-    const user = await client.getUser();
-    return {data: {user}, error: null};
+    const user = await client.getUser(sessionId);
+    return {success: true, data: {user}, error: null};
   } catch (error) {
-    return {data: {user: null}, error: 'Failed to get user'};
+    return {success: false, data: {user: null}, error: 'Failed to get user'};
   }
-}
+};
+
+export default getUserAction;

packages/nextjs/src/server/actions/isSignedIn.ts

@@ -18,14 +18,15 @@
 
 'use server';
 
-import {CookieConfig} from '@asgardeo/node';
-import {ReadonlyRequestCookies} from 'next/dist/server/web/spec-extension/adapters/request-cookies';
-import {cookies} from 'next/headers';
+import AsgardeoNextClient from '../../AsgardeoNextClient';
+import getSessionId from './getSessionId';
 
 const isSignedIn = async (): Promise<boolean> => {
-  const cookieStore: ReadonlyRequestCookies = await cookies();
+  const sessionId: string | undefined = await getSessionId();
+  const client = AsgardeoNextClient.getInstance();
+  const accessToken: string | undefined = await client.getAccessToken(sessionId);
 
-  return !!cookieStore.get(CookieConfig.SESSION_COOKIE_NAME)?.value;
+  return !!accessToken;
 };
 
 export default isSignedIn;