From 2bb5a41415950ed30e64b6051825dbeed89e221e Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Wed, 4 Mar 2026 08:40:39 -0600
Subject: [PATCH] Add fullscreen controls to tracking details videos

---
 web/src/components/overlay/detail/TrackingDetails.tsx | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/web/src/components/overlay/detail/TrackingDetails.tsx b/web/src/components/overlay/detail/TrackingDetails.tsx
index 03b6dd6c4..3dad95621 100644
--- a/web/src/components/overlay/detail/TrackingDetails.tsx
+++ b/web/src/components/overlay/detail/TrackingDetails.tsx
@@ -1,6 +1,7 @@
 import useSWR from "swr";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { useResizeObserver } from "@/hooks/resize-observer";
+import { useFullscreen } from "@/hooks/use-fullscreen";
 import { Event } from "@/types/event";
 import ActivityIndicator from "@/components/indicators/activity-indicator";
 import { TrackingDetailsSequence } from "@/types/timeline";
@@ -243,6 +244,8 @@ export function TrackingDetails({
   }, [manualOverride, currentTime, annotationOffset]);
 
   const containerRef = useRef<HTMLDivElement | null>(null);
+  const { fullscreen, toggleFullscreen, supportsFullScreen } =
+    useFullscreen(containerRef);
   const timelineContainerRef = useRef<HTMLDivElement | null>(null);
   const rowRefs = useRef<(HTMLDivElement | null)[]>([]);
   const [_selectedZone, setSelectedZone] = useState("");
@@ -559,14 +562,15 @@ export function TrackingDetails({
                 visible={true}
                 currentSource={videoSource}
                 hotKeys={false}
-                supportsFullscreen={false}
-                fullscreen={false}
+                supportsFullscreen={supportsFullScreen}
+                fullscreen={fullscreen}
                 frigateControls={true}
                 onTimeUpdate={handleTimeUpdate}
                 onSeekToTime={handleSeekToTime}
                 onUploadFrame={onUploadFrameToPlus}
                 onPlaying={() => setIsVideoLoading(false)}
                 setFullResolution={setFullResolution}
+                toggleFullscreen={toggleFullscreen}
                 isDetailMode={true}
                 camera={event.camera}
                 currentTimeOverride={currentTime}