From 3971f300c4e650cb4a20ca30a4bd15f720a3efa2 Mon Sep 17 00:00:00 2001
From: Loup Theron <loup-rodney@hotmail.fr>
Date: Wed, 16 Oct 2024 16:43:11 +0200
Subject: [PATCH] Handle user auth api wait time

---
 .../vessel_sidebar/offline_management.spec.ts          |  2 +-
 frontend/src/auth/components/RequireAuth.tsx           | 10 ++++++++++
 frontend/src/auth/hooks/useGetUserAccount.tsx          |  8 ++++++--
 3 files changed, 17 insertions(+), 3 deletions(-)

diff --git a/frontend/cypress/e2e/main_window/vessel_sidebar/offline_management.spec.ts b/frontend/cypress/e2e/main_window/vessel_sidebar/offline_management.spec.ts
index 10718bfecf..e02de8547b 100644
--- a/frontend/cypress/e2e/main_window/vessel_sidebar/offline_management.spec.ts
+++ b/frontend/cypress/e2e/main_window/vessel_sidebar/offline_management.spec.ts
@@ -135,7 +135,7 @@ context('Offline management', () => {
     cy.intercept(
       {
         method: 'GET',
-        pathname: '/bff/v1/vessels/reporting',
+        pathname: '/bff/v1/vessels/reportings',
         times: 2
       },
       { statusCode: 400 }
diff --git a/frontend/src/auth/components/RequireAuth.tsx b/frontend/src/auth/components/RequireAuth.tsx
index eeae56f7fe..866138bd6f 100644
--- a/frontend/src/auth/components/RequireAuth.tsx
+++ b/frontend/src/auth/components/RequireAuth.tsx
@@ -1,12 +1,22 @@
 import { Navigate } from 'react-router-dom'
 
+import { LoginBackground } from './Login'
 import { UserAccountContext } from '../../context/UserAccountContext'
 import { paths } from '../../paths'
+import { LoadingSpinnerWall } from '../../ui/LoadingSpinnerWall'
 import { useGetUserAccount } from '../hooks/useGetUserAccount'
 
 export function RequireAuth({ children, redirect = false, requireSuperUser = false }) {
   const userAccount = useGetUserAccount()
 
+  if (!userAccount) {
+    return (
+      <LoginBackground>
+        <LoadingSpinnerWall isVesselShowed />
+      </LoginBackground>
+    )
+  }
+
   const handleRedirect = (path: string, shouldRedirect: boolean) => {
     if (shouldRedirect) {
       return <Navigate replace to={path} />
diff --git a/frontend/src/auth/hooks/useGetUserAccount.tsx b/frontend/src/auth/hooks/useGetUserAccount.tsx
index a53eec01bb..23213334ff 100644
--- a/frontend/src/auth/hooks/useGetUserAccount.tsx
+++ b/frontend/src/auth/hooks/useGetUserAccount.tsx
@@ -8,12 +8,12 @@ import { useGetCurrentUserAuthorizationQueryOverride } from './useGetCurrentUser
 
 import type { UserAccountContextType } from '../../context/UserAccountContext'
 
-const IS_CYPRESS = isCypress() || true
+const IS_CYPRESS = isCypress()
 
 /**
  * When using Cypress, we stub `useAuth()`
  */
-export function useGetUserAccount(): UserAccountContextType {
+export function useGetUserAccount(): UserAccountContextType | undefined {
   // `| undefined` because it's undefined if the OIDC is disabled which is the case for Cypress tests
   const auth = useAuth() as AuthContextProps | undefined
   const { trackUserId } = useTracking()
@@ -38,6 +38,10 @@ export function useGetUserAccount(): UserAccountContextType {
   }, [auth])
 
   const userAccount = useMemo(() => {
+    if (!user) {
+      return undefined
+    }
+
     if (IS_CYPRESS) {
       return {
         email: 'dummy@cypress.test',