From a996faabe10ade4d5161667c0bd8aa0e1344280e Mon Sep 17 00:00:00 2001
From: "Soren L. Hansen" <sorenisanerd@gmail.com>
Date: Wed, 7 Aug 2024 11:45:22 -0700
Subject: [PATCH] Fix auth when serving Frigate at a subpath

Ensure axios.defaults.baseURL is set when accessing login form.

Drop `/api` prefix in login form's `axios.post` call, since `/api` is
part of the baseURL.

Redirect to subpath on succesful authentication.

Prepend subpath to default logout url.

Fixes #12814
---
 web/src/components/auth/AuthForm.tsx        | 5 +++--
 web/src/components/menu/AccountSettings.tsx | 3 ++-
 web/src/login.tsx                           | 1 +
 3 files changed, 6 insertions(+), 3 deletions(-)

diff --git a/web/src/components/auth/AuthForm.tsx b/web/src/components/auth/AuthForm.tsx
index 8050857748..f3a4358282 100644
--- a/web/src/components/auth/AuthForm.tsx
+++ b/web/src/components/auth/AuthForm.tsx
@@ -2,6 +2,7 @@
 
 import * as React from "react";
 
+import { baseUrl } from "../../api/baseUrl";
 import { cn } from "@/lib/utils";
 import { Input } from "@/components/ui/input";
 import { Button } from "@/components/ui/button";
@@ -43,7 +44,7 @@ export function UserAuthForm({ className, ...props }: UserAuthFormProps) {
     setIsLoading(true);
     try {
       await axios.post(
-        "/api/login",
+        "/login",
         {
           user: values.user,
           password: values.password,
@@ -54,7 +55,7 @@ export function UserAuthForm({ className, ...props }: UserAuthFormProps) {
           },
         },
       );
-      window.location.href = "/";
+      window.location.href = baseUrl;
     } catch (error) {
       if (axios.isAxiosError(error)) {
         const err = error as AxiosError;
diff --git a/web/src/components/menu/AccountSettings.tsx b/web/src/components/menu/AccountSettings.tsx
index 20c852e65a..1b7470b9b5 100644
--- a/web/src/components/menu/AccountSettings.tsx
+++ b/web/src/components/menu/AccountSettings.tsx
@@ -3,6 +3,7 @@ import {
   TooltipContent,
   TooltipTrigger,
 } from "@/components/ui/tooltip";
+import { baseUrl } from "../../api/baseUrl";
 import { cn } from "@/lib/utils";
 import { TooltipPortal } from "@radix-ui/react-tooltip";
 import { isDesktop } from "react-device-detect";
@@ -26,7 +27,7 @@ type AccountSettingsProps = {
 export default function AccountSettings({ className }: AccountSettingsProps) {
   const { data: profile } = useSWR("profile");
   const { data: config } = useSWR("config");
-  const logoutUrl = config?.proxy?.logout_url || "/api/logout";
+  const logoutUrl = config?.proxy?.logout_url || `${baseUrl}api/logout`;
 
   const Container = isDesktop ? DropdownMenu : Drawer;
   const Trigger = isDesktop ? DropdownMenuTrigger : DrawerTrigger;
diff --git a/web/src/login.tsx b/web/src/login.tsx
index cea5e3e423..4906b58c68 100644
--- a/web/src/login.tsx
+++ b/web/src/login.tsx
@@ -1,6 +1,7 @@
 import React from "react";
 import ReactDOM from "react-dom/client";
 import LoginPage from "@/pages/LoginPage.tsx";
+import "@/api";
 import "./index.css";
 
 ReactDOM.createRoot(document.getElementById("root")!).render(