refactor: bot suggestions

frontend/src/components/layout/layout.tsx

@@ -6,9 +6,13 @@ export const Layout = ({ children }: { children: React.ReactNode }) => {
 
   return (
     <div
-      className={`flex flex-col justify-center items-center min-h-svh bg-[url(${backgroundImage})] bg-cover`}
+      className="relative flex flex-col justify-center items-center min-h-svh"
+      style={{
+        backgroundImage: `url(${backgroundImage})`,
+        backgroundSize: "cover",
+        backgroundPosition: "center",
+      }}
     >
-      <img></img>
       <LanguageSelector />
       {children}
     </div>

frontend/src/lib/i18n/locales/en-US.json

@@ -40,7 +40,7 @@
     "totpSubtitle": "Please enter the code from your authenticator app.",
     "unauthorizedTitle": "Unauthorized",
     "unauthorizedResourceSubtitle": "The user with username <code>{{username}}</code> is not authorized to access the resource <code>{{resource}}</code>.",
-    "unaothorizedLoginSubtitle": "The user with username <code>{{username}}</code> is not authorized to login.",
+    "unauthorizedLoginSubtitle": "The user with username <code>{{username}}</code> is not authorized to login.",
     "unauthorizedGroupsSubtitle": "The user with username <code>{{username}}</code> is not in the groups required by the resource <code>{{resource}}</code>.",
     "unauthorizedButton": "Try again",
     "untrustedRedirectTitle": "Untrusted redirect",

frontend/src/lib/i18n/locales/en.json

@@ -40,7 +40,7 @@
     "totpSubtitle": "Please enter the code from your authenticator app.",
     "unauthorizedTitle": "Unauthorized",
     "unauthorizedResourceSubtitle": "The user with username <code>{{username}}</code> is not authorized to access the resource <code>{{resource}}</code>.",
-    "unaothorizedLoginSubtitle": "The user with username <code>{{username}}</code> is not authorized to login.",
+    "unauthorizedLoginSubtitle": "The user with username <code>{{username}}</code> is not authorized to login.",
     "unauthorizedGroupsSubtitle": "The user with username <code>{{username}}</code> is not in the groups required by the resource <code>{{resource}}</code>.",
     "unauthorizedButton": "Try again",
     "untrustedRedirectTitle": "Untrusted redirect",

frontend/src/pages/continue-page.tsx

@@ -10,12 +10,13 @@ import { useAppContext } from "@/context/app-context";
 import { useUserContext } from "@/context/user-context";
 import { isValidUrl } from "@/lib/utils";
 import { Trans, useTranslation } from "react-i18next";
-import { Navigate, useNavigate } from "react-router";
+import { Navigate, useLocation, useNavigate } from "react-router";
 import DOMPurify from "dompurify";
 
 export const ContinuePage = () => {
-  const params = new URLSearchParams(window.location.search);
-  const redirectURI = params.get("redirect_uri");
+  const { search } = useLocation();
+  const searchParams = new URLSearchParams(search);
+  const redirectURI = searchParams.get("redirect_uri");
 
   const { isLoggedIn } = useUserContext();
   const { domain, disableContinue } = useAppContext();
@@ -41,7 +42,7 @@ export const ContinuePage = () => {
 
   const url = new URL(redirectURI);
 
-  if (!url.hostname.includes(domain)) {
+  if (!(url.hostname == domain) || !url.hostname.endsWith(`.${domain}`)) {
     return (
       <Card className="min-w-xs sm:min-w-sm">
         <CardHeader>

frontend/src/pages/login-page.tsx

@@ -19,11 +19,12 @@ import { useMutation } from "@tanstack/react-query";
 import axios from "axios";
 import { useEffect } from "react";
 import { useTranslation } from "react-i18next";
-import { Navigate } from "react-router";
+import { Navigate, useLocation } from "react-router";
 import { toast } from "sonner";
 
 export const LoginPage = () => {
-  const searchParams = new URLSearchParams(window.location.search);
+  const { search } = useLocation();
+  const searchParams = new URLSearchParams(search);
   const redirectUri = searchParams.get("redirect_uri");
 
   const { isLoggedIn } = useUserContext();
@@ -65,7 +66,9 @@ export const LoginPage = () => {
     mutationKey: ["login"],
     onSuccess: (data) => {
       if (data.data.totpPending) {
-        window.location.replace(`/totp?redirect_uri=${redirectUri}`);
+        window.location.replace(
+          `/totp?redirect_uri=${encodeURIComponent(redirectUri ?? "")}`,
+        );
         return;
       }
 
@@ -74,7 +77,9 @@ export const LoginPage = () => {
       });
 
       setTimeout(() => {
-        window.location.replace(`/continue?redirect_uri=${redirectUri}`);
+        window.location.replace(
+          `/continue?redirect_uri=${encodeURIComponent(redirectUri ?? "")}`,
+        );
       }, 500);
     },
     onError: (error: Error) => {
@@ -94,14 +99,6 @@ export const LoginPage = () => {
     }
   });
 
-  useEffect(() => {
-    if (isMounted()) {
-      if (oauthConfigured && configuredProviders.includes(oauthAutoRedirect)) {
-        oauthMutation.mutate(oauthAutoRedirect);
-      }
-    }
-  }, []);
-
   return (
     <Card className="min-w-xs sm:min-w-sm">
       <CardHeader>

frontend/src/pages/totp-page.tsx

@@ -13,11 +13,12 @@ import { useMutation } from "@tanstack/react-query";
 import axios from "axios";
 import { useId } from "react";
 import { useTranslation } from "react-i18next";
-import { useNavigate } from "react-router";
+import { useLocation, useNavigate } from "react-router";
 import { toast } from "sonner";
 
 export const TotpPage = () => {
-  const searchParams = new URLSearchParams(window.location.search);
+  const { search } = useLocation();
+  const searchParams = new URLSearchParams(search);
   const redirectUri = searchParams.get("redirect_uri");
 
   const { t } = useTranslation();
@@ -33,7 +34,9 @@ export const TotpPage = () => {
       });
 
       setTimeout(() => {
-        navigate(`/continue?redirect_uri=${redirectUri}`);
+        navigate(
+          `/continue?redirect_uri=${encodeURIComponent(redirectUri ?? "")}`,
+        );
       }, 500);
     },
     onError: () => {

frontend/src/pages/unauthorized-page.tsx

@@ -7,10 +7,11 @@ import {
   CardTitle,
 } from "@/components/ui/card";
 import { Trans, useTranslation } from "react-i18next";
-import { Navigate, useNavigate } from "react-router";
+import { Navigate, useLocation, useNavigate } from "react-router";
 
 export const UnauthorizedPage = () => {
-  const searchParams = new URLSearchParams(window.location.search);
+  const { search } = useLocation();
+  const searchParams = new URLSearchParams(search);
   const username = searchParams.get("username");
   const resource = searchParams.get("resource");
   const groupErr = searchParams.get("groupErr");
@@ -23,7 +24,7 @@ export const UnauthorizedPage = () => {
 
   const navigate = useNavigate();
 
-  let i18nKey = "unaothorizedLoginSubtitle";
+  let i18nKey = "unauthorizedLoginSubtitle";
 
   if (resource) {
     i18nKey = "unauthorizedResourceSubtitle";