diff --git a/src/interface/web/app/components/chatInputArea/chatInputArea.tsx b/src/interface/web/app/components/chatInputArea/chatInputArea.tsx index 408eea1a4..a6be35a0f 100644 --- a/src/interface/web/app/components/chatInputArea/chatInputArea.tsx +++ b/src/interface/web/app/components/chatInputArea/chatInputArea.tsx @@ -113,6 +113,9 @@ export const ChatInputArea = forwardRef((pr const [isDragAndDropping, setIsDragAndDropping] = useState(false); const [showCommandList, setShowCommandList] = useState(false); + const [showFileFilter, setShowFileFilter] = useState(false); + const [fileFilterSuggestions, setFileFilterSuggestions] = useState([]); + const [fileFilterQuery, setFileFilterQuery] = useState(""); const [useResearchMode, setUseResearchMode] = useState( props.isResearchModeEnabled || false, ); @@ -242,6 +245,18 @@ export const ChatInputArea = forwardRef((pr uploadFiles(event.dataTransfer.files); } + async function fetchUserFiles() { + try { + const response = await fetch("/api/content/files"); + if (!response.ok) throw new Error("Failed to fetch files"); + const data = await response.json(); + return data.files.map((file: any) => file.file_name); + } catch (error) { + console.error("Error fetching files:", error); + return []; + } + } + function uploadFiles(files: FileList) { if (!props.isLoggedIn) { setLoginRedirectMessage("Please login to chat with your files"); @@ -415,6 +430,27 @@ export const ChatInputArea = forwardRef((pr setShowCommandList(true); } else { setShowCommandList(false); + + // Detect file: filter pattern + const fileFilterMatch = message.match(/file:(\S*)$/); + if (fileFilterMatch) { + const query = fileFilterMatch[1]; + setFileFilterQuery(query); + if (!showFileFilter) { + fetchUserFiles().then(files => { + setFileFilterSuggestions(files); + setShowFileFilter(true); + }); + } else { + // Filter existing suggestions + fetchUserFiles().then(allFiles => { + const filtered = allFiles.filter(f => f.toLowerCase().includes(query.toLowerCase())); + setFileFilterSuggestions(filtered); + }); + } + } else { + setShowFileFilter(false); + } } }, [message]); @@ -554,6 +590,39 @@ export const ChatInputArea = forwardRef((pr )} + {showFileFilter && ( + + + e.preventDefault()} + className={`${props.isMobileWidth ? "w-[100vw]" : "w-full"} rounded-md`} + side="bottom" + align="center" + sideOffset={props.conversationId ? 0 : 80} + > + + + + No files found. + + {fileFilterSuggestions.map((filename) => ( + { + const newMessage = message.replace(/file:\S*$/, `file:${filename} `); + setMessage(newMessage); + setShowFileFilter(false); + }} + > + {filename} + + ))} + + + + + + )}
{imageUploaded &&