diff --git a/web-app/src/containers/LeftPanel.tsx b/web-app/src/containers/LeftPanel.tsx index 24f3bf9119..f24dcec0d0 100644 --- a/web-app/src/containers/LeftPanel.tsx +++ b/web-app/src/containers/LeftPanel.tsx @@ -1,4 +1,4 @@ -import { Link, useRouterState } from '@tanstack/react-router' +import { Link, useRouterState, useNavigate } from '@tanstack/react-router' import { useLeftPanel } from '@/hooks/useLeftPanel' import { cn } from '@/lib/utils' import { @@ -58,6 +58,9 @@ const mainMenus = [ route: route.project, isEnabled: true, }, +] + +const secondaryMenus = [ { title: 'common:assistants', icon: IconClipboardSmile, @@ -82,6 +85,7 @@ const LeftPanel = () => { const open = useLeftPanel((state) => state.open) const setLeftPanel = useLeftPanel((state) => state.setLeftPanel) const { t } = useTranslation() + const navigate = useNavigate() const [searchTerm, setSearchTerm] = useState('') const { isAuthenticated } = useAuth() @@ -212,7 +216,12 @@ const LeftPanel = () => { if (editingProjectKey) { updateFolder(editingProjectKey, name) } else { - addFolder(name) + const newProject = addFolder(name) + // Navigate to the newly created project + navigate({ + to: '/project/$projectId', + params: { projectId: newProject.id }, + }) } setProjectDialogOpen(false) setEditingProjectKey(null) @@ -487,7 +496,7 @@ const LeftPanel = () => { )}
-
+
{favoritedThreads.length > 0 && ( <> @@ -607,6 +616,44 @@ const LeftPanel = () => {
+ + {secondaryMenus.map((menu) => { + if (!menu.isEnabled) { + return null + } + + // Regular menu items must have route and icon + if (!menu.route || !menu.icon) return null + + const isActive = (() => { + // Settings routes + if (menu.route.includes(route.settings.index)) { + return currentPath.includes(route.settings.index) + } + + // Default exact match for other routes + return currentPath === menu.route + })() + return ( + isSmallScreen && setLeftPanel(false)} + data-test-id={`menu-${menu.title}`} + activeOptions={{ exact: true }} + className={cn( + 'flex items-center gap-1.5 cursor-pointer hover:bg-left-panel-fg/10 py-1 px-1 rounded', + isActive && 'bg-left-panel-fg/10' + )} + > + + + {t(menu.title)} + + + ) + })} + {PlatformFeatures[PlatformFeature.AUTHENTICATION] && (
diff --git a/web-app/src/containers/ThreadList.tsx b/web-app/src/containers/ThreadList.tsx index b58d1872a3..ef2ccdf5d7 100644 --- a/web-app/src/containers/ThreadList.tsx +++ b/web-app/src/containers/ThreadList.tsx @@ -185,7 +185,10 @@ const SortableItem = memo( { e.preventDefault() e.stopPropagation() diff --git a/web-app/src/hooks/useThreadManagement.ts b/web-app/src/hooks/useThreadManagement.ts index 84e5b0e34e..becb41defa 100644 --- a/web-app/src/hooks/useThreadManagement.ts +++ b/web-app/src/hooks/useThreadManagement.ts @@ -13,7 +13,7 @@ type ThreadFolder = { type ThreadManagementState = { folders: ThreadFolder[] setFolders: (folders: ThreadFolder[]) => void - addFolder: (name: string) => void + addFolder: (name: string) => ThreadFolder updateFolder: (id: string, name: string) => void deleteFolder: (id: string) => void getFolderById: (id: string) => ThreadFolder | undefined @@ -37,6 +37,7 @@ export const useThreadManagement = create()( set((state) => ({ folders: [...state.folders, newFolder], })) + return newFolder }, updateFolder: (id, name) => { diff --git a/web-app/src/routes/project/index.tsx b/web-app/src/routes/project/index.tsx index 5ab24bb396..300bb550b4 100644 --- a/web-app/src/routes/project/index.tsx +++ b/web-app/src/routes/project/index.tsx @@ -1,4 +1,4 @@ -import { createFileRoute } from '@tanstack/react-router' +import { createFileRoute, useNavigate } from '@tanstack/react-router' import { useState, useMemo } from 'react' import { useThreadManagement } from '@/hooks/useThreadManagement' @@ -31,6 +31,7 @@ function Project() { function ProjectContent() { const { t } = useTranslation() + const navigate = useNavigate() const { folders, addFolder, updateFolder, deleteFolder, getFolderById } = useThreadManagement() const threads = useThreads((state) => state.threads) @@ -59,7 +60,12 @@ function ProjectContent() { if (editingKey) { updateFolder(editingKey, name) } else { - addFolder(name) + const newProject = addFolder(name) + // Navigate to the newly created project + navigate({ + to: '/project/$projectId', + params: { projectId: newProject.id }, + }) } setOpen(false) setEditingKey(null)