fix console errors with tooltips and dropdown in single camera live view

This commit is contained in:
Josh Hawkins 2025-09-22 19:37:39 -05:00
parent a525dd0ff7
commit 303471242f

View File

@ -28,7 +28,6 @@ import {
import {
Tooltip,
TooltipContent,
TooltipProvider,
TooltipTrigger,
} from "@/components/ui/tooltip";
import { useResizeObserver } from "@/hooks/resize-observer";
@ -116,6 +115,7 @@ import {
SelectGroup,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { usePersistence } from "@/hooks/use-persistence";
import { Label } from "@/components/ui/label";
@ -499,7 +499,6 @@ export default function LiveCameraView({
) : (
<div />
)}
<TooltipProvider>
<div
className={`flex flex-row items-center gap-2 *:rounded-lg ${isMobile ? "landscape:flex-col" : ""}`}
>
@ -593,9 +592,7 @@ export default function LiveCameraView({
camera={camera}
recordingEnabled={camera.record.enabled_in_config}
audioDetectEnabled={camera.audio.enabled_in_config}
autotrackingEnabled={
camera.onvif.autotracking.enabled_in_config
}
autotrackingEnabled={camera.onvif.autotracking.enabled_in_config}
transcriptionEnabled={
camera.audio_transcription.enabled_in_config
}
@ -614,7 +611,6 @@ export default function LiveCameraView({
cameraEnabled={cameraEnabled}
/>
</div>
</TooltipProvider>
</div>
<div id="player-container" className="size-full" ref={containerRef}>
<TransformComponent
@ -707,7 +703,6 @@ function TooltipButton({
...props
}: TooltipButtonProps) {
return (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
@ -727,7 +722,6 @@ function TooltipButton({
<p>{label}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
);
}
@ -961,7 +955,6 @@ function PtzControlPanel({
)}
{ptz?.features?.includes("pt-r-fov") && (
<TooltipProvider>
<Tooltip>
<TooltipTrigger asChild>
<Button
@ -980,18 +973,22 @@ function PtzControlPanel({
</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)}
{(ptz?.presets?.length ?? 0) > 0 && (
<TooltipProvider>
<DropdownMenu modal={!isDesktop}>
<Tooltip>
<TooltipTrigger asChild>
<DropdownMenu modal={!isDesktop}>
<DropdownMenuTrigger asChild>
<Button aria-label={t("ptz.presets")}>
<BsThreeDotsVertical />
</Button>
</DropdownMenuTrigger>
</TooltipTrigger>
<TooltipContent>
<p>{t("ptz.presets")}</p>
</TooltipContent>
</Tooltip>
<DropdownMenuContent
className="scrollbar-container max-h-[40dvh] overflow-y-auto"
onCloseAutoFocus={(e) => e.preventDefault()}
@ -1008,12 +1005,6 @@ function PtzControlPanel({
))}
</DropdownMenuContent>
</DropdownMenu>
</TooltipTrigger>
<TooltipContent>
<p>{t("ptz.presets")}</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>
)}
</div>
);
@ -1401,9 +1392,11 @@ function FrigateCameraFeatures({
}}
>
<SelectTrigger className="w-full">
<SelectValue>
{Object.keys(camera.live.streams).find(
(key) => camera.live.streams[key] === streamName,
)}
</SelectValue>
</SelectTrigger>
<SelectContent>
@ -1733,9 +1726,11 @@ function FrigateCameraFeatures({
}}
>
<SelectTrigger className="w-full">
<SelectValue>
{Object.keys(camera.live.streams).find(
(key) => camera.live.streams[key] === streamName,
)}
</SelectValue>
</SelectTrigger>
<SelectContent>