@ollaid/native-sso 1.0.2 → 1.0.4

package/README.md

@@ -97,6 +97,7 @@ La page `/auth/sso` gère automatiquement :
 | `saasApiUrl` | `string` | ✅ | URL du backend SaaS (ex: `https://mon-saas.com/api`) |
 | `iamApiUrl` | `string` | ✅ | URL du backend IAM (ex: `https://identityam.ollaid.com/api`) |
 | `accountType` | `'user' \| 'client'` | ❌ | Type de compte à persister dans localStorage (défaut: `'user'`). Utile si vous avez plusieurs pages SSO avec des rôles différents. |
+| `configPrefix` | `string` | ❌ | **Multi-tenant** : préfixe de configuration IAM côté backend (défaut: `'iam'`). Permet à un même backend SaaS de gérer N applications IAM. Voir [Multi-Tenant](#multi-tenant-plusieurs-applications-sur-le-même-backend). |
 | `onLoginSuccess` | `(token: string, user: UserInfos) => void` | ❌ | Callback après connexion réussie |
 | `onLogout` | `() => void` | ❌ | Callback après déconnexion |
 | `title` | `string` | ❌ | Titre personnalisé (défaut: "Un compte, plusieurs accès") |
@@ -105,7 +106,209 @@ La page `/auth/sso` gère automatiquement :
 | `hideFooter` | `boolean` | ❌ | Masquer "Propulsé par iam.ollaid.com" |
 | `onOnboardingComplete` | `(data: { image_url?: string; ccphone?: string; phone?: string }) => void` | ❌ | Callback après complétion de l'onboarding |
 
-> **Note :** Le mode `debug` est contrôlé **uniquement** par le backend via la variable d'environnement `IAM_DEBUG` dans le `.env` du SaaS. Il n'y a plus de prop `debug` à passer au composant.
+> **Note :** Le mode `debug` est contrôlé **uniquement** par le backend via la variable d'environnement `IAM_DEBUG` dans le `.env` du SaaS. Il n'y a plus de prop `debug` à passer au composant. Le `DebugPanel` est **réactif** : il apparaît automatiquement après le chargement des credentials si `debug: true` est retourné par le backend.
+
+---
+
+## Multi-Tenant (plusieurs applications sur le même backend)
+
+Le package supporte N applications IAM sur le même backend SaaS via le prop `configPrefix`. C'est dynamique : vous pouvez ajouter autant d'applications que nécessaire sans modifier le code du package.
+
+### Principe
+
+Le frontend envoie un header `X-IAM-Config-Prefix` dans tous les appels au SaaS. Le backend utilise ce préfixe pour résoudre dynamiquement le bon bloc de configuration.
+
+```
+Frontend (configPrefix="iam_vendor")
+  → GET /api/native/config  [Header: X-IAM-Config-Prefix: iam_vendor]
+
+Backend SaaS:
+  $prefix = $request->header('X-IAM-Config-Prefix', 'iam');
+  $appKey = config("services.{$prefix}.app_key");  // ← résolution dynamique
+```
+
+### Côté Frontend
+
+```tsx
+{/* Page login principale */}
+<NativeSSOPage
+  saasApiUrl="https://votre-saas.com/api"
+  iamApiUrl="https://identityam.ollaid.com/api"
+  configPrefix="iam"
+  accountType="user"
+/>
+
+{/* Page login espace vendeur */}
+<NativeSSOPage
+  saasApiUrl="https://votre-saas.com/api"
+  iamApiUrl="https://identityam.ollaid.com/api"
+  configPrefix="iam_vendor"
+  accountType="client"
+/>
+
+{/* Page login admin — même backend, app IAM différente */}
+<NativeSSOPage
+  saasApiUrl="https://votre-saas.com/api"
+  iamApiUrl="https://identityam.ollaid.com/api"
+  configPrefix="iam_admin"
+  accountType="user"
+/>
+```
+
+### Côté Backend SaaS — `.env`
+
+Le préfixe `.env` correspond au `configPrefix` en UPPER_CASE. Ajoutez autant de blocs que nécessaire :
+
+```env
+# ===== Serveur IAM (partagé) =====
+IAM_API_URL=https://identityam.ollaid.com/api
+IAM_AUTH_URL=https://iam.ollaid.com
+
+# ===== Préfixe "iam" (application principale) =====
+IAM_APP_KEY=oiam_ak_xxx
+IAM_PUBLIC_KEY=oiam_pk_xxx
+IAM_SECRET_KEY=oiam_sk_xxx
+IAM_WEBHOOK_SECRET=oiam_whsec_xxx
+IAM_DEBUG=true
+
+# ===== Préfixe "iam_vendor" (espace vendeur/shop) =====
+IAM_VENDOR_APP_KEY=oiam_ak_yyy
+IAM_VENDOR_PUBLIC_KEY=oiam_pk_yyy
+IAM_VENDOR_SECRET_KEY=oiam_sk_yyy
+IAM_VENDOR_WEBHOOK_SECRET=oiam_whsec_yyy
+IAM_VENDOR_DEBUG=false
+
+# ===== Préfixe "iam_client" (espace client) =====
+IAM_CLIENT_APP_KEY=oiam_ak_zzz
+IAM_CLIENT_SECRET_KEY=oiam_sk_zzz
+IAM_CLIENT_DEBUG=true
+
+# ===== Préfixe "iam_admin" (back-office) =====
+IAM_ADMIN_APP_KEY=oiam_ak_aaa
+IAM_ADMIN_SECRET_KEY=oiam_sk_aaa
+IAM_ADMIN_DEBUG=true
+```
+
+### Côté Backend SaaS — `config/services.php`
+
+```php
+return [
+    'iam' => [
+        'api_url'    => env('IAM_API_URL', 'https://identityam.ollaid.com/api'),
+        'app_key'    => env('IAM_APP_KEY'),
+        'public_key' => env('IAM_PUBLIC_KEY'),
+        'secret_key' => env('IAM_SECRET_KEY'),
+        'debug'      => env('IAM_DEBUG', false),
+    ],
+    'iam_vendor' => [
+        'api_url'    => env('IAM_API_URL'),
+        'app_key'    => env('IAM_VENDOR_APP_KEY'),
+        'public_key' => env('IAM_VENDOR_PUBLIC_KEY'),
+        'secret_key' => env('IAM_VENDOR_SECRET_KEY'),
+        'debug'      => env('IAM_VENDOR_DEBUG', false),
+    ],
+    'iam_client' => [
+        'api_url'    => env('IAM_API_URL'),
+        'app_key'    => env('IAM_CLIENT_APP_KEY'),
+        'secret_key' => env('IAM_CLIENT_SECRET_KEY'),
+        'debug'      => env('IAM_CLIENT_DEBUG', false),
+    ],
+    'iam_admin' => [
+        'api_url'    => env('IAM_API_URL'),
+        'app_key'    => env('IAM_ADMIN_APP_KEY'),
+        'secret_key' => env('IAM_ADMIN_SECRET_KEY'),
+        'debug'      => env('IAM_ADMIN_DEBUG', false),
+    ],
+    // Ajoutez d'autres blocs selon vos besoins...
+];
+```
+
+### Côté Backend SaaS — Controller multi-tenant
+
+Tous les controllers Native (`config`, `exchange`, `check-token`, `logout`) doivent lire le header :
+
+```php
+class NativeConfigController extends Controller
+{
+    public function getConfig(Request $request): JsonResponse
+    {
+        // Multi-tenant : résolution dynamique du préfixe
+        $prefix = $request->header('X-IAM-Config-Prefix', 'iam');
+        
+        // Sécurité : valider que le préfixe commence par "iam"
+        if (!str_starts_with($prefix, 'iam')) {
+            return response()->json(['success' => false, 'message' => 'Invalid config prefix'], 400);
+        }
+        
+        $appKey    = config("services.{$prefix}.app_key");
+        $secretKey = config("services.{$prefix}.secret_key");
+        $debug     = (bool) config("services.{$prefix}.debug", false);
+        
+        if (!$appKey || !$secretKey) {
+            return response()->json([
+                'success' => false,
+                'message' => "Configuration '{$prefix}' non trouvée",
+            ], 404);
+        }
+
+        // Chiffrement Opaque Token (AES-256-CBC)
+        $payload = json_encode(['secret_key' => $secretKey, 'ts' => time()]);
+        $key = hash('sha256', $secretKey, true);
+        $iv = random_bytes(16);
+        $encrypted = openssl_encrypt($payload, 'AES-256-CBC', $key, 0, $iv);
+        $encryptedCredentials = base64_encode($iv . '::' . $encrypted);
+
+        return response()->json([
+            'success' => true,
+            'app_key' => $appKey,
+            'encrypted_credentials' => $encryptedCredentials,
+            'credentials_ttl' => 300,
+            'debug' => $debug,
+        ]);
+    }
+}
+```
+
+> **⚠️ Important** : Appliquez la même logique `X-IAM-Config-Prefix` dans `exchange`, `check-token` et `logout`.
+
+---
+
+## Debug Mode — Troubleshooting
+
+Le debug est **piloté par le backend** : le package n'a aucun prop `debug`.
+
+### Comment ça marche
+
+1. Le backend lit `IAM_DEBUG` (ou `IAM_VENDOR_DEBUG`, etc.) depuis `.env`
+2. `GET /api/native/config` retourne `"debug": true`
+3. Le package active les logs console + le `DebugPanel`
+4. Le `DebugPanel` est **réactif** : il apparaît automatiquement après le chargement des credentials
+
+### Checklist de troubleshooting
+
+| Problème | Solution |
+|----------|----------|
+| `DebugPanel` n'apparaît pas | Vérifier que `GET /api/native/config` retourne `"debug": true` dans la réponse JSON |
+| La valeur est toujours `false` | Vérifier le `.env` : pas de typo ! (`IAM_DEBUG` et non `IAM_DEBUGL`) |
+| Changement non pris en compte | Lancer `php artisan config:clear && php artisan config:cache` |
+| Debug actif en production | Mettre `IAM_DEBUG=false` dans le `.env` de production |
+| Debug marche pour main mais pas vendor | Vérifier `IAM_VENDOR_DEBUG=true` dans `.env` + `config/services.php` |
+
+### ⚠️ Erreur fréquente : typo dans `.env`
+
+```env
+# ❌ MAUVAIS (typo "DEBUGL" avec un L en trop)
+IAM_DEBUGL=true
+
+# ✅ CORRECT
+IAM_DEBUG=true
+```
+
+Après correction, n'oubliez pas :
+```bash
+php artisan config:clear
+php artisan config:cache
+```
 
 ---
 

package/dist/components/AppsLogoSlider.d.ts

@@ -4,6 +4,7 @@
 interface AppsLogoSliderProps {
     speed?: 'slow' | 'normal' | 'fast';
     className?: string;
+    iamApiUrl?: string;
 }
-export declare function AppsLogoSlider({ speed, className }: AppsLogoSliderProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function AppsLogoSlider({ speed, className, iamApiUrl: iamApiUrlProp }: AppsLogoSliderProps): import("react/jsx-runtime").JSX.Element | null;
 export default AppsLogoSlider;

package/dist/components/NativeSSOPage.d.ts

@@ -22,6 +22,11 @@ export interface NativeSSOPageProps {
     }) => void;
     /** Type de compte à persister dans localStorage (défaut: 'user') */
     accountType?: 'user' | 'client';
+    /**
+     * Préfixe de configuration IAM côté backend (défaut: 'iam').
+     * Permet le multi-tenant : 'iam', 'iam_vendor', 'iam_client', 'iam_admin', etc.
+     */
+    configPrefix?: string;
     /** Titre personnalisé */
     title?: string;
     /** Description personnalisée */
@@ -30,6 +35,10 @@ export interface NativeSSOPageProps {
     logoUrl?: string;
     /** Masquer le footer "Propulsé par" */
     hideFooter?: boolean;
+    /** Route vers laquelle rediriger après un login réussi (via window.location.href) */
+    redirectAfterLogin?: string;
+    /** Route vers laquelle rediriger après un logout (via window.location.href) */
+    redirectAfterLogout?: string;
 }
-export declare function NativeSSOPage({ saasApiUrl, iamApiUrl, onLoginSuccess, onLogout, onOnboardingComplete, accountType, title, description, logoUrl, hideFooter, }: NativeSSOPageProps): import("react/jsx-runtime").JSX.Element;
+export declare function NativeSSOPage({ saasApiUrl, iamApiUrl, onLoginSuccess, onLogout, onOnboardingComplete, accountType, configPrefix, title, description, logoUrl, hideFooter, redirectAfterLogin, redirectAfterLogout, }: NativeSSOPageProps): import("react/jsx-runtime").JSX.Element;
 export default NativeSSOPage;

package/dist/hooks/useNativeAuth.d.ts

@@ -14,6 +14,11 @@ export interface UseNativeAuthOptions {
     autoLoadCredentials?: boolean;
     /** Type de compte par défaut à persister (défaut: 'user') */
     defaultAccountType?: 'user' | 'client';
+    /**
+     * Préfixe de configuration IAM côté backend (défaut: 'iam').
+     * Permet le multi-tenant dynamique : 'iam', 'iam_vendor', 'iam_client', etc.
+     */
+    configPrefix?: string;
 }
 export declare function useNativeAuth(options: UseNativeAuthOptions): {
     credentialsLoaded: boolean;
@@ -49,6 +54,8 @@ export declare function useNativeAuth(options: UseNativeAuthOptions): {
     error: string | null;
     errorType: string | null;
     isAuthenticated: boolean;
+    /** Debug réactif — mis à jour après loadCredentials */
+    isDebug: boolean;
     accountType: AccountType;
     isPhoneOnly: boolean;
     otpMethod: "email" | "sms" | null | undefined;

package/dist/index.cjs

@@ -454,7 +454,8 @@ let config = {
   saasApiUrl: "",
   iamApiUrl: "",
   timeout: 3e4,
-  debug: false
+  debug: false,
+  configPrefix: "iam"
 };
 const setNativeAuthConfig = (newConfig) => {
   config = { ...config, ...newConfig };
@@ -574,7 +575,7 @@ async function fetchWithTimeout(url, options, timeout) {
     throw new ApiError("Erreur inattendue", "unknown");
   }
 }
-function getHeaders(token) {
+function getHeaders(token, includeConfigPrefix = false) {
   const headers = {
     "Content-Type": "application/json",
     "Accept": "application/json"
@@ -583,6 +584,9 @@ function getHeaders(token) {
   if (deviceId) {
     headers["X-Device-Id"] = deviceId;
   }
+  if (includeConfigPrefix && config.configPrefix) {
+    headers["X-IAM-Config-Prefix"] = config.configPrefix;
+  }
   if (token) {
     headers["Authorization"] = `Bearer ${token}`;
   }
@@ -630,7 +634,7 @@ const nativeAuthService = {
     }
     const response = await fetchWithTimeout(
       `${config2.saasApiUrl}/native/config`,
-      { method: "GET", headers: getHeaders() },
+      { method: "GET", headers: getHeaders(void 0, true) },
       config2.timeout || 3e4
     );
     if (!response.success || !response.encrypted_credentials || !response.app_key) {
@@ -805,7 +809,7 @@ const nativeAuthService = {
       `${config2.saasApiUrl}/native/exchange`,
       {
         method: "POST",
-        headers: getHeaders(),
+        headers: getHeaders(void 0, true),
         body: JSON.stringify({ callback_token: callbackToken })
       },
       config2.timeout || 3e4
@@ -834,7 +838,7 @@ const nativeAuthService = {
         `${cfg.saasApiUrl}/native/check-token`,
         {
           method: "POST",
-          headers: getHeaders(token)
+          headers: getHeaders(token, true)
         },
         1e4
       );
@@ -856,7 +860,7 @@ const nativeAuthService = {
         `${config2.saasApiUrl}/native/logout`,
         {
           method: "POST",
-          headers: getHeaders(token)
+          headers: getHeaders(token, true)
         },
         config2.timeout || 3e4
       );
@@ -1641,15 +1645,15 @@ function getErrorMessage$1(err, context) {
   return { message: `Erreur lors de ${context}`, type: "unknown" };
 }
 function useNativeAuth(options) {
-  const { saasApiUrl, iamApiUrl, autoLoadCredentials = true, defaultAccountType = "user" } = options;
+  const { saasApiUrl, iamApiUrl, autoLoadCredentials = true, defaultAccountType = "user", configPrefix = "iam" } = options;
   const configuredRef = react.useRef(false);
-  const debug = isDebugMode();
+  const [isDebug, setIsDebug] = react.useState(isDebugMode());
   react.useEffect(() => {
     if (!configuredRef.current) {
-      setNativeAuthConfig({ saasApiUrl, iamApiUrl });
+      setNativeAuthConfig({ saasApiUrl, iamApiUrl, configPrefix });
       configuredRef.current = true;
     }
-  }, [saasApiUrl, iamApiUrl]);
+  }, [saasApiUrl, iamApiUrl, configPrefix]);
   const [state, setState] = react.useState({
     credentialsLoaded: false,
     processToken: null,
@@ -1667,7 +1671,7 @@ function useNativeAuth(options) {
   });
   const [accountType, setAccountType] = react.useState("email");
   const handleTokenInvalid = react.useCallback(() => {
-    if (debug) console.log("🔐 [HealthCheck] Token invalide — déconnexion locale");
+    if (isDebug) console.log("🔐 [HealthCheck] Token invalide — déconnexion locale");
     clearSession();
     setState({
       credentialsLoaded: false,
@@ -1684,7 +1688,7 @@ function useNativeAuth(options) {
       otpMethod: null,
       otpSentTo: null
     });
-  }, [debug]);
+  }, [isDebug]);
   const handleUserUpdated = react.useCallback((userInfos) => {
     const storedRaw = localStorage.getItem(STORAGE.USER);
     if (storedRaw) {
@@ -1702,7 +1706,7 @@ function useNativeAuth(options) {
     saasApiUrl,
     onTokenInvalid: handleTokenInvalid,
     onUserUpdated: handleUserUpdated,
-    debug
+    debug: isDebug
   });
   react.useEffect(() => {
     const storedToken = localStorage.getItem(STORAGE.AUTH_TOKEN) || localStorage.getItem(STORAGE.TOKEN);
@@ -1725,23 +1729,25 @@ function useNativeAuth(options) {
     if (state.status === "completed" || !state.credentialsLoaded) return;
     const ttl = nativeAuthService.getCredentialsTtl();
     const refreshInterval = Math.max((ttl - 30) * 1e3, 3e4);
-    if (debug) {
+    if (isDebug) {
       console.log(`🔄 [Native] Auto-refresh credentials every ${refreshInterval / 1e3}s (TTL: ${ttl}s)`);
     }
     const timer = setInterval(async () => {
       try {
         await nativeAuthService.loadCredentials();
-        if (debug) console.log("✅ [Native] Credentials auto-refreshed");
+        setIsDebug(isDebugMode());
+        if (isDebugMode()) console.log("✅ [Native] Credentials auto-refreshed");
       } catch (err) {
-        if (debug) console.warn("⚠️ [Native] Auto-refresh failed:", err);
+        if (isDebugMode()) console.warn("⚠️ [Native] Auto-refresh failed:", err);
       }
     }, refreshInterval);
     return () => clearInterval(timer);
-  }, [state.status, state.credentialsLoaded, debug]);
+  }, [state.status, state.credentialsLoaded, isDebug]);
   const loadCredentials = react.useCallback(async () => {
     setState((prev) => ({ ...prev, loading: true, error: null }));
     try {
       await nativeAuthService.loadCredentials();
+      setIsDebug(isDebugMode());
       setState((prev) => ({ ...prev, credentialsLoaded: true, loading: false }));
       return { success: true };
     } catch (err) {
@@ -2229,6 +2235,8 @@ function useNativeAuth(options) {
     error: state.error,
     errorType: state.errorType,
     isAuthenticated: state.status === "completed" && state.user !== null,
+    /** Debug réactif — mis à jour après loadCredentials */
+    isDebug,
     accountType,
     isPhoneOnly: accountType === "phone-only",
     otpMethod: state.otpMethod,
@@ -2946,17 +2954,18 @@ function PhoneInput({
     ] })
   ] });
 }
-function AppsLogoSlider({ speed = "normal", className = "" }) {
+function AppsLogoSlider({ speed = "normal", className = "", iamApiUrl: iamApiUrlProp }) {
   const scrollRef = react.useRef(null);
   const [isPaused, setIsPaused] = react.useState(false);
   const [applications, setApplications] = react.useState([]);
   const [isLoading, setIsLoading] = react.useState(true);
   const speedMap = { slow: 50, normal: 30, fast: 15 };
   react.useEffect(() => {
+    const resolvedIamApiUrl = iamApiUrlProp || getNativeAuthConfig().iamApiUrl;
+    if (!resolvedIamApiUrl) return;
     const fetchApps = async () => {
       try {
-        const config2 = getNativeAuthConfig();
-        const iamBaseUrl = config2.iamApiUrl.replace("/api", "");
+        const iamBaseUrl = resolvedIamApiUrl.replace("/api", "");
         const response = await fetch(`${iamBaseUrl}/api/public/applications`, { headers: { "Accept": "application/json" } });
         if (response.ok) {
           const data = await response.json();
@@ -2968,7 +2977,7 @@ function AppsLogoSlider({ speed = "normal", className = "" }) {
       }
     };
     fetchApps();
-  }, []);
+  }, [iamApiUrlProp]);
   react.useEffect(() => {
     const container = scrollRef.current;
     if (!container || applications.length === 0) return;
@@ -2985,8 +2994,8 @@ function AppsLogoSlider({ speed = "normal", className = "" }) {
   const getLogoUrl = (logo) => {
     if (!logo) return null;
     if (logo.startsWith("http")) return logo;
-    const config2 = getNativeAuthConfig();
-    return `${config2.iamApiUrl.replace("/api", "")}/storage/applications/${logo}`;
+    const resolvedUrl = iamApiUrlProp || getNativeAuthConfig().iamApiUrl;
+    return `${resolvedUrl.replace("/api", "")}/storage/applications/${logo}`;
   };
   if (isLoading) {
     return /* @__PURE__ */ jsxRuntime.jsx("div", { className, style: { overflow: "hidden" }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", gap: "1rem", padding: "0.5rem 0" }, children: [1, 2, 3, 4, 5].map((i) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { flexShrink: 0, display: "flex", flexDirection: "column", alignItems: "center", gap: "0.5rem" }, children: [
@@ -3581,7 +3590,7 @@ function SignupModal({ open, onOpenChange, onSwitchToLogin, onSignupSuccess, saa
         /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: "Ouvrez un compte Ollaid" }),
         /* @__PURE__ */ jsxRuntime.jsx(DialogDescription, { children: "Un compte unique qui vous donne accès à toutes les applications" })
       ] }),
-      /* @__PURE__ */ jsxRuntime.jsx(AppsLogoSlider, {}),
+      /* @__PURE__ */ jsxRuntime.jsx(AppsLogoSlider, { iamApiUrl }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { style: { display: "flex", flexDirection: "column", gap: "0.75rem", fontSize: "0.875rem", color: C$1.gray500, margin: "1rem 0" }, children: ["Un seul compte pour toutes les applications", "Plus besoin de multiples mots de passe", "Connexion simplifiée et sécurisée"].map((text) => /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { display: "flex", alignItems: "center", gap: "0.75rem" }, children: [
         /* @__PURE__ */ jsxRuntime.jsx(IconCheckCircle2, { style: { width: "1.25rem", height: "1.25rem", color: C$1.green, flexShrink: 0 } }),
         text
@@ -4136,10 +4145,13 @@ function NativeSSOPage({
   onLogout,
   onOnboardingComplete,
   accountType = "user",
+  configPrefix = "iam",
   title = "Un compte, plusieurs accès",
   description = "Connectez-vous avec votre compte Ollaid pour accéder à toutes les applications partenaires.",
   logoUrl,
-  hideFooter = false
+  hideFooter = false,
+  redirectAfterLogin,
+  redirectAfterLogout
 }) {
   const [modal, setModal] = react.useState("none");
   const [showOnboarding, setShowOnboarding] = react.useState(false);
@@ -4153,7 +4165,7 @@ function NativeSSOPage({
     }
     return null;
   });
-  const resolvedDebug = isDebugMode();
+  const { isDebug: resolvedDebug } = useNativeAuth({ saasApiUrl, iamApiUrl, configPrefix, autoLoadCredentials: true });
   react.useEffect(() => {
     const root = document.documentElement;
     const originalValues = {};
@@ -4208,8 +4220,9 @@ function NativeSSOPage({
     } else {
       setSession({ token, user: userObj });
       onLoginSuccess == null ? void 0 : onLoginSuccess(token, user);
+      if (redirectAfterLogin) window.location.href = redirectAfterLogin;
     }
-  }, [onLoginSuccess]);
+  }, [onLoginSuccess, redirectAfterLogin]);
   const handleOnboardingComplete = react.useCallback((data) => {
     if (!pendingSession) return;
     const updatedUser = { ...pendingSession.user, ...data };
@@ -4219,14 +4232,16 @@ function NativeSSOPage({
     setPendingSession(null);
     onOnboardingComplete == null ? void 0 : onOnboardingComplete(data);
     onLoginSuccess == null ? void 0 : onLoginSuccess(pendingSession.token, updatedUser);
-  }, [pendingSession, onLoginSuccess, onOnboardingComplete]);
+    if (redirectAfterLogin) window.location.href = redirectAfterLogin;
+  }, [pendingSession, onLoginSuccess, onOnboardingComplete, redirectAfterLogin]);
   const handleOnboardingSkip = react.useCallback(() => {
     if (!pendingSession) return;
     setShowOnboarding(false);
     setSession(pendingSession);
     setPendingSession(null);
     onLoginSuccess == null ? void 0 : onLoginSuccess(pendingSession.token, pendingSession.user);
-  }, [pendingSession, onLoginSuccess]);
+    if (redirectAfterLogin) window.location.href = redirectAfterLogin;
+  }, [pendingSession, onLoginSuccess, redirectAfterLogin]);
   const handleLogout = react.useCallback(() => {
     localStorage.removeItem(STORAGE.AUTH_TOKEN);
     localStorage.removeItem(STORAGE.TOKEN);
@@ -4235,7 +4250,8 @@ function NativeSSOPage({
     localStorage.removeItem(STORAGE.ALIAS_REFERENCE);
     setSession(null);
     onLogout == null ? void 0 : onLogout();
-  }, [onLogout]);
+    if (redirectAfterLogout) window.location.href = redirectAfterLogout;
+  }, [onLogout, redirectAfterLogout]);
   const containerStyle = {
     minHeight: "100vh",
     backgroundColor: COLORS.primary,
@@ -4270,7 +4286,7 @@ function NativeSSOPage({
   ] }) });
   if (session) {
     return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle, children: [
-      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "100%", maxWidth: "28rem", marginBottom: "1.5rem" }, children: /* @__PURE__ */ jsxRuntime.jsx(AppsLogoSlider, {}) }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "100%", maxWidth: "28rem", marginBottom: "1.5rem" }, children: /* @__PURE__ */ jsxRuntime.jsx(AppsLogoSlider, { iamApiUrl }) }),
       /* @__PURE__ */ jsxRuntime.jsx("div", { style: cardStyle, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: "2rem 1.5rem 1.5rem" }, children: [
         /* @__PURE__ */ jsxRuntime.jsx(BrandingHeader, {}),
         /* @__PURE__ */ jsxRuntime.jsxs("h2", { style: { fontSize: "1.25rem", fontWeight: 600, textAlign: "center", color: COLORS.cardForeground }, children: [
@@ -4290,7 +4306,7 @@ function NativeSSOPage({
     ] });
   }
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { style: containerStyle, children: [
-    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "100%", maxWidth: "28rem", marginBottom: "1.5rem" }, children: logoUrl ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoUrl, alt: "Logo", style: { height: "3rem", margin: "0 auto" } }) : /* @__PURE__ */ jsxRuntime.jsx(AppsLogoSlider, {}) }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { style: { width: "100%", maxWidth: "28rem", marginBottom: "1.5rem" }, children: logoUrl ? /* @__PURE__ */ jsxRuntime.jsx("img", { src: logoUrl, alt: "Logo", style: { height: "3rem", margin: "0 auto" } }) : /* @__PURE__ */ jsxRuntime.jsx(AppsLogoSlider, { iamApiUrl }) }),
     /* @__PURE__ */ jsxRuntime.jsx("div", { style: cardStyle, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { style: { padding: "2rem 1.5rem 1.5rem" }, children: [
       /* @__PURE__ */ jsxRuntime.jsx(BrandingHeader, {}),
       /* @__PURE__ */ jsxRuntime.jsx("h2", { style: { fontSize: "1.25rem", fontWeight: 600, textAlign: "center", color: COLORS.cardForeground, marginBottom: "0.5rem" }, children: title }),