diff --git a/web/packages/teleport/src/Login/Login.story.tsx b/web/packages/teleport/src/Login/Login.story.tsx
index bf0b5cef983cb..5804c5f1701a8 100644
--- a/web/packages/teleport/src/Login/Login.story.tsx
+++ b/web/packages/teleport/src/Login/Login.story.tsx
@@ -43,6 +43,7 @@ const sample: State = {
isSuccess: true,
message: '',
},
+ checkingValidSession: false,
onLogin: () => null,
onLoginWithWebauthn: () => null,
onLoginWithSso: () => null,
diff --git a/web/packages/teleport/src/Login/Login.tsx b/web/packages/teleport/src/Login/Login.tsx
index 46cbe096fab26..932e0dc6eaf56 100644
--- a/web/packages/teleport/src/Login/Login.tsx
+++ b/web/packages/teleport/src/Login/Login.tsx
@@ -38,6 +38,7 @@ export function Login({
onLoginWithSso,
authProviders,
auth2faType,
+ checkingValidSession,
preferredMfaType,
isLocalAuthEnabled,
clearAttempt,
@@ -47,6 +48,12 @@ export function Login({
showMotd,
acknowledgeMotd,
}: State) {
+ // while we are checking if a session is valid, we don't return anything
+ // to prevent flickering. The check only happens for a frame or two so
+ // we avoid rendering a loader/indicator since that will flicker as well
+ if (checkingValidSession) {
+ return null;
+ }
return (
<>
diff --git a/web/packages/teleport/src/Login/useLogin.ts b/web/packages/teleport/src/Login/useLogin.ts
index 67fa354ed4240..17aed626c158e 100644
--- a/web/packages/teleport/src/Login/useLogin.ts
+++ b/web/packages/teleport/src/Login/useLogin.ts
@@ -16,16 +16,18 @@
* along with this program. If not, see .
*/
-import { useState } from 'react';
+import { useState, useEffect } from 'react';
import { useAttempt } from 'shared/hooks';
import { AuthProvider } from 'shared/services';
+import session from 'teleport/services/websession';
import history from 'teleport/services/history';
import cfg from 'teleport/config';
import auth, { UserCredentials } from 'teleport/services/auth';
export default function useLogin() {
const [attempt, attemptActions] = useAttempt({ isProcessing: false });
+ const [checkingValidSession, setCheckingValidSession] = useState(true);
const authProviders = cfg.getAuthProviders();
const auth2faType = cfg.getAuth2faType();
@@ -44,6 +46,14 @@ export default function useLogin() {
setShowMotd(false);
}
+ useEffect(() => {
+ if (session.isValid()) {
+ history.replace(cfg.routes.root);
+ return;
+ }
+ setCheckingValidSession(false);
+ }, []);
+
function onLogin(email, password, token) {
attemptActions.start();
auth
@@ -74,6 +84,7 @@ export default function useLogin() {
return {
attempt,
onLogin,
+ checkingValidSession,
onLoginWithSso,
authProviders,
auth2faType,