Merge pull request #645 from auberginewly/fix/export-panel-hidden-after-zoom-select

fix(export): clear timeline selection when opening export panel

Author: siddharthvaddem

src/components/video-editor/SettingsPanel.tsx

@@ -284,6 +284,7 @@ interface SettingsPanelProps {
 	onGifSizePresetChange?: (preset: GifSizePreset) => void;
 	gifOutputDimensions?: { width: number; height: number };
 	onExport?: () => void;
+	onExportPanelOpen?: () => void;
 	unsavedExport?: {
 		arrayBuffer: ArrayBuffer;
 		fileName: string;
@@ -414,6 +415,7 @@ export function SettingsPanel({
 	onGifSizePresetChange,
 	gifOutputDimensions = DEFAULT_GIF_SETTINGS.outputDimensions,
 	onExport,
+	onExportPanelOpen,
 	unsavedExport,
 	onSaveUnsavedExport,
 	selectedAnnotationId,
@@ -822,7 +824,10 @@ export function SettingsPanel({
 						data-testid={getTestId("export-panel-button")}
 						type="button"
 						title={exportPanelMode.label}
-						onClick={() => setActivePanelMode(exportPanelMode.id)}
+						onClick={() => {
+							setActivePanelMode(exportPanelMode.id);
+							onExportPanelOpen?.();
+						}}
 						className={cn(
 							"mt-auto flex h-8 w-8 items-center justify-center rounded-lg border transition-all",
 							activePanelMode === "export" && !hasTimelineSelection

src/components/video-editor/VideoEditor.tsx

@@ -2264,6 +2264,11 @@ export default function VideoEditor() {
 											: getAspectRatioValue(aspectRatio),
 									)}
 									onExport={handleOpenExportDialog}
+									onExportPanelOpen={() => {
+										setSelectedZoomId(null);
+										setSelectedTrimId(null);
+										setSelectedSpeedId(null);
+									}}
 									selectedAnnotationId={selectedAnnotationId}
 									annotationRegions={annotationOnlyRegions}
 									onAnnotationContentChange={handleAnnotationContentChange}