diff --git a/studio/backend/routes/settings.py b/studio/backend/routes/settings.py index 73fbb2dbed..796b0f5ac4 100644 --- a/studio/backend/routes/settings.py +++ b/studio/backend/routes/settings.py @@ -735,8 +735,8 @@ SIDEBAR_MENU_ITEM_DEFAULTS = { } # Navigable sidebar rows the user can pin/reorder; the boolean is each id's -# default pin state, matching the shipped layout. An unpinned row moves into the -# "More" flyout client-side, so it stays reachable. +# default pin state, matching the shipped layout. Unpinned rows collect in the +# "More" flyout client-side; a single unpinned row is hidden there instead. SIDEBAR_NAV_ITEM_DEFAULTS = { "projects": True, "hub": True, diff --git a/studio/frontend/src/components/app-sidebar.tsx b/studio/frontend/src/components/app-sidebar.tsx index 5bb7434d3e..449b138af3 100644 --- a/studio/frontend/src/components/app-sidebar.tsx +++ b/studio/frontend/src/components/app-sidebar.tsx @@ -829,11 +829,11 @@ export function AppSidebar() { .filter((item) => !item.pinned) .map((item) => item.id); // A flyout wrapping a single row costs a click and earns nothing, so More only - // appears once it would hold two or more; a lone unpinned row renders inline, - // in its saved order position. + // appears once it would hold two or more. With exactly one row unpinned, both + // the menu and that row are dropped -- the page stays reachable by URL. const overflowNavIds = unpinnedNavIds.length > 1 ? unpinnedNavIds : []; const inlineNavIds = sidebarNav - .filter((item) => item.pinned || overflowNavIds.length === 0) + .filter((item) => item.pinned) .map((item) => item.id); const showSidebarBrand = !usesCustomTitlebar; diff --git a/studio/frontend/src/features/settings/components/sidebar-nav-customizer.tsx b/studio/frontend/src/features/settings/components/sidebar-nav-customizer.tsx index fb23dca4ae..e0bf096871 100644 --- a/studio/frontend/src/features/settings/components/sidebar-nav-customizer.tsx +++ b/studio/frontend/src/features/settings/components/sidebar-nav-customizer.tsx @@ -6,11 +6,11 @@ import { DashboardCircleIcon, DownloadSquare01Icon, DragDropVerticalIcon, - Edit03Icon, FlimSlateIcon, Folder01Icon, Image03Icon, MoreHorizontalIcon, + PencilEdit02Icon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { Reorder, useDragControls } from "motion/react"; @@ -107,11 +107,11 @@ function MovableRow({ item }: { item: SidebarNavItemPref }) { } /** - * Pin and reorder the sidebar navigation rows. A row with its switch off moves - * into the "More" flyout instead of disappearing, so every page stays reachable - * -- unless it is the only unpinned row, which stays inline (a menu holding one - * item earns nothing). New chat renders as a static row: it is an action pinned - * to the top, not a destination. + * Pin and reorder the sidebar navigation rows. Rows with their switch off collect + * in the "More" flyout. A single unpinned row is hidden outright instead: More + * would be a menu of one, so neither it nor the row is drawn (the page stays + * reachable by URL). New chat renders as a static row: it is an action pinned to + * the top, not a destination. */ export function SidebarNavCustomizer() { const t = useT(); @@ -120,7 +120,7 @@ export function SidebarNavCustomizer() { const unpinnedCount = sidebarNav.filter((item) => !item.pinned).length; return (