From e3c922d03266995ec05f803a7ba85918da03b43a Mon Sep 17 00:00:00 2001 From: Prayas Lashkari Date: Sat, 14 Mar 2026 15:25:51 -0400 Subject: [PATCH 1/3] feat: add crop functionality with snapshot handling in SettingsPanel --- src/components/video-editor/SettingsPanel.tsx | 21 ++++++++++++++++--- 1 file changed, 18 insertions(+), 3 deletions(-) diff --git a/src/components/video-editor/SettingsPanel.tsx b/src/components/video-editor/SettingsPanel.tsx index 15be76e..e445ac0 100644 --- a/src/components/video-editor/SettingsPanel.tsx +++ b/src/components/video-editor/SettingsPanel.tsx @@ -233,6 +233,7 @@ export function SettingsPanel({ const [selectedColor, setSelectedColor] = useState("#ADADAD"); const [gradient, setGradient] = useState(GRADIENTS[0]); const [showCropDropdown, setShowCropDropdown] = useState(false); + const cropSnapshotRef = useRef(null); const zoomEnabled = Boolean(selectedZoomDepth); const trimEnabled = Boolean(selectedTrimId); @@ -296,6 +297,20 @@ export function SettingsPanel({ } }; + const handleCropToggle = () => { + if (!showCropDropdown && cropRegion) { + cropSnapshotRef.current = { ...cropRegion }; + } + setShowCropDropdown(!showCropDropdown); + }; + + const handleCropCancel = () => { + if (cropSnapshotRef.current && onCropChange) { + onCropChange(cropSnapshotRef.current); + } + setShowCropDropdown(false); + }; + // Find selected annotation const selectedAnnotation = selectedAnnotationId ? annotationRegions.find((a) => a.id === selectedAnnotationId) @@ -527,7 +542,7 @@ export function SettingsPanel({