From 0b6daee28eb9fe3f252b6582a8b4c3666fff2e0f Mon Sep 17 00:00:00 2001
From: YanJin <yanjin.cheng@scality.com>
Date: Thu, 20 Mar 2025 18:45:36 +0100
Subject: [PATCH] ARTESCA-14759: We store the redirectUrl in the localstorage
 and this has become very flaky in the UI e2e test

Now we don't need to store it in the localstorage anymore, we can keep it in the state.
---
 shell-ui/src/FederatedApp.tsx      | 47 +++++++++++++-----------------
 shell-ui/src/auth/AuthProvider.tsx | 13 ++++-----
 shell-ui/src/navbar/index.spec.tsx | 12 ++++----
 3 files changed, 31 insertions(+), 41 deletions(-)

diff --git a/shell-ui/src/FederatedApp.tsx b/shell-ui/src/FederatedApp.tsx
index 816990eceb..2762f211ea 100644
--- a/shell-ui/src/FederatedApp.tsx
+++ b/shell-ui/src/FederatedApp.tsx
@@ -8,17 +8,10 @@ import {
   FederatedComponentProps,
   SolutionUI,
 } from '@scality/module-federation';
-import React, {
-  useEffect,
-  useLayoutEffect,
-  useMemo,
-  useTransition,
-  useRef,
-  useState,
-} from 'react';
+import React, { useEffect, useMemo } from 'react';
 import { ErrorBoundary } from 'react-error-boundary';
 import { QueryClient } from 'react-query';
-import { BrowserRouter, Route, Routes, useLocation } from 'react-router';
+import { BrowserRouter, Route, Routes } from 'react-router';
 
 import { loadShare } from '@module-federation/enhanced/runtime';
 import { useQuery } from 'react-query';
@@ -242,23 +235,21 @@ function InternalApp() {
   });
 
   return (
-    <BrowserRouter>
-      <ShellHistoryProvider>
-        <FirstTimeLoginProvider>
-          <NotificationCenterProvider>
-            {(status === 'idle' || status === 'loading') && (
-              <Loader size="massive" centered={true} aria-label="loading" />
-            )}
-            {status === 'error' && <ErrorPage500 data-cy="sc-error-page500" />}
-            {status === 'success' && (
-              <SolutionsNavbar>
-                <InternalRouter />
-              </SolutionsNavbar>
-            )}
-          </NotificationCenterProvider>
-        </FirstTimeLoginProvider>
-      </ShellHistoryProvider>
-    </BrowserRouter>
+    <ShellHistoryProvider>
+      <FirstTimeLoginProvider>
+        <NotificationCenterProvider>
+          {(status === 'idle' || status === 'loading') && (
+            <Loader size="massive" centered={true} aria-label="loading" />
+          )}
+          {status === 'error' && <ErrorPage500 data-cy="sc-error-page500" />}
+          {status === 'success' && (
+            <SolutionsNavbar>
+              <InternalRouter />
+            </SolutionsNavbar>
+          )}
+        </NotificationCenterProvider>
+      </FirstTimeLoginProvider>
+    </ShellHistoryProvider>
   );
 }
 
@@ -272,7 +263,9 @@ export function WithInitFederationProviders({
     <UIListProvider discoveryURL={shellConfig.discoveryUrl}>
       <ConfigurationProvider>
         <AuthConfigProvider>
-          <AuthProvider>{children}</AuthProvider>
+          <BrowserRouter>
+            <AuthProvider>{children}</AuthProvider>
+          </BrowserRouter>
         </AuthConfigProvider>
       </ConfigurationProvider>
     </UIListProvider>
diff --git a/shell-ui/src/auth/AuthProvider.tsx b/shell-ui/src/auth/AuthProvider.tsx
index a24c53b937..fdf70c94df 100644
--- a/shell-ui/src/auth/AuthProvider.tsx
+++ b/shell-ui/src/auth/AuthProvider.tsx
@@ -15,6 +15,7 @@ import type {
 import { useShellConfig } from '../initFederation/ShellConfigProvider';
 import { getUserGroups } from '../navbar/auth/permissionUtils';
 import { useAuthConfig } from './AuthConfigProvider';
+import { useNavigate } from 'react-router-dom';
 export function AuthProvider({ children }: { children: React.ReactNode }) {
   const { authConfig } = useAuthConfig();
 
@@ -101,6 +102,7 @@ function OAuth2AuthProvider({ children }: { children: React.ReactNode }) {
     });
   };
   const { logOut } = useInternalLogout(userManager, authConfig);
+  const navigate = useNavigate();
   //Force logout on silent renewal error
   useEffect(() => {
     const onSilentRenewError = (err) => {
@@ -125,15 +127,12 @@ function OAuth2AuthProvider({ children }: { children: React.ReactNode }) {
   }, [logOut]);
   const oidcConfig: AuthProviderProps = {
     onBeforeSignIn: () => {
-      localStorage.setItem('redirectUrl', window.location.href);
-      return window.location.href;
+      return location.pathname + location.search + location.hash;
     },
-    onSignIn: () => {
-      const savedRedirectUri = localStorage.getItem('redirectUrl');
-      localStorage.removeItem('redirectUrl');
-
+    onSignIn: (userData) => {
+      const savedRedirectUri = userData.state;
       if (savedRedirectUri) {
-        location.href = savedRedirectUri;
+        navigate(savedRedirectUri);
       } else {
         const searchParams = new URLSearchParams(location.search);
         searchParams.delete('state');
diff --git a/shell-ui/src/navbar/index.spec.tsx b/shell-ui/src/navbar/index.spec.tsx
index 0fa12aa77e..eb70072b6a 100644
--- a/shell-ui/src/navbar/index.spec.tsx
+++ b/shell-ui/src/navbar/index.spec.tsx
@@ -39,13 +39,11 @@ export const wrapper = ({ children }) => {
               <LanguageProvider>
                 <NotificationCenterProvider>
                   <WithInitFederationProviders>
-                    <MemoryRouter>
-                      <FirstTimeLoginProvider>
-                        <ShellHistoryProvider>
-                          <SolutionsNavbar>{children}</SolutionsNavbar>
-                        </ShellHistoryProvider>
-                      </FirstTimeLoginProvider>
-                    </MemoryRouter>
+                    <FirstTimeLoginProvider>
+                      <ShellHistoryProvider>
+                        <SolutionsNavbar>{children}</SolutionsNavbar>
+                      </ShellHistoryProvider>
+                    </FirstTimeLoginProvider>
                   </WithInitFederationProviders>
                 </NotificationCenterProvider>
               </LanguageProvider>