Function AppSidebar

web/src/components/app-sidebar.tsx:226–281

()

 * Main application sidebar with navigation, recent sessions, and user info.
 */
export function AppSidebar() {
  const { open } = useSidebar();
  const { data: sessions, isLoading: sessionsLoading } = useSessions();
  return (
    <Sidebar collapsible="icon">
      <SidebarHeader>
        <SidebarMenu>
          <SidebarMenuItem>
            <SidebarMenuButton size="lg" asChild>
              <Link to="/">
                <div className="flex-1 text-left items-center justify-center">
                  <div className="flex font-serif text-lg text-primary">
                    <span className={cn(open ? "" : "translate-x-2")}>📯</span>
                    <span
                      className={cn(
                        "transition-opacity duration-300 font-medium translate-x-2",
                        open ? "" : "opacity-0",
                      )}
                    >
                      Agentara
                    </span>
                  </div>
                </div>
              </Link>
            </SidebarMenuButton>
          </SidebarMenuItem>
        </SidebarMenu>
      </SidebarHeader>

      <SidebarContent>
        <NavSidebarGroup />
        <RecentsSidebarGroup loading={sessionsLoading} sessions={sessions} />
      </SidebarContent>

      <SidebarFooter className="border-t border-sidebar-border">
        <SidebarMenu>
          <SidebarMenuItem>
            <SidebarMenuButton size="lg" tooltip="Henry Li">
              <div className="flex items-center gap-2">
                <Avatar name="Henry Li" variant="beam" size={32} />
                <div className="grid flex-1 text-left leading-tight">
                  <span className="text-sm font-semibold">Henry Li</span>
                  <span className="text-xs text-muted-foreground">
                    Super Individual
                  </span>
                </div>
              </div>
            </SidebarMenuButton>
          </SidebarMenuItem>
        </SidebarMenu>
      </SidebarFooter>

      <SidebarRail />
    </Sidebar>
  );
}