refactor: use shared live zoom helpers in camera view

This commit is contained in:
ibs0d 2026-03-08 23:31:00 +11:00
parent 24dd259fff
commit c9283f5990

View File

@ -122,6 +122,10 @@ import {
SnapshotResult, SnapshotResult,
} from "@/utils/snapshotUtil"; } from "@/utils/snapshotUtil";
import ActivityIndicator from "@/components/indicators/activity-indicator"; import ActivityIndicator from "@/components/indicators/activity-indicator";
import {
createLiveZoomWrapperProps,
getLiveZoomTransformStyles,
} from "@/views/live/liveZoom";
type LiveCameraViewProps = { type LiveCameraViewProps = {
config?: FrigateConfig; config?: FrigateConfig;
@ -437,11 +441,7 @@ export default function LiveCameraView({
); );
return ( return (
<TransformWrapper <TransformWrapper {...createLiveZoomWrapperProps(debug)}>
minScale={1.0}
wheel={{ smoothStep: 0.005 }}
disabled={debug}
>
<Toaster position="top-center" closeButton={true} /> <Toaster position="top-center" closeButton={true} />
<div <div
ref={mainRef} ref={mainRef}
@ -621,18 +621,7 @@ export default function LiveCameraView({
</div> </div>
{!debug ? ( {!debug ? (
<div id="player-container" className="size-full" ref={containerRef}> <div id="player-container" className="size-full" ref={containerRef}>
<TransformComponent <TransformComponent {...getLiveZoomTransformStyles("player")}>
wrapperStyle={{
width: "100%",
height: "100%",
}}
contentStyle={{
position: "relative",
width: "100%",
height: "100%",
padding: "8px",
}}
>
<div <div
className={`flex flex-col items-center justify-center ${growClassName}`} className={`flex flex-col items-center justify-center ${growClassName}`}
ref={clickOverlayRef} ref={clickOverlayRef}
@ -675,17 +664,7 @@ export default function LiveCameraView({
)} )}
</div> </div>
) : ( ) : (
<TransformComponent <TransformComponent {...getLiveZoomTransformStyles("debug")}>
wrapperStyle={{
width: "100%",
height: "100%",
}}
contentStyle={{
position: "relative",
width: "100%",
height: "100%",
}}
>
<ObjectSettingsView selectedCamera={camera.name} /> <ObjectSettingsView selectedCamera={camera.name} />
</TransformComponent> </TransformComponent>
)} )}