From 3348af1e6d28299f1f29740627389395c91df28e Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Sat, 27 Apr 2024 12:02:01 -0500
Subject: [PATCH] add page titles for settings views (#11132)

---
 web/src/components/settings/General.tsx            | 5 +++++
 web/src/components/settings/MasksAndZones.tsx      | 5 +++++
 web/src/components/settings/MotionMaskEditPane.tsx | 6 +++++-
 web/src/components/settings/MotionTuner.tsx        | 4 ++++
 web/src/components/settings/ObjectMaskEditPane.tsx | 6 +++++-
 web/src/components/settings/ObjectSettings.tsx     | 6 +++++-
 web/src/components/settings/ZoneEditPane.tsx       | 4 ++++
 web/src/pages/Settings.tsx                         | 4 ++++
 8 files changed, 37 insertions(+), 3 deletions(-)

diff --git a/web/src/components/settings/General.tsx b/web/src/components/settings/General.tsx
index 4d8465299..d82731300 100644
--- a/web/src/components/settings/General.tsx
+++ b/web/src/components/settings/General.tsx
@@ -10,8 +10,13 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { Switch } from "@/components/ui/switch";
+import { useEffect } from "react";
 
 export default function General() {
+  useEffect(() => {
+    document.title = "General Settings - Frigate";
+  }, []);
+
   return (
     <>
       <Heading as="h2">Settings</Heading>
diff --git a/web/src/components/settings/MasksAndZones.tsx b/web/src/components/settings/MasksAndZones.tsx
index 84999da8f..5e17a534f 100644
--- a/web/src/components/settings/MasksAndZones.tsx
+++ b/web/src/components/settings/MasksAndZones.tsx
@@ -171,6 +171,7 @@ export default function MasksAndZones({
     setActivePolygonIndex(undefined);
     setHoveredPolygonIndex(null);
     setUnsavedChanges(false);
+    document.title = "Mask and Zone Editor - Frigate";
   }, [allPolygons, setUnsavedChanges]);
 
   const handleSave = useCallback(() => {
@@ -353,6 +354,10 @@ export default function MasksAndZones({
     }
   }, [selectedCamera]);
 
+  useEffect(() => {
+    document.title = "Mask and Zone Editor - Frigate";
+  }, []);
+
   if (!cameraConfig && !selectedCamera) {
     return <ActivityIndicator />;
   }
diff --git a/web/src/components/settings/MotionMaskEditPane.tsx b/web/src/components/settings/MotionMaskEditPane.tsx
index 5b54a1122..1797c2d99 100644
--- a/web/src/components/settings/MotionMaskEditPane.tsx
+++ b/web/src/components/settings/MotionMaskEditPane.tsx
@@ -2,7 +2,7 @@ import Heading from "../ui/heading";
 import { Separator } from "../ui/separator";
 import { Button } from "@/components/ui/button";
 import { Form, FormField, FormItem, FormMessage } from "@/components/ui/form";
-import { useCallback, useMemo } from "react";
+import { useCallback, useEffect, useMemo } from "react";
 import { zodResolver } from "@hookform/resolvers/zod";
 import { useForm } from "react-hook-form";
 import { z } from "zod";
@@ -173,6 +173,10 @@ export default function MotionMaskEditPane({
     }
   }
 
+  useEffect(() => {
+    document.title = "Edit Motion Mask - Frigate";
+  }, []);
+
   if (!polygon) {
     return;
   }
diff --git a/web/src/components/settings/MotionTuner.tsx b/web/src/components/settings/MotionTuner.tsx
index 02350b070..badaa75a4 100644
--- a/web/src/components/settings/MotionTuner.tsx
+++ b/web/src/components/settings/MotionTuner.tsx
@@ -159,6 +159,10 @@ export default function MotionTuner({
     }
   }, [changedValue, addMessage, clearMessages]);
 
+  useEffect(() => {
+    document.title = "Motion Tuner - Frigate";
+  }, []);
+
   if (!cameraConfig && !selectedCamera) {
     return <ActivityIndicator />;
   }
diff --git a/web/src/components/settings/ObjectMaskEditPane.tsx b/web/src/components/settings/ObjectMaskEditPane.tsx
index ae755c48f..c95b17bae 100644
--- a/web/src/components/settings/ObjectMaskEditPane.tsx
+++ b/web/src/components/settings/ObjectMaskEditPane.tsx
@@ -19,7 +19,7 @@ import {
   FormLabel,
   FormMessage,
 } from "@/components/ui/form";
-import { useCallback, useMemo } from "react";
+import { useCallback, useEffect, useMemo } from "react";
 import { ATTRIBUTE_LABELS, FrigateConfig } from "@/types/frigateConfig";
 import useSWR from "swr";
 import { zodResolver } from "@hookform/resolvers/zod";
@@ -235,6 +235,10 @@ export default function ObjectMaskEditPane({
     }
   }
 
+  useEffect(() => {
+    document.title = "Edit Object Mask - Frigate";
+  }, []);
+
   if (!polygon) {
     return;
   }
diff --git a/web/src/components/settings/ObjectSettings.tsx b/web/src/components/settings/ObjectSettings.tsx
index 4b45c1fa4..92dac2d7d 100644
--- a/web/src/components/settings/ObjectSettings.tsx
+++ b/web/src/components/settings/ObjectSettings.tsx
@@ -1,4 +1,4 @@
-import { useMemo } from "react";
+import { useEffect, useMemo } from "react";
 import DebugCameraImage from "../camera/DebugCameraImage";
 import { FrigateConfig } from "@/types/frigateConfig";
 import useSWR from "swr";
@@ -19,6 +19,10 @@ export default function ObjectSettings({
     }
   }, [config, selectedCamera]);
 
+  useEffect(() => {
+    document.title = "Object Settings - Frigate";
+  }, []);
+
   if (!cameraConfig) {
     return <ActivityIndicator />;
   }
diff --git a/web/src/components/settings/ZoneEditPane.tsx b/web/src/components/settings/ZoneEditPane.tsx
index f72cc3907..dd213b6cc 100644
--- a/web/src/components/settings/ZoneEditPane.tsx
+++ b/web/src/components/settings/ZoneEditPane.tsx
@@ -308,6 +308,10 @@ export default function ZoneEditPane({
     }
   }
 
+  useEffect(() => {
+    document.title = "Edit Zone - Frigate";
+  }, []);
+
   if (!polygon) {
     return;
   }
diff --git a/web/src/pages/Settings.tsx b/web/src/pages/Settings.tsx
index 9d22e534d..d0bd80102 100644
--- a/web/src/pages/Settings.tsx
+++ b/web/src/pages/Settings.tsx
@@ -100,6 +100,10 @@ export default function Settings() {
     }
   }, [tabsRef, pageToggle]);
 
+  useEffect(() => {
+    document.title = "Settings - Frigate";
+  }, []);
+
   return (
     <div className="size-full p-2 flex flex-col">
       <div className="w-full h-11 relative flex justify-between items-center">