diff --git a/client/src/components/Chat/Input/Files/FilesView.tsx b/client/src/components/Chat/Input/Files/MyFilesModal.tsx similarity index 78% rename from client/src/components/Chat/Input/Files/FilesView.tsx rename to client/src/components/Chat/Input/Files/MyFilesModal.tsx index 13a378b93d..098b738b33 100644 --- a/client/src/components/Chat/Input/Files/FilesView.tsx +++ b/client/src/components/Chat/Input/Files/MyFilesModal.tsx @@ -5,7 +5,15 @@ import { useGetFiles } from '~/data-provider'; import { DataTable, columns } from './Table'; import { useLocalize } from '~/hooks'; -export default function Files({ open, onOpenChange }) { +export function MyFilesModal({ + open, + onOpenChange, + triggerRef, +}: { + open: boolean; + onOpenChange: (open: boolean) => void; + triggerRef?: React.RefObject; +}) { const localize = useLocalize(); const { data: files = [] } = useGetFiles({ @@ -18,7 +26,7 @@ export default function Files({ open, onOpenChange }) { }); return ( - + (null); return ( - {showFiles && } + {showFiles && ( + + )} {showSettings && } ); diff --git a/client/src/components/SidePanel/Files/PanelTable.tsx b/client/src/components/SidePanel/Files/PanelTable.tsx index ca2cc2deec..f9e3f48e8d 100644 --- a/client/src/components/SidePanel/Files/PanelTable.tsx +++ b/client/src/components/SidePanel/Files/PanelTable.tsx @@ -1,6 +1,5 @@ -import { useState, useCallback, useMemo } from 'react'; +import { useState, useCallback, useMemo, useRef } from 'react'; import { ArrowUpLeft } from 'lucide-react'; -import { useSetRecoilState } from 'recoil'; import { Button, Input, @@ -33,10 +32,10 @@ import { getEndpointFileConfig, type TFile, } from 'librechat-data-provider'; +import { MyFilesModal } from '~/components/Chat/Input/Files/MyFilesModal'; import { useFileMapContext, useChatContext } from '~/Providers'; import { useLocalize, useUpdateFiles } from '~/hooks'; import { useGetFileConfig } from '~/data-provider'; -import store from '~/store'; interface DataTableProps { columns: ColumnDef[]; @@ -49,7 +48,8 @@ export default function DataTable({ columns, data }: DataTablePro const [columnFilters, setColumnFilters] = useState([]); const [columnVisibility, setColumnVisibility] = useState({}); const [{ pageIndex, pageSize }, setPagination] = useState({ pageIndex: 0, pageSize: 10 }); - const setShowFiles = useSetRecoilState(store.showFiles); + const [showFilesModal, setShowFilesModal] = useState(false); + const manageFilesRef = useRef(null); const pagination = useMemo( () => ({ @@ -301,9 +301,10 @@ export default function DataTable({ columns, data }: DataTablePro
+ ); } diff --git a/client/src/store/settings.ts b/client/src/store/settings.ts index 50c1ce3d54..ece96d119a 100644 --- a/client/src/store/settings.ts +++ b/client/src/store/settings.ts @@ -6,7 +6,6 @@ import type { TOptionSettings } from '~/common'; // Static atoms without localStorage const staticAtoms = { abortScroll: atom({ key: 'abortScroll', default: false }), - showFiles: atom({ key: 'showFiles', default: false }), optionSettings: atom({ key: 'optionSettings', default: {} }), currentSettingsView: atom({ key: 'currentSettingsView',