aiexecode 1.0.94 → 1.0.98

package/src/frontend/hooks/useFileCompletion.js

@@ -0,0 +1,467 @@
+/**
+ * File Completion Hook
+ *
+ * @ 문자 감지 시 파일/디렉토리 자동완성을 제공합니다.
+ * - 경로 모드: @src/ → src 디렉토리 내용 표시
+ * - 검색 모드: @glob → 프로젝트 전체에서 "glob" 포함 파일 검색
+ */
+
+import { useState, useEffect, useCallback, useRef } from 'react';
+import { resolve, dirname, basename, join, relative } from 'path';
+import { safeReaddir, safeStat, safeExists } from '../../util/safe_fs.js';
+
+// 검색에서 제외할 디렉토리 (성능 최적화)
+const EXCLUDED_DIRS = new Set([
+    'node_modules',
+    '.git',
+    '.svn',
+    '.hg',
+    'dist',
+    'build',
+    'out',
+    'output',
+    'target',
+    '.next',
+    '.nuxt',
+    '.svelte-kit',
+    '__pycache__',
+    '.pytest_cache',
+    '.mypy_cache',
+    '.tox',
+    'venv',
+    '.venv',
+    'env',
+    '.virtualenv',
+    '.cache',
+    '.temp',
+    '.tmp',
+    'coverage',
+    '.nyc_output',
+    '.turbo',
+    '.parcel-cache',
+    '.sass-cache',
+    '.idea',
+    '.vscode',
+    '.vs',
+    'vendor',
+    'Pods',
+    '.bundle',
+    'bower_components',
+    'jspm_packages',
+    'bin',
+    'obj',
+    'logs'
+]);
+
+// 검색 최대 깊이
+const MAX_SEARCH_DEPTH = 5;
+
+// 검색 최대 결과 수
+const MAX_SEARCH_RESULTS = 20;
+
+// 디바운스 시간 (ms)
+const SEARCH_DEBOUNCE_MS = 150;
+
+/**
+ * 텍스트에서 @ 참조를 파싱합니다.
+ * @param {string} text - 전체 텍스트
+ * @param {number} cursorPosition - 커서 위치
+ * @returns {Object} { isActive, prefix, startIndex, isSearchMode }
+ */
+function parseAtReference(text, cursorPosition) {
+    const textBeforeCursor = text.slice(0, cursorPosition);
+    const match = textBeforeCursor.match(/@([^\s@]*)$/);
+
+    if (!match) {
+        return { isActive: false, prefix: '', startIndex: -1, isSearchMode: false };
+    }
+
+    const prefix = match[1];
+
+    // 검색 모드 판단: /가 없고 2글자 이상이면 검색 모드
+    const isSearchMode = prefix.length >= 2 && !prefix.includes('/');
+
+    return {
+        isActive: true,
+        prefix,
+        startIndex: match.index,
+        isSearchMode
+    };
+}
+
+/**
+ * 재귀적으로 파일을 검색합니다.
+ * @param {string} dirPath - 검색할 디렉토리
+ * @param {string} searchTerm - 검색어 (소문자)
+ * @param {string} basePath - 기준 경로 (상대 경로 계산용)
+ * @param {number} depth - 현재 깊이
+ * @param {Array} results - 결과 배열 (mutation)
+ * @param {number} maxResults - 최대 결과 수
+ */
+async function searchFilesRecursive(dirPath, searchTerm, basePath, depth, results, maxResults) {
+    // 깊이 제한 또는 결과 수 제한 도달
+    if (depth > MAX_SEARCH_DEPTH || results.length >= maxResults) {
+        return;
+    }
+
+    try {
+        const entries = await safeReaddir(dirPath, { withFileTypes: true });
+
+        for (const entry of entries) {
+            if (results.length >= maxResults) break;
+
+            const name = entry.name;
+
+            // 숨김 파일/폴더 제외
+            if (name.startsWith('.')) continue;
+
+            // 제외 디렉토리 체크
+            if (entry.isDirectory() && EXCLUDED_DIRS.has(name)) continue;
+
+            const fullPath = join(dirPath, name);
+            const relativePath = relative(basePath, fullPath);
+            const nameLower = name.toLowerCase();
+
+            // 이름에 검색어가 포함되면 결과에 추가
+            if (nameLower.includes(searchTerm)) {
+                const isDirectory = entry.isDirectory();
+                results.push({
+                    value: '@' + relativePath + (isDirectory ? '/' : ''),
+                    displayValue: relativePath,
+                    icon: isDirectory ? '📁' : '📄',
+                    isDirectory,
+                    description: isDirectory ? 'Directory' : 'File',
+                    // 정렬용 점수: 이름이 검색어로 시작하면 높은 점수
+                    score: nameLower.startsWith(searchTerm) ? 2 : (nameLower === searchTerm ? 3 : 1)
+                });
+            }
+
+            // 디렉토리면 재귀 탐색
+            if (entry.isDirectory() && results.length < maxResults) {
+                await searchFilesRecursive(fullPath, searchTerm, basePath, depth + 1, results, maxResults);
+            }
+        }
+    } catch (error) {
+        // 접근 불가능한 디렉토리는 무시
+    }
+}
+
+/**
+ * 프로젝트 전체에서 파일을 검색합니다.
+ * @param {string} searchTerm - 검색어
+ * @returns {Promise<Array>} 검색 결과
+ */
+async function searchFiles(searchTerm) {
+    const basePath = process.cwd();
+    const searchTermLower = searchTerm.toLowerCase();
+    const results = [];
+
+    await searchFilesRecursive(basePath, searchTermLower, basePath, 0, results, MAX_SEARCH_RESULTS);
+
+    // 점수순 정렬 (높은 점수 우선), 같은 점수면 경로 길이 짧은 것 우선
+    results.sort((a, b) => {
+        if (b.score !== a.score) return b.score - a.score;
+        if (a.displayValue.length !== b.displayValue.length) {
+            return a.displayValue.length - b.displayValue.length;
+        }
+        return a.displayValue.localeCompare(b.displayValue);
+    });
+
+    return results.slice(0, MAX_SEARCH_RESULTS);
+}
+
+/**
+ * 디렉토리 내용을 가져와 필터링합니다.
+ * @param {string} prefix - @ 뒤의 경로 prefix
+ * @returns {Promise<Array>} 자동완성 항목 목록
+ */
+async function fetchDirectoryContents(prefix) {
+    try {
+        let dirPath;
+        let filterPrefix;
+
+        if (!prefix) {
+            dirPath = process.cwd();
+            filterPrefix = '';
+        } else if (prefix.endsWith('/')) {
+            dirPath = resolve(process.cwd(), prefix);
+            filterPrefix = '';
+        } else {
+            const parentDir = dirname(prefix);
+            filterPrefix = basename(prefix).toLowerCase();
+
+            if (parentDir === '.' || parentDir === '') {
+                dirPath = process.cwd();
+            } else {
+                dirPath = resolve(process.cwd(), parentDir);
+            }
+        }
+
+        const exists = await safeExists(dirPath);
+        if (!exists) return [];
+
+        const stat = await safeStat(dirPath);
+        if (!stat.isDirectory()) return [];
+
+        const entries = await safeReaddir(dirPath, { withFileTypes: true });
+        const results = [];
+
+        for (const entry of entries) {
+            const name = entry.name;
+
+            if (name.startsWith('.')) continue;
+
+            if (filterPrefix && !name.toLowerCase().startsWith(filterPrefix)) continue;
+
+            const isDirectory = entry.isDirectory();
+
+            let completePath;
+            if (!prefix) {
+                completePath = name;
+            } else if (prefix.endsWith('/')) {
+                completePath = prefix + name;
+            } else {
+                const parentDir = dirname(prefix);
+                if (parentDir === '.' || parentDir === '') {
+                    completePath = name;
+                } else {
+                    completePath = join(parentDir, name);
+                }
+            }
+
+            results.push({
+                value: '@' + completePath + (isDirectory ? '/' : ''),
+                displayValue: name,
+                icon: isDirectory ? '📁' : '📄',
+                isDirectory,
+                description: isDirectory ? 'Directory' : 'File'
+            });
+        }
+
+        results.sort((a, b) => {
+            if (a.isDirectory && !b.isDirectory) return -1;
+            if (!a.isDirectory && b.isDirectory) return 1;
+            return a.displayValue.localeCompare(b.displayValue);
+        });
+
+        return results.slice(0, 20);
+
+    } catch (error) {
+        return [];
+    }
+}
+
+/**
+ * 파일 자동완성 훅
+ * @param {Object} buffer - Input buffer 객체
+ * @returns {Object} 자동완성 상태 및 핸들러
+ */
+export function useFileCompletion(buffer) {
+    const [suggestions, setSuggestions] = useState([]);
+    const [activeSuggestionIndex, setActiveSuggestionIndex] = useState(-1);
+    const [showSuggestions, setShowSuggestions] = useState(false);
+    const [atReference, setAtReference] = useState({ isActive: false, prefix: '', startIndex: -1, isSearchMode: false });
+    const lastTextRef = useRef('');
+    const fetchingRef = useRef(false);
+    const debounceTimerRef = useRef(null);
+    const lastSearchTermRef = useRef('');
+
+    useEffect(() => {
+        const text = buffer.text;
+
+        if (text === lastTextRef.current) {
+            return;
+        }
+        lastTextRef.current = text;
+
+        // 커서 위치 계산
+        const [row, col] = buffer.cursor;
+        const lines = buffer.lines;
+        let cursorPosition = 0;
+        for (let i = 0; i < row; i++) {
+            cursorPosition += lines[i].length + 1;
+        }
+        cursorPosition += col;
+
+        const ref = parseAtReference(text, cursorPosition);
+        setAtReference(ref);
+
+        if (!ref.isActive) {
+            if (showSuggestions) {
+                setSuggestions([]);
+                setShowSuggestions(false);
+                setActiveSuggestionIndex(-1);
+            }
+            // 디바운스 타이머 정리
+            if (debounceTimerRef.current) {
+                clearTimeout(debounceTimerRef.current);
+                debounceTimerRef.current = null;
+            }
+            return;
+        }
+
+        // 검색 모드
+        if (ref.isSearchMode) {
+            // 같은 검색어면 스킵
+            if (ref.prefix === lastSearchTermRef.current) {
+                return;
+            }
+
+            // 기존 타이머 취소
+            if (debounceTimerRef.current) {
+                clearTimeout(debounceTimerRef.current);
+            }
+
+            // 디바운스 적용
+            debounceTimerRef.current = setTimeout(async () => {
+                if (fetchingRef.current) return;
+
+                fetchingRef.current = true;
+                lastSearchTermRef.current = ref.prefix;
+
+                try {
+                    const results = await searchFiles(ref.prefix);
+
+                    // 텍스트가 변경되었으면 무시
+                    if (buffer.text !== lastTextRef.current) {
+                        fetchingRef.current = false;
+                        return;
+                    }
+
+                    setSuggestions(results);
+                    setShowSuggestions(results.length > 0);
+                    setActiveSuggestionIndex(results.length > 0 ? 0 : -1);
+                } catch (error) {
+                    // 에러 무시
+                } finally {
+                    fetchingRef.current = false;
+                }
+            }, SEARCH_DEBOUNCE_MS);
+
+            return;
+        }
+
+        // 경로 모드 (기존 로직)
+        lastSearchTermRef.current = '';
+
+        if (fetchingRef.current) {
+            return;
+        }
+
+        fetchingRef.current = true;
+        fetchDirectoryContents(ref.prefix).then(results => {
+            fetchingRef.current = false;
+
+            if (buffer.text !== lastTextRef.current) {
+                return;
+            }
+
+            setSuggestions(results);
+            setShowSuggestions(results.length > 0);
+            setActiveSuggestionIndex(results.length > 0 ? 0 : -1);
+        }).catch(() => {
+            fetchingRef.current = false;
+        });
+
+    }, [buffer.text, buffer.cursor, buffer.lines, showSuggestions]);
+
+    // 컴포넌트 언마운트 시 타이머 정리
+    useEffect(() => {
+        return () => {
+            if (debounceTimerRef.current) {
+                clearTimeout(debounceTimerRef.current);
+            }
+        };
+    }, []);
+
+    const navigateUp = useCallback(() => {
+        setActiveSuggestionIndex(prev =>
+            prev > 0 ? prev - 1 : suggestions.length - 1
+        );
+    }, [suggestions.length]);
+
+    const navigateDown = useCallback(() => {
+        setActiveSuggestionIndex(prev =>
+            prev < suggestions.length - 1 ? prev + 1 : 0
+        );
+    }, [suggestions.length]);
+
+    const handleAutocomplete = useCallback((index) => {
+        if (index >= 0 && index < suggestions.length) {
+            const suggestion = suggestions[index];
+            const text = buffer.text;
+
+            const beforeAt = text.slice(0, atReference.startIndex);
+
+            const [row, col] = buffer.cursor;
+            const lines = buffer.lines;
+            let cursorPosition = 0;
+            for (let i = 0; i < row; i++) {
+                cursorPosition += lines[i].length + 1;
+            }
+            cursorPosition += col;
+            const afterCursor = text.slice(cursorPosition);
+
+            let newValue = suggestion.value;
+
+            if (!suggestion.isDirectory) {
+                newValue += ' ';
+            }
+
+            const newText = beforeAt + newValue + afterCursor;
+            buffer.setText(newText);
+
+            const newCursorPos = beforeAt.length + newValue.length;
+
+            let pos = 0;
+            let targetRow = 0;
+            let targetCol = 0;
+            const newLines = newText.split('\n');
+            for (let i = 0; i < newLines.length; i++) {
+                if (pos + newLines[i].length >= newCursorPos) {
+                    targetRow = i;
+                    targetCol = newCursorPos - pos;
+                    break;
+                }
+                pos += newLines[i].length + 1;
+            }
+
+            if (typeof buffer.setCursor === 'function') {
+                buffer.setCursor(targetRow, targetCol);
+            } else {
+                buffer.move('end');
+            }
+
+            if (suggestion.isDirectory) {
+                // 디렉토리 선택 시 검색 모드 해제
+                lastSearchTermRef.current = '';
+            } else {
+                setSuggestions([]);
+                setShowSuggestions(false);
+                setActiveSuggestionIndex(-1);
+            }
+        }
+    }, [buffer, suggestions, atReference]);
+
+    const resetCompletionState = useCallback(() => {
+        setSuggestions([]);
+        setShowSuggestions(false);
+        setActiveSuggestionIndex(-1);
+        setAtReference({ isActive: false, prefix: '', startIndex: -1, isSearchMode: false });
+        lastSearchTermRef.current = '';
+        if (debounceTimerRef.current) {
+            clearTimeout(debounceTimerRef.current);
+            debounceTimerRef.current = null;
+        }
+    }, []);
+
+    return {
+        suggestions,
+        activeSuggestionIndex,
+        showSuggestions,
+        navigateUp,
+        navigateDown,
+        handleAutocomplete,
+        resetCompletionState
+    };
+}