added login redirect

src/navigation/Router.tsx

@@ -9,6 +9,7 @@ import { getWhitelabel } from "services/whiteLabel";
 import Ventilation from "pages/VentEditor";
 import { useGlobalState } from "providers"; 
 import DeviceSupport from "pages/DeviceSupport";
+import Login from "pages/Login";
 
 const DeviceHistory = lazy(() => import("pages/DeviceHistory"));
 const DevicePage = lazy(() => import("pages/Device"));
@@ -283,12 +284,12 @@ export default function Router() {
   };
 
   if (isLoading) return null;
-  if (!isAuthenticated) {
-    loginWithRedirect()
-    return (
-      null
-    )
-  }
+  // if (!isAuthenticated) {
+  //   loginWithRedirect()
+  //   return (
+  //     null
+  //   )
+  // }
 
   function ErrorFallback({ error }: { error: Error }) {
     return <div>Something went wrong: {error.stack}</div>;
@@ -302,6 +303,7 @@ export default function Router() {
           
           {/* Redirects */}
           <Route path="/callback" element={<Navigate to="/" />} />
+          <Route path="/login" element={<Login />} />
           {/* <Route path="/team/:teamID" element={<Navigate to="/teams/:teamID" />} /> */}
           {/* <Route path="/device/:deviceID" element={<Navigate to="/devices/:devicesID" />} /> */}
           <Route path="" element={<Navigate to={whiteLabel.homePage ? whiteLabel.homePage : "/devices"} />} />

src/pages/Login.tsx

@@ -0,0 +1,53 @@
+import { RedirectLoginOptions, useAuth0 } from "@auth0/auth0-react";
+// import { useAuth } from "hooks";
+import queryString from "query-string";
+import { useCallback, useEffect } from "react";
+import { useLocation } from "react-router";
+// import Loading from "./Loading";
+import LoadingScreen from "app/LoadingScreen";
+
+interface Props {
+  prevPath?: string;
+}
+
+export default function Login(props: Props) {
+  const { prevPath } = props;
+  const location = useLocation();
+  const { loginWithRedirect } = useAuth0();
+
+  const setRouteBeforeLogin = useCallback((): Promise<string> => {
+    return new Promise(function(resolve) {
+      localStorage.setItem("routeBeforeLogin", prevPath ? prevPath : "/");
+      return resolve("success");
+    });
+  }, [prevPath]);
+
+  useEffect(() => {
+    const options: RedirectLoginOptions = {
+      authorizationParams: {}  // Initialize here
+    };
+    console.log(location)
+    if (location && location.search) {
+      let parsed = queryString.parse(location.search);
+
+      console.log(parsed.signup)
+      if (parsed.signup === "true") {
+        // if (options.authorizationParams) options.authorizationParams.screen_hint = "signup"; // 'signup' tells Auth0 to show the signup tab
+        options.authorizationParams!.screen_hint = "signup"; // 'signup' tells Auth0 to show the signup tab
+        console.log(options)
+      }
+
+      if (parsed.email && parsed.email !== "") {
+        // if (options.authorizationParams) options.authorizationParams.login_hint = parsed.email.toString(); // prefill email
+        options.authorizationParams!.login_hint = parsed.email.toString(); // prefill email
+      }
+    }
+
+    setRouteBeforeLogin().finally(() => {
+      loginWithRedirect(options);
+    });
+  }, [location, loginWithRedirect, setRouteBeforeLogin]);
+
+  // return <LoadingScreen fullViewport={true} />;
+  return <LoadingScreen message="login redirect" />;
+}

src/user/UserMenu.tsx

@@ -14,7 +14,7 @@ import { useNavigate } from "react-router-dom";
 import TeamDialog from "teams/TeamDialog";
 import AccessObject from "./AccessObject";
 import { useSnackbar, useUserAPI } from "hooks";
-import { useThemeMode } from "theme/AppThemeProvider";
+// import { useThemeMode } from "theme/AppThemeProvider";
 
 const useStyles = makeStyles((theme: Theme) => ({
   accessIcon: {
@@ -76,7 +76,7 @@ const useStyles = makeStyles((theme: Theme) => ({
   
 export default function UserMenu() {
 
-  const { toggleMode } = useThemeMode()
+  // const { toggleMode } = useThemeMode()
   const [{ user, team, as }, dispatch] = useGlobalState();
   const { loginWithRedirect } = useAuth0();
   const classes = useStyles();
@@ -163,10 +163,6 @@ export default function UserMenu() {
             <Lock className={classes.rightIcon} fontSize="small" />
           )}
         </Button>
-
-        <IconButton onClick={/*toggleMode*/ () => {}} className={classes.rightIcon} aria-label="Toggle Theme">
-          <ThemeIcon />
-        </IconButton>
       </>
     );
   };