diff --git a/packages/ui/src/components/views/FilesView.tsx b/packages/ui/src/components/views/FilesView.tsx index 7e45f930..b3ccff6f 100644 --- a/packages/ui/src/components/views/FilesView.tsx +++ b/packages/ui/src/components/views/FilesView.tsx @@ -665,6 +665,7 @@ export const FilesView: React.FC = ({ mode = 'full' }) => { const [isSaving, setIsSaving] = React.useState(false); const autoSaveTimerRef = React.useRef | null>(null); const lastLoadedFileStatRef = React.useRef(null); + const activeFileLoadIdRef = React.useRef(0); const [autoSaveStatus, setAutoSaveStatus] = React.useState<'idle' | 'saved'>('idle'); const [autoSaveEnabled, setAutoSaveEnabled] = React.useState(getInitialAutoSaveEnabled); @@ -1452,6 +1453,15 @@ export const FilesView: React.FC = ({ mode = 'full' }) => { }, [isSaving, saveDraft]); const loadSelectedFile = React.useCallback(async (node: FileNode) => { + const loadId = activeFileLoadIdRef.current + 1; + activeFileLoadIdRef.current = loadId; + const isCurrentLoad = () => { + if (!root) return false; + const rootState = useFilesViewTabsStore.getState().byRoot[root]; + const currentPath = rootState?.selectedPath ?? rootState?.openPaths[0] ?? null; + return activeFileLoadIdRef.current === loadId && currentPath === node.path; + }; + setFileError(null); setDesktopImageSrc(''); setLoadedFilePath(null); @@ -1486,6 +1496,9 @@ export const FilesView: React.FC = ({ mode = 'full' }) => { await readFile(node.path, readOptions) .then((content) => { + if (!isCurrentLoad()) { + return; + } setFileContent(content); setDraftContent(content.length > MAX_VIEW_CHARS ? `${content.slice(0, MAX_VIEW_CHARS)}\n\n… truncated …` @@ -1493,14 +1506,18 @@ export const FilesView: React.FC = ({ mode = 'full' }) => { setLoadedFilePath(node.path); void readFileStat(node.path, readOptions) .then((stat) => { - if (stat) { + if (stat && isCurrentLoad()) { lastLoadedFileStatRef.current = stat; } }) .catch(() => {}); }) .catch((error) => { + if (!isCurrentLoad()) { + return; + } if (isDirectoryReadError(error)) { + setFileLoading(false); if (root) { setSelectedPath(root, null); } @@ -1535,7 +1552,9 @@ export const FilesView: React.FC = ({ mode = 'full' }) => { lastLoadedFileStatRef.current = null; }) .finally(() => { - setFileLoading(false); + if (isCurrentLoad()) { + setFileLoading(false); + } }); }, [expandPaths, isMobile, loadDirectory, mode, readFile, readFileStat, root, runtime.isDesktop, searchQuery, setSelectedPath, t]); @@ -1601,6 +1620,8 @@ export const FilesView: React.FC = ({ mode = 'full' }) => { React.useEffect(() => { if (!selectedFile) { + activeFileLoadIdRef.current += 1; + setFileLoading(false); return; }