feat: add option to disable ui warnings

frontend/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "tinyauth-shadcn",
+  "name": "tinyauth",
   "private": true,
   "version": "0.0.0",
   "type": "module",

frontend/src/components/layout/layout.tsx

@@ -31,7 +31,7 @@ const BaseLayout = ({ children }: { children: React.ReactNode }) => {
 };
 
 export const Layout = () => {
-  const { appUrl } = useAppContext();
+  const { appUrl, disableUiWarnings } = useAppContext();
   const [ignoreDomainWarning, setIgnoreDomainWarning] = useState(() => {
     return window.sessionStorage.getItem("ignoreDomainWarning") === "true";
   });
@@ -42,7 +42,7 @@ export const Layout = () => {
     setIgnoreDomainWarning(true);
   }, [setIgnoreDomainWarning]);
 
-  if (!ignoreDomainWarning && appUrl !== currentUrl) {
+  if (!ignoreDomainWarning && !disableUiWarnings && appUrl !== currentUrl) {
     return (
       <BaseLayout>
         <DomainWarning

frontend/src/lib/hooks/use-is-mounted.ts

@@ -1,15 +0,0 @@
-import { useCallback, useEffect, useRef } from "react";
-
-export function useIsMounted(): () => boolean {
-  const isMounted = useRef(false);
-
-  useEffect(() => {
-    isMounted.current = true;
-
-    return () => {
-      isMounted.current = false;
-    };
-  }, []);
-
-  return useCallback(() => isMounted.current, []);
-}

frontend/src/pages/continue-page.tsx

@@ -14,7 +14,7 @@ import { Navigate, useLocation, useNavigate } from "react-router";
 import { useEffect, useState } from "react";
 
 export const ContinuePage = () => {
-  const { cookieDomain } = useAppContext();
+  const { cookieDomain, disableUiWarnings } = useAppContext();
   const { isLoggedIn } = useUserContext();
   const { search } = useLocation();
   const { t } = useTranslation();
@@ -53,12 +53,16 @@ export const ContinuePage = () => {
   };
 
   useEffect(() => {
+    if (!isLoggedIn) {
+      return;
+    }
+
     if (
-      !isLoggedIn ||
-      !isValidRedirectUri ||
-      !isTrustedRedirectUri ||
-      !isAllowedRedirectProto ||
-      isHttpsDowngrade
+      (!isValidRedirectUri ||
+        !isAllowedRedirectProto ||
+        !isTrustedRedirectUri ||
+        isHttpsDowngrade) &&
+      !disableUiWarnings
     ) {
       return;
     }
@@ -76,14 +80,7 @@ export const ContinuePage = () => {
       clearTimeout(auto);
       clearTimeout(reveal);
     };
-  }, [
-    handleRedirect,
-    isAllowedRedirectProto,
-    isHttpsDowngrade,
-    isLoggedIn,
-    isTrustedRedirectUri,
-    isValidRedirectUri,
-  ]);
+  }, []);
 
   if (!isLoggedIn) {
     return (
@@ -98,7 +95,7 @@ export const ContinuePage = () => {
     return <Navigate to="/logout" replace />;
   }
 
-  if (!isTrustedRedirectUri) {
+  if (!isTrustedRedirectUri && !disableUiWarnings) {
     return (
       <Card role="alert" aria-live="assertive" className="min-w-xs sm:min-w-sm">
         <CardHeader>
@@ -136,7 +133,7 @@ export const ContinuePage = () => {
     );
   }
 
-  if (isHttpsDowngrade) {
+  if (isHttpsDowngrade && !disableUiWarnings) {
     return (
       <Card role="alert" aria-live="assertive" className="min-w-xs sm:min-w-sm">
         <CardHeader>

frontend/src/pages/login-page.tsx

@@ -18,7 +18,6 @@ import { OAuthButton } from "@/components/ui/oauth-button";
 import { SeperatorWithChildren } from "@/components/ui/separator";
 import { useAppContext } from "@/context/app-context";
 import { useUserContext } from "@/context/user-context";
-import { useIsMounted } from "@/lib/hooks/use-is-mounted";
 import { LoginSchema } from "@/schemas/login-schema";
 import { useMutation } from "@tanstack/react-query";
 import axios, { AxiosError } from "axios";
@@ -40,7 +39,6 @@ export const LoginPage = () => {
   const { providers, title, oauthAutoRedirect } = useAppContext();
   const { search } = useLocation();
   const { t } = useTranslation();
-  const isMounted = useIsMounted();
   const [oauthAutoRedirectHandover, setOauthAutoRedirectHandover] =
     useState(false);
   const [showRedirectButton, setShowRedirectButton] = useState(false);
@@ -112,31 +110,20 @@ export const LoginPage = () => {
   });
 
   useEffect(() => {
-    if (isMounted()) {
-      if (
-        oauthProviders.length !== 0 &&
-        providers.find((provider) => provider.id === oauthAutoRedirect) &&
-        !isLoggedIn &&
-        redirectUri
-      ) {
-        // Not sure of a better way to do this
-        // eslint-disable-next-line react-hooks/set-state-in-effect
-        setOauthAutoRedirectHandover(true);
-        oauthMutation.mutate(oauthAutoRedirect);
-        redirectButtonTimer.current = window.setTimeout(() => {
-          setShowRedirectButton(true);
-        }, 5000);
-      }
+    if (
+      providers.find((provider) => provider.id === oauthAutoRedirect) &&
+      !isLoggedIn &&
+      redirectUri
+    ) {
+      // Not sure of a better way to do this
+      // eslint-disable-next-line react-hooks/set-state-in-effect
+      setOauthAutoRedirectHandover(true);
+      oauthMutation.mutate(oauthAutoRedirect);
+      redirectButtonTimer.current = window.setTimeout(() => {
+        setShowRedirectButton(true);
+      }, 5000);
     }
-  }, [
-    isMounted,
-    oauthProviders.length,
-    providers,
-    isLoggedIn,
-    redirectUri,
-    oauthAutoRedirect,
-    oauthMutation,
-  ]);
+  }, []);
 
   useEffect(
     () => () => {

frontend/src/schemas/app-context-schema.ts

@@ -14,6 +14,7 @@ export const appContextSchema = z.object({
   forgotPasswordMessage: z.string(),
   backgroundImage: z.string(),
   oauthAutoRedirect: z.string(),
+  disableUiWarnings: z.boolean(),
 });
 
 export type AppContextSchema = z.infer<typeof appContextSchema>;