diff --git a/app/scenes/Login/Login.tsx b/app/scenes/Login/Login.tsx index 02c97a136f..423ea1b7ab 100644 --- a/app/scenes/Login/Login.tsx +++ b/app/scenes/Login/Login.tsx @@ -70,6 +70,23 @@ function Login({ children, onBack }: Props) { ); const [lastVisitedPath] = useLastVisitedPath(); const [spendPostLoginPath] = usePostLoginPath(); + const hasRedirectedToOidc = React.useRef(false); + + const shouldRedirectToOidc = + !auth.authenticated && + !auth.isFetching && + config?.providers.length === 1 && + config.providers[0].id === "oidc" && + !env.OIDC_DISABLE_REDIRECT && + !query.get("notice") && + !query.get("logout"); + + React.useEffect(() => { + if (shouldRedirectToOidc && !hasRedirectedToOidc.current && config) { + hasRedirectedToOidc.current = true; + window.location.href = getRedirectUrl(config.providers[0].authUrl); + } + }, [shouldRedirectToOidc, config]); const handleReset = React.useCallback(() => { setEmailLinkSentTo(""); @@ -270,16 +287,10 @@ function Login({ children, onBack }: Props) { ); } - // If there is only one provider and it's OIDC, redirect immediately. - if ( - config.providers.length === 1 && - config.providers[0].id === "oidc" && - !env.OIDC_DISABLE_REDIRECT && - !query.get("notice") && - !query.get("logout") - ) { - window.location.href = getRedirectUrl(config.providers[0].authUrl); - return null; + // If there is only one provider and it's OIDC, the redirect is performed + // from the effect above – render a loading indicator while we wait. + if (shouldRedirectToOidc) { + return ; } return (