refactor(useFileMentions): implement abort controller for fetch requests

src/components/chat/hooks/useFileMentions.tsx

@@ -56,15 +56,19 @@ export function useFileMentions({ selectedProject, input, setInput, textareaRef
   const [atSymbolPosition, setAtSymbolPosition] = useState(-1);
 
   useEffect(() => {
+    const abortController = new AbortController();
+
     const fetchProjectFiles = async () => {
-      if (!selectedProject) {
+      const projectName = selectedProject?.name;
-        setFileList([]);
+      setFileList([]);
-        setFilteredFiles([]);
+      setFilteredFiles([]);
+      if (!projectName) {
         return;
       }
 
+
       try {
-        const response = await api.getFiles(selectedProject.name);
+        const response = await api.getFiles(projectName, { signal: abortController.signal });
         if (!response.ok) {
           return;
         }
@@ -72,12 +76,19 @@ export function useFileMentions({ selectedProject, input, setInput, textareaRef
         const files = (await response.json()) as ProjectFileNode[];
         setFileList(flattenFileTree(files));
       } catch (error) {
+        // Ignore aborts from rapid project switches; we only care about the latest request.
+        if ((error as { name?: string })?.name === 'AbortError') {
+          return;
+        }
         console.error('Error fetching files:', error);
       }
     };
 
     fetchProjectFiles();
-  }, [selectedProject]);
+    return () => {
+      abortController.abort();
+    };
+  }, [selectedProject?.name]);
 
   useEffect(() => {
     const textBeforeCursor = input.slice(0, cursorPosition);

src/utils/api.js

@@ -101,8 +101,8 @@ export const api = {
       method: 'PUT',
       body: JSON.stringify({ filePath, content }),
     }),
-  getFiles: (projectName) =>
+  getFiles: (projectName, options = {}) =>
-    authenticatedFetch(`/api/projects/${projectName}/files`),
+    authenticatedFetch(`/api/projects/${projectName}/files`, options),
   transcribe: (formData) =>
     authenticatedFetch('/api/transcribe', {
       method: 'POST',