diff --git a/client/src/components/Projects/ProjectsView.tsx b/client/src/components/Projects/ProjectsView.tsx index e493fa2689..0cbbab1404 100644 --- a/client/src/components/Projects/ProjectsView.tsx +++ b/client/src/components/Projects/ProjectsView.tsx @@ -1,14 +1,15 @@ import { useDeferredValue, useEffect, useId, useMemo, useState } from 'react'; import * as Ariakit from '@ariakit/react'; -import { ArrowUpDown, Check, Folder, Plus, Search } from 'lucide-react'; import { useNavigate, useSearchParams } from 'react-router-dom'; +import { ArrowUpDown, Check, Folder, Plus, Search } from 'lucide-react'; +import { Input, Button, Spinner, DropdownPopup, useMediaQuery } from '@librechat/client'; import type { TChatProject } from 'librechat-data-provider'; -import { Input, Button, Spinner, DropdownPopup } from '@librechat/client'; import type { MenuItemProps, RenderProp } from '~/common'; +import OpenSidebar from '~/components/Chat/Menus/OpenSidebar'; import { useProjectsInfiniteQuery } from '~/data-provider'; +import ProjectCreateDialog from './ProjectCreateDialog'; import { useLocalize } from '~/hooks'; import { cn } from '~/utils'; -import ProjectCreateDialog from './ProjectCreateDialog'; type ProjectSort = 'name' | 'createdAt' | 'lastConversationAt'; @@ -49,6 +50,7 @@ export default function ProjectsView() { const sortMenuId = useId(); const [isSortMenuOpen, setIsSortMenuOpen] = useState(false); const deferredSearch = useDeferredValue(search); + const isSmallScreen = useMediaQuery('(max-width: 768px)'); const { data, fetchNextPage, isFetchingNextPage, isLoading } = useProjectsInfiniteQuery({ search: deferredSearch || undefined, @@ -103,9 +105,12 @@ export default function ProjectsView() {
-

- {localize('com_ui_projects')} -

+
+ {isSmallScreen ? : null} +

+ {localize('com_ui_projects')} +

+
{localize('com_ui_sort_by')}