Add camera name tooltip to previews in recording view

This commit is contained in:
Josh Hawkins 2025-05-12 07:28:42 -05:00
parent f39ddbc00d
commit 1d77ddab88

View File

@ -50,6 +50,11 @@ import { useFullscreen } from "@/hooks/use-fullscreen";
import { useTimezone } from "@/hooks/use-date-utils"; import { useTimezone } from "@/hooks/use-date-utils";
import { useTimelineZoom } from "@/hooks/use-timeline-zoom"; import { useTimelineZoom } from "@/hooks/use-timeline-zoom";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import {
Tooltip,
TooltipContent,
TooltipTrigger,
} from "@/components/ui/tooltip";
type RecordingViewProps = { type RecordingViewProps = {
startCamera: string; startCamera: string;
@ -670,31 +675,38 @@ export function RecordingView({
} }
return ( return (
<div <Tooltip>
key={cam} <TooltipTrigger asChild>
className={ <div
mainCameraAspect == "tall" ? "w-full" : "h-full" key={cam}
} className={
style={{ mainCameraAspect == "tall" ? "w-full" : "h-full"
aspectRatio: getCameraAspect(cam), }
}} style={{
> aspectRatio: getCameraAspect(cam),
<PreviewPlayer }}
previewRef={previewRef} >
className="size-full" <PreviewPlayer
camera={cam} previewRef={previewRef}
timeRange={currentTimeRange} className="size-full"
cameraPreviews={allPreviews ?? []} camera={cam}
startTime={startTime} timeRange={currentTimeRange}
isScrubbing={scrubbing} cameraPreviews={allPreviews ?? []}
isVisible={visiblePreviews.includes(cam)} startTime={startTime}
onControllerReady={(controller) => { isScrubbing={scrubbing}
previewRefs.current[cam] = controller; isVisible={visiblePreviews.includes(cam)}
controller.scrubToTimestamp(startTime); onControllerReady={(controller) => {
}} previewRefs.current[cam] = controller;
onClick={() => onSelectCamera(cam)} controller.scrubToTimestamp(startTime);
/> }}
</div> onClick={() => onSelectCamera(cam)}
/>
</div>
</TooltipTrigger>
<TooltipContent className="smart-capitalize">
{cam}
</TooltipContent>
</Tooltip>
); );
})} })}
<div className="w-2" /> <div className="w-2" />