Fix context menu link to debug

web/src/components/menu/LiveContextMenu.tsx

@@ -355,9 +355,7 @@ export default function LiveContextMenu({
             <div
               className="flex w-full cursor-pointer items-center justify-start gap-2"
               onClick={
-                isEnabled
-                  ? () => navigate(`/settings?page=debug&camera=${camera}`)
-                  : undefined
+                isEnabled ? () => navigate(`?debug=true#${camera}`) : undefined
               }
             >
               <div className="text-primary">

web/src/hooks/use-overlay-state.tsx

@@ -112,7 +112,8 @@ export function useSearchEffect(
   callback: (value: string) => boolean,
 ) {
   const location = useLocation();
-  const [searchParams, setSearchParams] = useSearchParams();
+  const navigate = useNavigate();
+  const [searchParams] = useSearchParams();
 
   const param = useMemo(() => {
     const param = searchParams.get(key);
@@ -132,7 +133,17 @@ export function useSearchEffect(
     const remove = callback(param[1]);
 
     if (remove) {
-      setSearchParams(undefined, { state: location.state, replace: true });
+      navigate(location.pathname + location.hash, {
+        state: location.state,
+        replace: true,
+      });
     }
-  }, [param, location.state, callback, setSearchParams]);
+  }, [
+    param,
+    location.state,
+    location.pathname,
+    location.hash,
+    callback,
+    navigate,
+  ]);
 }

web/src/views/live/LiveCameraView.tsx

@@ -111,6 +111,7 @@ import { Trans, useTranslation } from "react-i18next";
 import { useDocDomain } from "@/hooks/use-doc-domain";
 import PtzControlPanel from "@/components/overlay/PtzControlPanel";
 import ObjectSettingsView from "../settings/ObjectSettingsView";
+import { useSearchEffect } from "@/hooks/use-overlay-state";
 
 type LiveCameraViewProps = {
   config?: FrigateConfig;
@@ -274,6 +275,14 @@ export default function LiveCameraView({
   const [showStats, setShowStats] = useState(false);
   const [debug, setDebug] = useState(false);
 
+  useSearchEffect("debug", (value: string) => {
+    if (value === "true") {
+      setDebug(true);
+    }
+
+    return true;
+  });
+
   const [fullResolution, setFullResolution] = useState<VideoResolutionType>({
     width: 0,
     height: 0,