homeio

1"use client";
2
3import { useEffect, useEffectEvent } from "react";
4import { toFilePath } from "@/modules/files/hooks/useFiles";
5import type { FileEntry } from "@/modules/files/components/file-manager-presenters";
6import type {
7  ClipboardState,
8  FileManagerAction,
9  PasteConflictState,
10} from "@/modules/files/components/manager/file-manager-state";
11
12type UseFileManagerKeyboardArgs = {
13  clipboardState: ClipboardState | null;
14  createEntryDialogOpen: boolean;
15  currentPath: string[];
16  dispatch: (action: FileManagerAction) => void;
17  fileInfoDialogOpen: boolean;
18  isStarredView: boolean;
19  isTrashView: boolean;
20  openFileOpen: boolean;
21  pasteConflict: PasteConflictState | null;
22  renameDialogOpen: boolean;
23  searchQuery: string;
24  selectedFile: string | null;
25  selectedFiles: Set<string>;
26  showContextMenuOpen: boolean;
27  showEmptyTrashConfirmOpen: boolean;
28  sortedEntries: FileEntry[];
29  onCopyEntries: (entries: FileEntry[], operation: "copy" | "move") => void;
30  onDeleteFromTrash: (entry: FileEntry) => Promise<void>;
31  onMoveToTrash: (entry: FileEntry) => Promise<void>;
32  onNavigateTo: (entry: FileEntry) => void;
33  onNavigateUp: () => void;
34  onPaste: (destinationPath: string) => Promise<void>;
35  onRenameEntry: (entry: FileEntry) => void;
36};
37
38export function useFileManagerKeyboard({
39  clipboardState,
40  createEntryDialogOpen,
41  currentPath,
42  dispatch,
43  fileInfoDialogOpen,
44  isStarredView,
45  isTrashView,
46  onCopyEntries,
47  onDeleteFromTrash,
48  onMoveToTrash,
49  onNavigateTo,
50  onNavigateUp,
51  onPaste,
52  onRenameEntry,
53  openFileOpen,
54  pasteConflict,
55  renameDialogOpen,
56  searchQuery,
57  selectedFile,
58  selectedFiles,
59  showContextMenuOpen,
60  showEmptyTrashConfirmOpen,
61  sortedEntries,
62}: UseFileManagerKeyboardArgs) {
63  const navigateToEvent = useEffectEvent((entry: FileEntry) => onNavigateTo(entry));
64  const navigateUpEvent = useEffectEvent(() => onNavigateUp());
65  const deleteFromTrashEvent = useEffectEvent((entry: FileEntry) => {
66    void onDeleteFromTrash(entry);
67  });
68  const moveToTrashEvent = useEffectEvent((entry: FileEntry) => {
69    void onMoveToTrash(entry);
70  });
71  const renameEntryEvent = useEffectEvent((entry: FileEntry) => onRenameEntry(entry));
72  const copyEntryEvent = useEffectEvent((entries: FileEntry[], operation: "copy" | "move") => {
73    onCopyEntries(entries, operation);
74  });
75  const pasteEvent = useEffectEvent((destinationPath: string) => {
76    void onPaste(destinationPath);
77  });
78
79  useEffect(() => {
80    function onKeyDown(event: KeyboardEvent) {
81      const target = event.target as HTMLElement | null;
82      const tag = target?.tagName;
83      if (tag === "INPUT" || tag === "TEXTAREA" || target?.isContentEditable) return;
84      if (
85        createEntryDialogOpen ||
86        renameDialogOpen ||
87        fileInfoDialogOpen ||
88        showEmptyTrashConfirmOpen ||
89        showContextMenuOpen ||
90        pasteConflict
91      ) {
92        return;
93      }
94
95      if (event.key === "Escape") {
96        event.preventDefault();
97        if (openFileOpen) dispatch({ type: "CLOSE_FILE" });
98        else if (selectedFile || selectedFiles.size > 0) dispatch({ type: "CLEAR_SELECTION" });
99        else if (searchQuery) dispatch({ type: "SET_SEARCH_QUERY", query: "" });
100        return;
101      }
102
103      if (openFileOpen || sortedEntries.length === 0) return;
104
105      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
106        event.preventDefault();
107        const currentIndex = selectedFile
108          ? sortedEntries.findIndex((entry) => entry.name === selectedFile)
109          : -1;
110        const nextIndex =
111          event.key === "ArrowDown"
112            ? Math.min(currentIndex + 1, sortedEntries.length - 1)
113            : Math.max(currentIndex - 1, 0);
114        dispatch({ type: "SELECT_FILE", name: sortedEntries[nextIndex].name });
115        dispatch({ type: "SET_SELECTED_FILES", files: new Set([sortedEntries[nextIndex].name]) });
116        return;
117      }
118
119      if (event.key === "Enter" || event.key === "ArrowRight") {
120        if (!selectedFile) return;
121        const entry = sortedEntries.find((candidate) => candidate.name === selectedFile);
122        if (!entry) return;
123        event.preventDefault();
124        navigateToEvent(entry);
125        return;
126      }
127
128      if (event.key === "Backspace" || event.key === "ArrowLeft") {
129        if (currentPath.length > 0 && !isStarredView) {
130          event.preventDefault();
131          navigateUpEvent();
132        }
133        return;
134      }
135
136      if (event.key === "Delete") {
137        const names =
138          selectedFiles.size > 0 ? [...selectedFiles] : selectedFile ? [selectedFile] : [];
139        if (names.length === 0) return;
140        event.preventDefault();
141        for (const name of names) {
142          const entry = sortedEntries.find((candidate) => candidate.name === name);
143          if (!entry) continue;
144          if (isTrashView) deleteFromTrashEvent(entry);
145          else moveToTrashEvent(entry);
146        }
147        return;
148      }
149
150      if (event.key === "F2") {
151        if (!selectedFile || isTrashView) return;
152        const entry = sortedEntries.find((candidate) => candidate.name === selectedFile);
153        if (!entry) return;
154        event.preventDefault();
155        renameEntryEvent(entry);
156        return;
157      }
158
159      const isMod = event.ctrlKey || event.metaKey;
160      if (!isMod) return;
161
162      if (event.key === "a" || event.key === "A") {
163        event.preventDefault();
164        dispatch({
165          type: "SET_SELECTED_FILES",
166          files: new Set(sortedEntries.map((entry) => entry.name)),
167        });
168        if (sortedEntries.length > 0) {
169          dispatch({ type: "SELECT_FILE", name: sortedEntries[0].name });
170        }
171        return;
172      }
173
174      if (event.key === "c" || event.key === "C" || event.key === "x" || event.key === "X") {
175        if (isTrashView) return;
176        const entries =
177          selectedFiles.size > 0
178            ? sortedEntries.filter((entry) => selectedFiles.has(entry.name))
179            : selectedFile
180              ? sortedEntries.filter((entry) => entry.name === selectedFile)
181              : [];
182        if (entries.length === 0) return;
183        event.preventDefault();
184        copyEntryEvent(entries, event.key.toLowerCase() === "c" ? "copy" : "move");
185        return;
186      }
187
188      if (event.key === "v" || event.key === "V") {
189        if (!clipboardState || isTrashView) return;
190        event.preventDefault();
191        pasteEvent(toFilePath(currentPath));
192      }
193    }
194
195    window.addEventListener("keydown", onKeyDown);
196    return () => window.removeEventListener("keydown", onKeyDown);
197  }, [
198    clipboardState,
199    createEntryDialogOpen,
200    currentPath,
201    dispatch,
202    fileInfoDialogOpen,
203    isStarredView,
204    isTrashView,
205    openFileOpen,
206    pasteConflict,
207    renameDialogOpen,
208    searchQuery,
209    selectedFile,
210    selectedFiles,
211    showContextMenuOpen,
212    showEmptyTrashConfirmOpen,
213    sortedEntries,
214  ]);
215}
216