From 3e89d2998588f8e35c524e523ba2ee853f0f6475 Mon Sep 17 00:00:00 2001
From: Maze Winther <mazewinther@gmail.com>
Date: Mon, 20 Apr 2026 11:31:17 +0200
Subject: refactor: restructure files to their domains,  new preview overlay
 system, and dep graph

---
 .../components/editor/dialogs/shortcuts-dialog.tsx | 229 ---------------------
 1 file changed, 229 deletions(-)
 delete mode 100644 apps/web/src/components/editor/dialogs/shortcuts-dialog.tsx

(limited to 'apps/web/src/components/editor/dialogs/shortcuts-dialog.tsx')

diff --git a/apps/web/src/components/editor/dialogs/shortcuts-dialog.tsx b/apps/web/src/components/editor/dialogs/shortcuts-dialog.tsx
deleted file mode 100644
index 70802b5b..00000000
--- a/apps/web/src/components/editor/dialogs/shortcuts-dialog.tsx
+++ /dev/null
@@ -1,229 +0,0 @@
-"use client";
-
-import { useEffect, useState } from "react";
-import { toast } from "sonner";
-import {
-	type KeyboardShortcut,
-	useKeyboardShortcutsHelp,
-} from "@/hooks/use-keyboard-shortcuts-help";
-import { useKeybindingsStore } from "@/stores/keybindings-store";
-import { Button } from "@/components/ui/button";
-import {
-	Dialog,
-	DialogBody,
-	DialogContent,
-	DialogFooter,
-	DialogHeader,
-	DialogTitle,
-} from "@/components/ui/dialog";
-
-export function ShortcutsDialog({
-	isOpen,
-	onOpenChange,
-}: {
-	isOpen: boolean;
-	onOpenChange: (open: boolean) => void;
-}) {
-	const [recordingShortcut, setRecordingShortcut] =
-		useState<KeyboardShortcut | null>(null);
-
-	const {
-		updateKeybinding,
-		removeKeybinding,
-		getKeybindingString,
-		validateKeybinding,
-		getKeybindingsForAction,
-		setIsRecording,
-		resetToDefaults,
-		isRecording,
-	} = useKeybindingsStore();
-
-	const { shortcuts } = useKeyboardShortcutsHelp();
-
-	const categories = Array.from(new Set(shortcuts.map((s) => s.category)));
-
-	useEffect(() => {
-		if (!isRecording || !recordingShortcut) return;
-
-		const handleKeyDown = (e: KeyboardEvent) => {
-			e.preventDefault();
-			e.stopPropagation();
-
-			const keyString = getKeybindingString(e);
-			if (keyString) {
-				const conflict = validateKeybinding(
-					keyString,
-					recordingShortcut.action,
-				);
-				if (conflict) {
-					toast.error(
-						`Key "${keyString}" is already bound to "${conflict.existingAction}"`,
-					);
-					setRecordingShortcut(null);
-					return;
-				}
-
-				const oldKeys = getKeybindingsForAction(recordingShortcut.action);
-				for (const key of oldKeys) {
-					removeKeybinding(key);
-				}
-
-				updateKeybinding(keyString, recordingShortcut.action);
-
-				setIsRecording(false);
-				setRecordingShortcut(null);
-			}
-		};
-
-		const handleClickOutside = () => {
-			setRecordingShortcut(null);
-			setIsRecording(false);
-		};
-
-		document.addEventListener("keydown", handleKeyDown);
-		document.addEventListener("click", handleClickOutside);
-
-		return () => {
-			document.removeEventListener("keydown", handleKeyDown);
-			document.removeEventListener("click", handleClickOutside);
-		};
-	}, [
-		recordingShortcut,
-		getKeybindingString,
-		updateKeybinding,
-		removeKeybinding,
-		validateKeybinding,
-		getKeybindingsForAction,
-		setIsRecording,
-		isRecording,
-	]);
-
-	const handleStartRecording = (shortcut: KeyboardShortcut) => {
-		setRecordingShortcut(shortcut);
-		setIsRecording(true);
-	};
-
-	return (
-		<Dialog open={isOpen} onOpenChange={onOpenChange}>
-			<DialogContent className="flex max-h-[80vh] max-w-2xl flex-col p-0">
-				<DialogHeader>
-					<DialogTitle>Keyboard shortcuts</DialogTitle>
-				</DialogHeader>
-
-				<DialogBody className="scrollbar-thin grow overflow-y-auto">
-					<div className="flex flex-col gap-6">
-						{categories.map((category) => (
-							<div key={category} className="flex flex-col gap-1">
-								<h3 className="text-muted-foreground text-xs font-medium tracking-wide uppercase">
-									{category}
-								</h3>
-								<div className="flex flex-col gap-1">
-									{shortcuts
-										.filter((shortcut) => shortcut.category === category)
-										.map((shortcut) => (
-											<ShortcutItem
-												key={shortcut.action}
-												shortcut={shortcut}
-												isRecording={
-													shortcut.action === recordingShortcut?.action
-												}
-												onStartRecording={() => handleStartRecording(shortcut)}
-											/>
-										))}
-								</div>
-							</div>
-						))}
-					</div>
-				</DialogBody>
-				<DialogFooter>
-					<Button variant="destructive" onClick={resetToDefaults}>
-						Reset to default
-					</Button>
-				</DialogFooter>
-			</DialogContent>
-		</Dialog>
-	);
-}
-
-function ShortcutItem({
-	shortcut,
-	isRecording,
-	onStartRecording,
-}: {
-	shortcut: KeyboardShortcut;
-	isRecording: boolean;
-	onStartRecording: (params: { shortcut: KeyboardShortcut }) => void;
-}) {
-	const displayKeys = shortcut.keys.filter((key: string) => {
-		if (
-			key.includes("Cmd") &&
-			shortcut.keys.includes(key.replace("Cmd", "Ctrl"))
-		)
-			return false;
-
-		return true;
-	});
-
-	return (
-		<div className="flex items-center justify-between">
-			<div className="flex items-center gap-3">
-				{shortcut.icon && (
-					<div className="text-muted-foreground">{shortcut.icon}</div>
-				)}
-				<span className="text-sm">{shortcut.description}</span>
-			</div>
-			<div className="flex items-center gap-2">
-				{displayKeys.map((key: string, index: number) => (
-					<div key={key} className="flex items-center gap-2">
-						<div className="flex items-center gap-1">
-							{key.split("+").map((keyPart: string, partIndex: number) => {
-								const keyId = `${shortcut.id}-${index}-${partIndex}`;
-								return (
-									<EditableShortcutKey
-										key={keyId}
-										isRecording={isRecording}
-										onStartRecording={() => onStartRecording({ shortcut })}
-									>
-										{keyPart}
-									</EditableShortcutKey>
-								);
-							})}
-						</div>
-						{index < displayKeys.length - 1 && (
-							<span className="text-muted-foreground text-xs">or</span>
-						)}
-					</div>
-				))}
-			</div>
-		</div>
-	);
-}
-
-function EditableShortcutKey({
-	children,
-	isRecording,
-	onStartRecording,
-}: {
-	children: React.ReactNode;
-	isRecording: boolean;
-	onStartRecording: () => void;
-}) {
-	const handleClick = (e: React.MouseEvent) => {
-		e.preventDefault();
-		e.stopPropagation();
-		onStartRecording();
-	};
-
-	return (
-		<Button
-			variant="outline"
-			size="sm"
-			onClick={handleClick}
-			title={
-				isRecording ? "Press any key combination..." : "Click to edit shortcut"
-			}
-		>
-			{children}
-		</Button>
-	);
-}
-- 
cgit v1.3.1