address comments

dashboard/.eslintrc.json

@@ -33,12 +33,7 @@
     ],
     "@typesecript-eslint/consistent-type-imports": "off",
     "@typescript-eslint/strict-boolean-expressions": "off",
-    "@typescript-eslint/no-misused-promises": [
-      "error",
-      {
-        "checksVoidReturn": false
-      }
-    ],
+    "@typescript-eslint/no-misused-promises": "error",
     "@typescript-eslint/no-floating-promises": [
       "error",
       {

dashboard/src/main/Main.tsx

@@ -8,12 +8,6 @@ import { Context } from "shared/Context";
 import { PorterUrls, type PorterUrl } from "shared/routing";
 
 import { AuthnContext } from "../shared/auth/AuthnContext";
-import Login from "./auth/Login";
-import Register from "./auth/Register";
-import ResetPasswordFinalize from "./auth/ResetPasswordFinalize";
-import ResetPasswordInit from "./auth/ResetPasswordInit";
-import SetInfo from "./auth/SetInfo";
-import VerifyEmail from "./auth/VerifyEmail";
 import CurrentError from "./CurrentError";
 import Home from "./home/Home";
 
@@ -22,22 +16,13 @@ type PropsType = {};
 const Main: React.FC<PropsType> = () => {
   const {
     currentError,
-    user,
     setCurrentError,
     setEdition,
     setEnableGitlab,
     currentProject,
     currentCluster,
   } = useContext(Context);
-  const {
-    authenticate,
-    handleLogOut,
-    isLoggedIn,
-    isLoading,
-    hasInfo,
-    isEmailVerified,
-  } = useContext(AuthnContext);
-  const [local, setLocal] = useState(false);
+  const { handleLogOut } = useContext(AuthnContext);
   const [version, setVersion] = useState("");
 
   useEffect(() => {
@@ -47,9 +32,7 @@ const Main: React.FC<PropsType> = () => {
       .then((res) => {
         setVersion(res.data?.version);
       })
-      .catch((err) => {
-        console.log(err);
-      });
+      .catch(() => {});
 
     const urlParams = new URLSearchParams(window.location.search);
     const error = urlParams.get("error");
@@ -59,110 +42,30 @@ const Main: React.FC<PropsType> = () => {
       .getMetadata("", {}, {})
       .then((res) => {
         setEdition(res.data?.version);
-        setLocal(!res.data?.provisioner);
         setEnableGitlab(!!res.data?.gitlab);
       })
-      .catch((err) => {
-        console.log(err);
-      });
+      .catch(() => {});
   }, []);
 
-  const renderMain = () => {
-    if (isLoading || !version) {
+  const renderMain = (): JSX.Element => {
+    if (!version || !currentProject || !currentCluster) {
       return <Loading />;
     }
 
-    // if logged in but not verified, block until email verification
-    if (!local && isLoggedIn && !isEmailVerified) {
-      return (
-        <Switch>
-          <Route
-            path="/"
-            render={() => {
-              return <VerifyEmail handleLogOut={handleLogOut} />;
-            }}
-          />
-        </Switch>
-      );
-    }
-
-    // Handle case where new user signs up via OAuth and has not set name and company
-    if (version === "production" && !hasInfo && user?.id > 9312 && isLoggedIn) {
-      return (
-        <Switch>
-          <Route
-            path="/"
-            render={() => {
-              return (
-                <SetInfo
-                  handleLogOut={handleLogOut}
-                  authenticate={authenticate}
-                />
-              );
-            }}
-          />
-        </Switch>
-      );
-    }
-
     return (
       <Switch>
-        <Route
-          path="/login"
-          render={() => {
-            if (!isLoggedIn) {
-              return <Login authenticate={authenticate} />;
-            } else {
-              return <Redirect to="/" />;
-            }
-          }}
-        />
-        <Route
-          path="/register"
-          render={() => {
-            if (!isLoggedIn) {
-              return <Register authenticate={authenticate} />;
-            } else {
-              return <Redirect to="/" />;
-            }
-          }}
-        />
-        <Route
-          path="/password/reset/finalize"
-          render={() => {
-            if (!isLoggedIn) {
-              return <ResetPasswordFinalize />;
-            } else {
-              return <Redirect to="/" />;
-            }
-          }}
-        />
-        <Route
-          path="/password/reset"
-          render={() => {
-            if (!isLoggedIn) {
-              return <ResetPasswordInit />;
-            } else {
-              return <Redirect to="/" />;
-            }
-          }}
-        />
         <Route
           exact
           path="/"
           render={() => {
-            if (isLoggedIn) {
-              return <Redirect to="/dashboard" />;
-            } else {
-              return <Redirect to="/login" />;
-            }
+            return <Redirect to="/dashboard" />;
           }}
         />
         <Route
           path={`/:baseRoute/:cluster?/:namespace?`}
           render={(routeProps) => {
             const baseRoute = routeProps.match.params.baseRoute;
-            if (isLoggedIn && PorterUrls.includes(baseRoute)) {
+            if (PorterUrls.includes(baseRoute)) {
               return (
                 <Home
                   key="home"

dashboard/src/main/auth/Login.tsx

@@ -21,7 +21,7 @@ import GoogleIcon from "assets/GoogleIcon";
 import logo from "assets/logo.png";
 
 type Props = {
-  authenticate: () => void;
+  authenticate: () => Promise<void>;
 };
 
 const getWindowDimensions = () => {
@@ -56,7 +56,7 @@ const Login: React.FC<Props> = ({ authenticate }) => {
             window.location.href = res.data.redirect;
           } else {
             setUser(res?.data?.id, res?.data?.email);
-            authenticate();
+            authenticate().catch(() => {});
           }
         })
         .catch((err) => {

dashboard/src/main/auth/Register.tsx

@@ -20,7 +20,7 @@ import logo from "assets/logo.png";
 import InfoPanel from "./InfoPanel";
 
 type Props = {
-  authenticate: () => void;
+  authenticate: () => Promise<void>;
 };
 
 const getWindowDimensions = () => {
@@ -126,7 +126,7 @@ const Register: React.FC<Props> = ({ authenticate }) => {
             window.location.href = res.data.redirect;
           } else {
             setUser(res?.data?.id, res?.data?.email);
-            authenticate();
+            authenticate().catch(() => {});
 
             try {
               window.dataLayer?.push({

dashboard/src/main/auth/SetInfo.tsx

@@ -19,7 +19,7 @@ import logo from "assets/logo.png";
 import InfoPanel from "./InfoPanel";
 
 type Props = {
-  authenticate: () => void;
+  authenticate: () => Promise<void>;
   handleLogOut: () => void;
 };
 
@@ -69,7 +69,7 @@ const SetInfo: React.FC<Props> = ({ authenticate, handleLogOut }) => {
           { id: user.id }
         )
         .then((res: any) => {
-          authenticate();
+          authenticate().catch(() => {});
 
           try {
             window.dataLayer?.push({

dashboard/src/shared/auth/AuthnContext.tsx

@@ -1,19 +1,28 @@
 import React, { useContext, useEffect, useState } from "react";
+import { Redirect, Route, Switch } from "react-router-dom";
 
 import api from "shared/api";
 import { Context } from "shared/Context";
 
+import Loading from "../../components/Loading";
+import Login from "../../main/auth/Login";
+import Register from "../../main/auth/Register";
+import ResetPasswordFinalize from "../../main/auth/ResetPasswordFinalize";
+import ResetPasswordInit from "../../main/auth/ResetPasswordInit";
+import SetInfo from "../../main/auth/SetInfo";
+import VerifyEmail from "../../main/auth/VerifyEmail";
+
 type AuthnState = {
   userId: number;
-  isLoggedIn: boolean;
-  isEmailVerified: boolean;
   handleLogOut: () => void;
-  authenticate: () => void;
-  isLoading: boolean;
-  hasInfo: boolean;
 };
 
-export const AuthnContext = React.createContext<AuthnState>({} as AuthnState);
+const NilAuthnState = {
+    userId: -1,
+    handleLogOut: () => {},
+};
+
+export const AuthnContext = React.createContext<AuthnState>(NilAuthnState);
 
 const AuthnProvider = ({
   children,
@@ -26,13 +35,14 @@ const AuthnProvider = ({
   const [isLoading, setIsLoading] = useState(true);
   const [userId, setUserId] = useState(-1);
   const [hasInfo, setHasInfo] = useState(false);
+  const [local, setLocal] = useState(false);
 
-  const authenticate = (): void => {
+  const authenticate = async (): Promise<void> => {
     api
       .checkAuth("", {}, {})
       .then((res) => {
         if (res?.data) {
-          setUser(res.data.id, res.data.email);
+          setUser?.(res.data.id, res.data.email);
           setIsLoggedIn(true);
           setIsEmailVerified(res.data.email_verified);
           setHasInfo(res.data.company_name && true);
@@ -40,12 +50,18 @@ const AuthnProvider = ({
           setUserId(res.data.id);
         } else {
           setIsLoggedIn(false);
+          setIsEmailVerified(false);
+          setHasInfo(false);
           setIsLoading(false);
+          setUserId(-1);
         }
       })
       .catch(() => {
         setIsLoggedIn(false);
+        setIsEmailVerified(false);
+        setHasInfo(false);
         setIsLoading(false);
+        setUserId(-1);
       });
   };
 
@@ -57,28 +73,106 @@ const AuthnProvider = ({
       .then(() => {
         setIsLoggedIn(false);
         setIsEmailVerified(false);
-        clearContext();
+        clearContext?.();
         localStorage.clear();
       })
       .catch((err) => {
-        setCurrentError(err.response?.data.errors[0]);
+        setCurrentError?.(err.response?.data.errors[0]);
       });
   };
 
   useEffect(() => {
-    authenticate();
+    authenticate().catch(() => {});
+
+    // check if porter server is local (does not require email verification)
+    api
+      .getMetadata("", {}, {})
+      .then((res) => {
+        setLocal(!res.data?.provisioner);
+      })
+      .catch(() => {});
   }, []);
 
+  if (isLoading) {
+    return <Loading />;
+  }
+
+  // return unauthenticated routes
+  if (!isLoggedIn) {
+    return (
+      <Switch>
+        <Route
+          path="/login"
+          render={() => {
+            return <Login authenticate={authenticate} />;
+          }}
+        />
+        <Route
+          path="/register"
+          render={() => {
+            return <Register authenticate={authenticate} />;
+          }}
+        />
+        <Route
+          path="/password/reset/finalize"
+          render={() => {
+            return <ResetPasswordFinalize />;
+          }}
+        />
+        <Route
+          path="/password/reset"
+          render={() => {
+            return <ResetPasswordInit />;
+          }}
+        />
+        <Route
+          path="*"
+          render={() => {
+            return <Redirect to="/login" />;
+          }}
+        />
+      </Switch>
+    );
+  }
+
+  // if logged in but not verified, block until email verification
+  if (!local && !isEmailVerified) {
+    return (
+      <Switch>
+        <Route
+          path="/"
+          render={() => {
+            return <VerifyEmail handleLogOut={handleLogOut} />;
+          }}
+        />
+      </Switch>
+    );
+  }
+
+  // Handle case where new user signs up via OAuth and has not set name and company
+  if (!hasInfo && userId > 9312) {
+    return (
+      <Switch>
+        <Route
+          path="/"
+          render={() => {
+            return (
+              <SetInfo
+                handleLogOut={handleLogOut}
+                authenticate={authenticate}
+              />
+            );
+          }}
+        />
+      </Switch>
+    );
+  }
+
   return (
     <AuthnContext.Provider
       value={{
-        isLoading,
         userId,
-        isLoggedIn,
-        isEmailVerified,
-        hasInfo,
         handleLogOut,
-        authenticate,
       }}
     >
       {children}