141 lines
4.9 KiB
TypeScript
141 lines
4.9 KiB
TypeScript
"use client";
|
|
|
|
import {
|
|
Sidebar,
|
|
SidebarHeader,
|
|
SidebarContent,
|
|
SidebarFooter,
|
|
SidebarRail,
|
|
useSidebar,
|
|
} from "@/components/ui/sidebar";
|
|
import { useTheme } from "@/contexts/ThemeContext";
|
|
import { cn } from "@/lib/utils";
|
|
import { usePathname } from "next/navigation";
|
|
|
|
import { GeneralQaSidebar } from "./general-qa-sidebar";
|
|
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,
|
|
forceCollapsed = false,
|
|
className,
|
|
...props
|
|
}: React.ComponentProps<typeof Sidebar> & {
|
|
compactChrome?: boolean;
|
|
forceCollapsed?: boolean;
|
|
}) {
|
|
const { open: isSidebarOpen } = useSidebar();
|
|
const { theme } = useTheme();
|
|
const pathname = usePathname();
|
|
const useWhiteSidebar = compactChrome && theme === "light";
|
|
// 通用问答（全量模式）左栏：新建回答 → 常用智能体 → 聊天记录（需求 0616 #1）。
|
|
// 仅在通用问答（/page/workspace/chats*）下启用三块式布局；点击常用智能体后是
|
|
// 「原地嵌入」（停留在 /chats/new?agent=...，仅右侧问答区换成智能体对话），左侧栏不变。
|
|
const isGeneralQa = pathname.startsWith("/page/workspace/chats");
|
|
|
|
if (forceCollapsed) {
|
|
return (
|
|
<Sidebar
|
|
variant="sidebar"
|
|
collapsible="icon"
|
|
className={cn(
|
|
"bg-sidebar [&_[data-slot=sidebar-inner]]:bg-sidebar",
|
|
className,
|
|
)}
|
|
{...props}
|
|
>
|
|
<SidebarContent>
|
|
<WorkspaceNavChatList />
|
|
</SidebarContent>
|
|
</Sidebar>
|
|
);
|
|
}
|
|
|
|
// 紧凑模式：用「外层定宽容器 + transition-[width]」做展开/收起过渡动画。
|
|
// collapsible="none" 的 Sidebar 是普通 in-flow 定宽块（非 absolute，故不受本布局对
|
|
// sidebar-container 的 absolute/left-0 覆盖影响），外层 overflow-hidden 把它从
|
|
// --sidebar-width 裁到 0、聊天区随宽度平滑回流；收起后整列不接收指针。
|
|
if (compactChrome) {
|
|
return (
|
|
<div
|
|
aria-hidden={!isSidebarOpen}
|
|
className={cn(
|
|
"h-full shrink-0 overflow-hidden transition-[width] duration-200 ease-out",
|
|
isSidebarOpen ? "w-(--sidebar-width)" : "w-0 pointer-events-none",
|
|
)}
|
|
>
|
|
<Sidebar
|
|
variant="sidebar"
|
|
collapsible="none"
|
|
className={cn(
|
|
"h-full w-(--sidebar-width) border-r border-border",
|
|
useWhiteSidebar &&
|
|
"[&_[data-slot=sidebar-inner]]:bg-white [&_[data-slot=sidebar-container]]:bg-white",
|
|
className,
|
|
)}
|
|
{...props}
|
|
>
|
|
<SidebarContent>
|
|
{isGeneralQa ? (
|
|
// 全量版通用问答（/page/workspace/chats*）：新建对话侧栏独立成
|
|
// GeneralQaSidebar（按 0616 样式参考图重画），与其余 workspace 页解耦。
|
|
<GeneralQaSidebar />
|
|
) : (
|
|
<>
|
|
<WorkspaceNavChatList showCollapseTrigger compact />
|
|
<RecentChatList compact />
|
|
</>
|
|
)}
|
|
</SidebarContent>
|
|
<SidebarRail />
|
|
</Sidebar>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<Sidebar
|
|
variant="sidebar"
|
|
// 紧凑模式：展开时为固定宽度整列（none，无内置折叠），收起由上面的条件渲染处理；
|
|
// 非紧凑沿用 icon。
|
|
collapsible={compactChrome ? "none" : "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}
|
|
compact={compactChrome}
|
|
/>
|
|
{isSidebarOpen && <RecentChatList compact={compactChrome} />}
|
|
{/* 「多智能体会商」「最近写作」与「智能体/技能」等菜单项保持一致的显隐：
|
|
仅在非紧凑模式(!compactChrome)下展示，紧凑模式（有外层页面侧栏时）一并隐藏。 */}
|
|
{isSidebarOpen && !compactChrome && <RecentRoundtableList />}
|
|
{isSidebarOpen && !compactChrome && <RecentWritingList />}
|
|
</SidebarContent>
|
|
{!compactChrome && (
|
|
<SidebarFooter>
|
|
<WorkspaceNavMenu />
|
|
</SidebarFooter>
|
|
)}
|
|
<SidebarRail />
|
|
</Sidebar>
|
|
</>
|
|
);
|
|
}
|