From 3fb48021f71e43397aca2de5e2b4e4882b8ef741 Mon Sep 17 00:00:00 2001 From: Danny Avila Date: Fri, 5 Jun 2026 10:20:45 -0400 Subject: [PATCH] =?UTF-8?q?=F0=9F=AA=B9=20feat:=20Collapse=20Empty=20Proje?= =?UTF-8?q?cts=20Section=20in=20the=20Sidebar=20by=20Default=20(#13531)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The Projects section defaulted to expanded, taking sidebar space for users with no projects. Now derive the default: collapsed when there are no projects and the user has never toggled the section; expanded once they have a project or explicitly expand it. Any explicit toggle (new projectsSectionToggled flag) — or a collapse set before this default existed — is respected. --- .../Conversations/ProjectsSection.tsx | 19 +++++++++++++++++-- 1 file changed, 17 insertions(+), 2 deletions(-) diff --git a/client/src/components/Conversations/ProjectsSection.tsx b/client/src/components/Conversations/ProjectsSection.tsx index 4d5e87d3af..fcb050ae9f 100644 --- a/client/src/components/Conversations/ProjectsSection.tsx +++ b/client/src/components/Conversations/ProjectsSection.tsx @@ -382,7 +382,11 @@ interface ProjectsSectionProps { const ProjectsSection = ({ toggleNav, isAuthenticated }: ProjectsSectionProps) => { const localize = useLocalize(); const navigate = useNavigate(); - const [isExpanded, setIsExpanded] = useLocalStorage('projectsSectionExpanded', true); + const [storedExpanded, setStoredExpanded] = useLocalStorage('projectsSectionExpanded', true); + const [hasToggledSection, setHasToggledSection] = useLocalStorage( + 'projectsSectionToggled', + false, + ); const [isCreateOpen, setIsCreateOpen] = useState(false); const conversation = useRecoilValue(store.conversationByIndex(0)); const activeProjectId = conversation?.chatProjectId ?? null; @@ -395,6 +399,14 @@ const ProjectsSection = ({ toggleNav, isAuthenticated }: ProjectsSectionProps) = const projects = useMemo(() => data?.pages.flatMap((page) => page.projects) ?? [], [data?.pages]); const hasMore = (data?.pages[data.pages.length - 1]?.nextCursor ?? null) != null; + /** + * Collapse the section by default for users with no projects who have never + * toggled it, to keep the sidebar compact. An explicit toggle — or a collapse + * set before this default existed (stored === false) — is always respected. + */ + const respectStoredExpanded = hasToggledSection || storedExpanded === false; + const isExpanded = respectStoredExpanded ? storedExpanded : isLoading || projects.length > 0; + const openProjects = useCallback(() => { navigate('/projects'); toggleNav(); @@ -455,7 +467,10 @@ const ProjectsSection = ({ toggleNav, isAuthenticated }: ProjectsSectionProps) =