fix(desktop): hide pinned/recents sections until first session

A fresh sidebar showed the Pinned and Recent chats headers with floating empty-state copy underneath. Drop both sections (and the now-orphan SidebarEmptySessionState) when there are no sessions yet — they reappear after the first chat. Skeletons during initial load are unchanged.
This commit is contained in:
Brooklyn Nicholson 2026-05-08 08:04:55 -04:00
parent 281f764e2a
commit 5e4f2301f8

View file

@ -101,6 +101,7 @@ export function ChatSidebar({
const recentSessions = sortedSessions.filter(session => !visiblePinnedIdSet.has(session.id))
const showSessionSkeletons = sessionsLoading && sortedSessions.length === 0
const showSessionSections = showSessionSkeletons || sortedSessions.length > 0
return (
<Sidebar
@ -152,7 +153,7 @@ export function ChatSidebar({
</SidebarGroupContent>
</SidebarGroup>
{sidebarOpen && (
{sidebarOpen && showSessionSections && (
<SidebarGroup className="shrink-0 pl-4 pr-2 pb-1 pt-0">
<SidebarSectionHeader label="Pinned" onToggle={() => setSidebarPinsOpen(!pinsOpen)} open={pinsOpen} />
{pinsOpen && (
@ -180,7 +181,7 @@ export function ChatSidebar({
</SidebarGroup>
)}
{sidebarOpen && (
{sidebarOpen && showSessionSections && (
<SidebarGroup className="min-h-0 flex-1 pl-4 pr-2 py-0">
<SidebarSectionHeader
action={
@ -207,10 +208,7 @@ export function ChatSidebar({
{recentsOpen && (
<SidebarGroupContent className="flex min-h-0 flex-1 flex-col gap-px overflow-y-auto overscroll-contain pb-1.75">
{showSessionSkeletons && <SidebarSessionSkeletons />}
{!showSessionSkeletons && sortedSessions.length === 0 && <SidebarEmptySessionState />}
{!showSessionSkeletons && sortedSessions.length > 0 && recentSessions.length === 0 && (
<SidebarAllPinnedState />
)}
{!showSessionSkeletons && recentSessions.length === 0 && <SidebarAllPinnedState />}
{recentSessions.map(session => (
<SidebarSessionRow
isPinned={false}
@ -278,12 +276,6 @@ function SidebarSessionSkeletons() {
)
}
function SidebarEmptySessionState() {
return (
<p className="rounded-lg px-3 py-1.5 text-xs text-muted-foreground/80">Start a chat to build your history.</p>
)
}
function SidebarAllPinnedState() {
return (
<div className="grid min-h-24 place-items-center rounded-lg px-3 text-center text-xs text-muted-foreground">