Function ClipsSidebarInner

apps/desktop/src/routes/editor/ClipsSidebar.tsx:258–1196

(props: { open: boolean; class?: string })

}

function ClipsSidebarInner(props: { open: boolean; class?: string }) {
	const {
		project,
		setProject,
		editorInstance,
		editorState,
		setEditorState,
		setDialog,
	} = useEditorContext();
	const { rawOptions, setOptions } = useRecordingOptions();

	const backToEditor = () => setDialog((d) => ({ ...d, open: false }));

	let previousMode: RecordingMode | null = null;
	const [importing, setImporting] = createSignal(false);
	const [recordOpen, setRecordOpen] = createSignal(false);

	const restoreMode = () => {
		if (previousMode !== null && rawOptions.mode !== previousMode) {
			setOptions("mode", previousMode);
			void commands.setRecordingMode(previousMode);
		}
		previousMode = null;
	};

	const [displayMenuOpen, setDisplayMenuOpen] = createSignal(false);
	const [windowMenuOpen, setWindowMenuOpen] = createSignal(false);
	const activeTargetMenu = createMemo<"display" | "window" | null>(() =>
		displayMenuOpen() ? "display" : windowMenuOpen() ? "window" : null,
	);
	const [targetSearch, setTargetSearch] = createSignal("");
	let displayTriggerRef: HTMLButtonElement | undefined;
	let windowTriggerRef: HTMLButtonElement | undefined;

	createEffect(() => {
		if (!activeTargetMenu()) setTargetSearch("");
	});

	const closeRecord = () => {
		setRecordOpen(false);
		setDisplayMenuOpen(false);
		setWindowMenuOpen(false);
	};

	let hiddenForPicker = false;

	const resetRecordingTarget = () => {
		const targetMode = untrack(() => rawOptions.targetMode);
		if (targetMode != null) {
			setOptions("targetMode", null);
			void commands.closeTargetSelectOverlays().catch(() => {});
		}
		void commands.setEditorRecordingTarget(null).catch(() => {});
	};

	const showEditorWindow = async (focus: boolean) => {
		const window = getCurrentWindow();
		await window.show();