deerflow-code/frontend-web/src/components/workspace/workspace-sidebar.tsx

"use client";

import {
  Sidebar,
  SidebarHeader,
  SidebarContent,
  SidebarFooter,
  SidebarRail,
  useSidebar,
} from "@/components/ui/sidebar";
import { useTheme } from "@/contexts/ThemeContext";
import { cn } from "@/lib/utils";

import { RecentChatList } from "./recent-chat-list";
import { RecentRoundtableList } from "./recent-roundtable-list";
import { RecentWritingList } from "./recent-writing-list";
import { WorkspaceHeader } from "./workspace-header";
import { WorkspaceNavChatList } from "./workspace-nav-chat-list";
import { WorkspaceNavMenu } from "./workspace-nav-menu";

export function WorkspaceSidebar({
  compactChrome = false,
  className,
  ...props
}: React.ComponentProps<typeof Sidebar> & { compactChrome?: boolean }) {
  const { open: isSidebarOpen } = useSidebar();
  const { theme } = useTheme();
  const useWhiteSidebar = compactChrome && theme === "light";

  return (
    <>
      <Sidebar
        variant="sidebar"
        collapsible="icon"
        className={cn(
          useWhiteSidebar &&
            "[&_[data-slot=sidebar-inner]]:bg-white [&_[data-slot=sidebar-container]]:bg-white",
          className,
        )}
        {...props}
      >
        {!compactChrome && (
          <SidebarHeader className="py-0">
            <WorkspaceHeader />
          </SidebarHeader>
        )}
        <SidebarContent>
          <WorkspaceNavChatList showCollapseTrigger={compactChrome} />
          {isSidebarOpen && <RecentChatList />}
          {isSidebarOpen && <RecentRoundtableList />}
          {isSidebarOpen && <RecentWritingList />}
        </SidebarContent>
        {!compactChrome && (
          <SidebarFooter>
            <WorkspaceNavMenu />
          </SidebarFooter>
        )}
        <SidebarRail />
      </Sidebar>
    </>
  );
}