From c7848a25ef1d5e3ceab1e942d596d66fb41bf75f Mon Sep 17 00:00:00 2001 From: Carter Date: Wed, 25 Jun 2025 09:45:02 -0600 Subject: [PATCH] put the login page back --- src/navigation/Router.tsx | 4 ++- src/pages/Login.tsx | 51 +++++++++++++++++++++++++++++++++++++++ src/providers/auth.tsx | 44 ++++----------------------------- src/user/UserMenu.tsx | 3 +-- 4 files changed, 60 insertions(+), 42 deletions(-) create mode 100644 src/pages/Login.tsx diff --git a/src/navigation/Router.tsx b/src/navigation/Router.tsx index 698a9ac..666f487 100644 --- a/src/navigation/Router.tsx +++ b/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")); @@ -53,7 +54,7 @@ export const appendToUrl = (appendage: number | string) => { export default function Router() { - const { isLoading } = useAuth0(); + const { isAuthenticated, loginWithRedirect, isLoading } = useAuth0(); const whiteLabel = getWhitelabel(); const [{ user }] = useGlobalState(); @@ -302,6 +303,7 @@ export default function Router() { {/* Redirects */} } /> + } /> {/* } /> */} {/* } /> */} } /> diff --git a/src/pages/Login.tsx b/src/pages/Login.tsx new file mode 100644 index 0000000..661d1b9 --- /dev/null +++ b/src/pages/Login.tsx @@ -0,0 +1,51 @@ +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 => { + return new Promise(function(resolve) { + localStorage.setItem("routeBeforeLogin", prevPath ? prevPath : "/"); + return resolve("success"); + }); + }, [prevPath]); + + useEffect(() => { + const options: RedirectLoginOptions = { + authorizationParams: {} // Initialize here + }; + + if (location && location.search) { + let parsed = queryString.parse(location.search); + + 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 + } + + 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 ; + return ; +} diff --git a/src/providers/auth.tsx b/src/providers/auth.tsx index c5ad0f7..2c412f8 100644 --- a/src/providers/auth.tsx +++ b/src/providers/auth.tsx @@ -1,7 +1,6 @@ import { RedirectLoginOptions, useAuth0 } from "@auth0/auth0-react"; import queryString from "query-string"; -import { PropsWithChildren, useCallback, useEffect } from "react"; -import { useLocation } from "react-router-dom"; +import { PropsWithChildren, useEffect } from "react"; interface Props extends PropsWithChildren{ setToken: React.Dispatch> @@ -9,7 +8,7 @@ interface Props extends PropsWithChildren{ } export default function AuthWrapper(props: Props) { - const { children, setToken, prevPath } = props; + const { children, setToken } = props; const { isLoading, loginWithRedirect, isAuthenticated, getAccessTokenSilently } = useAuth0(); @@ -17,6 +16,7 @@ export default function AuthWrapper(props: Props) { const url = new URL(window.location.href); const isManualLoginPage = url.pathname === "/login"; + console.log(isManualLoginPage) if (isManualLoginPage) { const options: RedirectLoginOptions = { @@ -31,9 +31,9 @@ export default function AuthWrapper(props: Props) { if (parsed.email && parsed.email !== "") { options.authorizationParams!.login_hint = parsed.email.toString(); // prefill email } - + console.log(options) loginWithRedirect(options) - + } else if (!isAuthenticated && !isLoading) { loginWithRedirect(); } @@ -44,7 +44,6 @@ export default function AuthWrapper(props: Props) { if (t.length < 1) { loginWithRedirect() } - console.log("setting token :)") setToken(t) }).catch(() => { // No token, go back to login @@ -52,38 +51,5 @@ export default function AuthWrapper(props: Props) { }) }, [setToken, isAuthenticated]) - // const setRouteBeforeLogin = useCallback((): Promise => { - // 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 children; } \ No newline at end of file diff --git a/src/user/UserMenu.tsx b/src/user/UserMenu.tsx index bfd1baf..2b41a6f 100644 --- a/src/user/UserMenu.tsx +++ b/src/user/UserMenu.tsx @@ -1,11 +1,10 @@ -import { Avatar, Box, Button, Checkbox, Divider, IconButton, ListItemIcon, ListItemText, Menu, MenuItem, PaletteColor, Theme, Tooltip, useTheme } from "@mui/material"; +import { Avatar, Box, Button, Checkbox, Divider, ListItemIcon, ListItemText, Menu, MenuItem, PaletteColor, Theme, Tooltip, useTheme } from "@mui/material"; import { useGlobalState } from "../providers/StateContainer"; import { getSecondaryColour, getSignatureAccentColour } from "../services/whiteLabel"; import { makeStyles } from "@mui/styles"; import { LockOpen, Person, Lock, Settings, SupervisedUserCircle as TeamIcon, ExitToApp, PersonAdd } from "@mui/icons-material"; import { useState } from "react"; import UserTeamName from "./UserTeamName"; -import ThemeIcon from "../common/ThemeIcon"; import { useAuth0 } from "@auth0/auth0-react"; import UserSettings from "./UserSettings"; import UserAvatar from "./UserAvatar";