@tablestore/tablestore-agent-cli 0.1.8 → 0.2.0

package/dist/dashboard-runtime/dashboard/src/app/(dashboard)/knowledge-base/[name]/layout-client.tsx

@@ -1,13 +1,49 @@
 'use client';
 
 import { Suspense, useState } from "react";
-import { useParams } from "next/navigation";
+import { useParams, useSearchParams } from "next/navigation";
+import {
+  BookOpenText,
+  FileText,
+  MoreVertical,
+  MessagesSquare,
+  Search,
+  Settings,
+  Trash2,
+} from "lucide-react";
+
 import { Skeleton } from "@/components/ui/skeleton";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import { Badge } from "@/components/ui/badge";
+import {
+  DetailLayout,
+  DetailSidebar,
+  DetailSidebarBack,
+  DetailSidebarHeader,
+  DetailSidebarMenu,
+} from "@/components/layout/detail-sidebar";
 import { useKnowledgeBase } from "@/hooks/use-knowledge-base";
-import { KBHeader } from "@/components/knowledge-base/kb-header";
-import { KBTabNav } from "@/components/knowledge-base/kb-tab-nav";
 import { KBDeleteDialog } from "@/components/knowledge-base/kb-delete-dialog";
-import { SubspaceProvider } from "@/contexts/subspace-context";
+import { SubspaceProvider, useSubspaceOptional } from "@/contexts/subspace-context";
+import { SubspaceSwitcher } from "@/components/knowledge-base/subspace-switcher";
+import { RelativeTime } from "@/components/shared/relative-time";
+import type { KnowledgeBase } from "@/types/knowledge-base";
+
+const TABS = [
+  { label: "文档", segment: "documents", icon: <FileText className="h-4 w-4" /> },
+  { label: "检索测试", segment: "retrieval", icon: <Search className="h-4 w-4" /> },
+  {
+    label: "问答测试",
+    segment: "qa",
+    icon: <MessagesSquare className="h-4 w-4" />,
+  },
+  { label: "设置", segment: "settings", icon: <Settings className="h-4 w-4" /> },
+] as const;
 
 export default function KnowledgeBaseDetailLayoutClient({
   children,
@@ -21,58 +57,173 @@ export default function KnowledgeBaseDetailLayoutClient({
 
   if (isLoading) {
     return (
-      <div className="space-y-6">
-        <div className="space-y-3">
+      <DetailLayout
+        sidebar={<DetailSidebarSkeleton />}
+      >
+        <div className="space-y-6">
           <Skeleton className="h-10 w-64" />
-          <Skeleton className="h-4 w-96" />
-          <Skeleton className="h-4 w-48" />
+          <Skeleton className="h-10 w-full" />
+          <Skeleton className="h-64 w-full" />
         </div>
-        <Skeleton className="h-10 w-full" />
-        <Skeleton className="h-64 w-full" />
-      </div>
+      </DetailLayout>
     );
   }
 
   if (!knowledgeBase) {
     return (
-      <div className="flex items-center justify-center py-20 text-muted-foreground">
-        知识库不存在或已被删除
-      </div>
+      <DetailLayout sidebar={<DetailSidebarSkeleton />}>
+        <div className="flex items-center justify-center py-20 text-muted-foreground">
+          知识库不存在或已被删除
+        </div>
+      </DetailLayout>
     );
   }
 
   return (
-    <div>
-      <Suspense
-        fallback={
-          <div className="space-y-6">
-            <div className="space-y-3">
-              <Skeleton className="h-10 w-64" />
-              <Skeleton className="h-4 w-96" />
-              <Skeleton className="h-4 w-48" />
-            </div>
-            <Skeleton className="h-10 w-full" />
-            <Skeleton className="h-[400px] w-full" />
-          </div>
-        }
-      >
-        <SubspaceProvider knowledgeBaseName={knowledgeBaseName}>
-          <div className="space-y-6">
-            <KBHeader
-              knowledgeBase={knowledgeBase}
-              onDelete={() => setShowDeleteDialog(true)}
-            />
-            <KBTabNav knowledgeBaseName={knowledgeBaseName} />
-            <div>{children}</div>
-          </div>
-        </SubspaceProvider>
+    <SubspaceProvider knowledgeBaseName={knowledgeBaseName}>
+      <Suspense fallback={null}>
+        <KBDetailShell
+          knowledgeBase={knowledgeBase}
+          knowledgeBaseName={knowledgeBaseName}
+          onRequestDelete={() => setShowDeleteDialog(true)}
+        >
+          {children}
+        </KBDetailShell>
       </Suspense>
-
       <KBDeleteDialog
         knowledgeBaseName={knowledgeBaseName}
         open={showDeleteDialog}
         onOpenChange={setShowDeleteDialog}
       />
-    </div>
+    </SubspaceProvider>
+  );
+}
+
+function KBDetailShell({
+  knowledgeBase,
+  knowledgeBaseName,
+  onRequestDelete,
+  children,
+}: {
+  knowledgeBase: KnowledgeBase;
+  knowledgeBaseName: string;
+  onRequestDelete: () => void;
+  children: React.ReactNode;
+}) {
+  const searchParams = useSearchParams();
+  const activeSubspace = useSubspaceOptional()?.subspace ?? null;
+
+  // Carry the subspace querystring through to each menu link so
+  // middle-click / copy-link continues to land on the same scope.
+  const params = new URLSearchParams(searchParams.toString());
+  if (activeSubspace) params.set("subspace", activeSubspace);
+  else params.delete("subspace");
+  const qs = params.toString();
+  const querySuffix = qs ? `?${qs}` : "";
+
+  const basePath = `/knowledge-base/${encodeURIComponent(knowledgeBaseName)}`;
+  const items = TABS.map((tab) => ({
+    href: `${basePath}/${tab.segment}${querySuffix}`,
+    label: tab.label,
+    icon: tab.icon,
+  }));
+
+  return (
+    <DetailLayout
+      sidebar={
+        <DetailSidebar>
+          <DetailSidebarHeader
+            icon={<BookOpenText />}
+            accent="primary"
+            name={knowledgeBase.knowledgeBaseName}
+            typeLabel="知识库 · KNOWLEDGE BASE"
+            description={knowledgeBase.description}
+            actions={
+              <DropdownMenu>
+                <DropdownMenuTrigger asChild>
+                  <button
+                    type="button"
+                    aria-label="更多操作"
+                    className="flex h-7 w-7 items-center justify-center rounded-md text-[hsl(var(--muted-foreground))] transition-colors hover:bg-[hsl(var(--background))] hover:text-[hsl(var(--foreground))]"
+                  >
+                    <MoreVertical className="h-4 w-4" />
+                  </button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent align="end">
+                  <DropdownMenuItem
+                    onSelect={(e) => {
+                      e.preventDefault();
+                      onRequestDelete();
+                    }}
+                    className="text-[hsl(var(--destructive))] focus:bg-[hsl(var(--danger-soft))] focus:text-[hsl(var(--destructive))] hover:bg-[hsl(var(--danger-soft))] hover:text-[hsl(var(--destructive))]"
+                  >
+                    <Trash2 className="h-3.5 w-3.5" />
+                    删除知识库
+                  </DropdownMenuItem>
+                </DropdownMenuContent>
+              </DropdownMenu>
+            }
+            extra={
+              <>
+                {knowledgeBase.tags && knowledgeBase.tags.length > 0 ? (
+                  <div className="-mt-0.5 flex flex-wrap gap-1">
+                    {knowledgeBase.tags.map((tag) => (
+                      <Badge
+                        key={tag}
+                        variant="primary"
+                        className="text-[10px]"
+                      >
+                        {tag}
+                      </Badge>
+                    ))}
+                  </div>
+                ) : null}
+                {knowledgeBase.subspace ? (
+                  <div className="space-y-1">
+                    <div className="inline-flex items-center gap-1.5 text-[hsl(var(--success))]">
+                      <span className="h-1.5 w-1.5 rounded-full bg-current" />
+                      子空间隔离已开启
+                    </div>
+                    <SubspaceSwitcher />
+                  </div>
+                ) : null}
+                {knowledgeBase.createdAt ? (
+                  <div>
+                    创建于 <RelativeTime timestamp={knowledgeBase.createdAt} />
+                  </div>
+                ) : null}
+                {knowledgeBase.updatedAt ? (
+                  <div>
+                    更新于 <RelativeTime timestamp={knowledgeBase.updatedAt} />
+                  </div>
+                ) : null}
+              </>
+            }
+          />
+          <DetailSidebarMenu items={items} />
+          <DetailSidebarBack href="/knowledge-base" label="返回列表" />
+        </DetailSidebar>
+      }
+    >
+      {children}
+    </DetailLayout>
+  );
+}
+
+function DetailSidebarSkeleton() {
+  return (
+    <DetailSidebar>
+      <div className="space-y-3 px-4 pt-4 pb-4 border-b border-[hsl(var(--border-light))]">
+        <Skeleton className="h-9 w-9 rounded-lg" />
+        <Skeleton className="h-4 w-3/4" />
+        <Skeleton className="h-3 w-1/2" />
+      </div>
+      <div className="space-y-1 px-2 py-2">
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+      </div>
+    </DetailSidebar>
   );
 }

package/dist/dashboard-runtime/dashboard/src/app/(dashboard)/knowledge-base/[name]/qa/page.tsx

@@ -2,9 +2,11 @@
 
 import { use, useCallback, useState } from "react";
 
+import { WorkbenchLayout } from "@/components/layout/detail-sidebar";
 import { QaChatPanel } from "@/components/qa/qa-chat-panel";
 import { QaForm, type QaFormState } from "@/components/qa/qa-form";
 import { useKnowledgeBase } from "@/hooks/use-knowledge-base";
+import { useActiveInstance } from "@/hooks/use-active-instance";
 import { useQaChat } from "@/hooks/use-qa-chat";
 import { findUserAnchorAbove } from "@/lib/chat-message-ops";
 
@@ -16,10 +18,12 @@ export default function QaPlaygroundPage({ params }: PageProps) {
   const { name: rawName } = use(params);
   const knowledgeBaseName = decodeURIComponent(rawName);
   const { data: knowledgeBase } = useKnowledgeBase(knowledgeBaseName);
+  const activeInstanceState = useActiveInstance();
 
   const [formState, setFormState] = useState<QaFormState | null>(null);
 
   const chat = useQaChat({
+    activeInstance: activeInstanceState.activeInstance,
     providerId: formState?.providerId ?? "",
     model: formState?.model ?? "",
     systemPrompt: formState?.systemPrompt ?? "",
@@ -27,7 +31,8 @@ export default function QaPlaygroundPage({ params }: PageProps) {
     rag: formState?.rag,
   });
 
-  const canSend = Boolean(formState?.providerId && formState?.model);
+  const canSend =
+    activeInstanceState.ready && Boolean(formState?.providerId && formState?.model);
 
   const handleEditSave = useCallback(
     (userId: string, nextContent: string) => {
@@ -47,8 +52,8 @@ export default function QaPlaygroundPage({ params }: PageProps) {
   );
 
   return (
-    <div className="grid gap-6 lg:grid-cols-[360px_1fr]">
-      <aside className="lg:sticky lg:top-20 lg:max-h-[calc(100vh-6rem)] lg:overflow-y-auto">
+    <WorkbenchLayout
+      aside={
         <QaForm
           knowledgeBaseName={knowledgeBaseName}
           knowledgeBase={knowledgeBase}
@@ -56,22 +61,20 @@ export default function QaPlaygroundPage({ params }: PageProps) {
           onClearConversation={chat.clear}
           disabled={chat.isStreaming}
         />
-      </aside>
-
-      <section className="min-h-[640px]">
-        <QaChatPanel
-          messages={chat.messages}
-          isStreaming={chat.isStreaming}
-          canSend={canSend}
-          error={chat.error}
-          onSend={chat.send}
-          onStop={chat.stop}
-          onDelete={chat.deleteMessage}
-          onResend={chat.reissueTurn}
-          onRegenerate={handleRegenerate}
-          onEditSave={handleEditSave}
-        />
-      </section>
-    </div>
+      }
+    >
+      <QaChatPanel
+        messages={chat.messages}
+        isStreaming={chat.isStreaming}
+        canSend={canSend}
+        error={chat.error}
+        onSend={chat.send}
+        onStop={chat.stop}
+        onDelete={chat.deleteMessage}
+        onResend={chat.reissueTurn}
+        onRegenerate={handleRegenerate}
+        onEditSave={handleEditSave}
+      />
+    </WorkbenchLayout>
   );
 }

package/dist/dashboard-runtime/dashboard/src/app/(dashboard)/knowledge-base/[name]/retrieval/retrieval-client.tsx

@@ -4,6 +4,7 @@ import { useState, useCallback } from "react";
 import { useParams } from "next/navigation";
 import { toast } from "sonner";
 import { Skeleton } from "@/components/ui/skeleton";
+import { WorkbenchLayout } from "@/components/layout/detail-sidebar";
 import { useKnowledgeBase } from "@/hooks/use-knowledge-base";
 import { useRetrieve } from "@/hooks/use-retrieve";
 import { RetrievalForm } from "@/components/retrieval/retrieval-form";
@@ -48,20 +49,20 @@ export default function RetrievalClient() {
   }
 
   return (
-    <div className="grid gap-6 lg:grid-cols-[400px_1fr]">
-      <div className="space-y-4">
-        <h3 className="text-lg font-semibold">检索测试</h3>
+    <WorkbenchLayout
+      asideWidth={400}
+      aside={
         <RetrievalForm
           knowledgeBaseName={knowledgeBaseName}
           knowledgeBase={knowledgeBase ?? undefined}
           onSubmit={handleSubmit}
           isLoading={retrieve.isPending}
         />
-      </div>
-
-      <div>
+      }
+    >
+      <div className="min-h-0 flex-1 overflow-y-auto px-7 py-5 max-md:px-4">
         <RetrievalResults results={results} elapsedMs={elapsedMs} />
       </div>
-    </div>
+    </WorkbenchLayout>
   );
 }

package/dist/dashboard-runtime/dashboard/src/app/(dashboard)/layout.tsx

@@ -0,0 +1,68 @@
+import { redirect } from 'next/navigation';
+
+import { listInstances } from '@tablestore/tablestore-agent-shared';
+
+import { Sidebar } from '@/components/layout/sidebar';
+import { SidebarMobile } from '@/components/layout/sidebar-mobile';
+import { SidebarOffset } from '@/components/layout/sidebar-offset';
+
+// The layout reads runtime state (TOML config, env vars) to decide whether
+// to redirect to onboarding. Must opt out of static rendering so the check
+// runs on every request rather than being cached from build time.
+export const dynamic = "force-dynamic";
+
+/**
+ * Whether any credential source (env vars, legacy [default] TOML section, or
+ * a named instance) exists. When nothing is configured we redirect to the
+ * onboarding flow so first-time users see the welcome card instead of a
+ * broken dashboard.
+ */
+function hasUsableCredentials(): boolean {
+  const envConfigured =
+    !!process.env.TABLESTORE_ACCESS_KEY_ID &&
+    !!process.env.TABLESTORE_ACCESS_KEY_SECRET &&
+    !!process.env.TABLESTORE_ENDPOINT &&
+    !!process.env.TABLESTORE_INSTANCE_NAME;
+  if (envConfigured) return true;
+
+  try {
+    const rows = listInstances();
+    // Named instances or the legacy [default] section both count.
+    return rows.length > 0;
+  } catch {
+    return false;
+  }
+}
+
+export default function DashboardLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  if (!hasUsableCredentials()) {
+    redirect('/onboarding');
+  }
+
+  return (
+    <div className="min-h-screen bg-[hsl(var(--background))]">
+      {/*
+        Skip-to-content link: visually hidden until focused. Keyboard users
+        can press Tab once on the page to jump straight to the main region,
+        bypassing the sidebar / breadcrumb on every navigation.
+      */}
+      <a
+        href="#main-content"
+        className="sr-only focus:not-sr-only focus:fixed focus:left-4 focus:top-4 focus:z-50 focus:rounded-md focus:bg-primary focus:px-3 focus:py-2 focus:text-sm focus:font-medium focus:text-primary-foreground focus:shadow-md"
+      >
+        跳转到主内容
+      </a>
+      <Sidebar />
+      <SidebarMobile />
+      <SidebarOffset>
+        <main id="main-content" className="min-h-screen px-7 py-5 max-md:px-4">
+          {children}
+        </main>
+      </SidebarOffset>
+    </div>
+  );
+}

package/dist/dashboard-runtime/dashboard/src/app/(dashboard)/loading.tsx

@@ -0,0 +1,26 @@
+import { Skeleton } from "@/components/ui/skeleton";
+
+/**
+ * Route-segment loading UI rendered automatically by Next.js whenever a
+ * dashboard page (or any nested server component) is suspended. Avoids
+ * the previous "blank main area" flicker between sidebar nav clicks.
+ *
+ * Kept intentionally generic — page-level skeletons (memory list,
+ * llm-providers cards, etc.) still apply once the route has resolved
+ * and its own client component starts fetching.
+ */
+export default function DashboardLoading() {
+  return (
+    <div className="space-y-6" aria-busy="true" aria-live="polite">
+      <div className="space-y-2">
+        <Skeleton className="h-8 w-48" />
+        <Skeleton className="h-4 w-72" />
+      </div>
+      <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
+        {Array.from({ length: 6 }).map((_, idx) => (
+          <Skeleton key={idx} className="h-[160px] rounded-lg" />
+        ))}
+      </div>
+    </div>
+  );
+}

package/dist/dashboard-runtime/dashboard/src/app/(dashboard)/memory/[store]/layout.tsx

@@ -0,0 +1,168 @@
+'use client';
+
+import { useParams, useSearchParams } from "next/navigation";
+import { useState } from "react";
+import {
+  Brain,
+  Database,
+  FileClock,
+  MessageSquare,
+  MoreVertical,
+  Search,
+  Settings,
+  Trash2,
+} from "lucide-react";
+
+import { Skeleton } from "@/components/ui/skeleton";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+import {
+  DetailLayout,
+  DetailSidebar,
+  DetailSidebarBack,
+  DetailSidebarHeader,
+  DetailSidebarMenu,
+} from "@/components/layout/detail-sidebar";
+import { useMemoryStore } from "@/hooks/use-memory-store";
+import { MemoryDeleteDialog } from "@/components/memory/memory-delete-dialog";
+import { MemoryScopeBar } from "@/components/memory/memory-scope-bar";
+
+const TABS = [
+  { label: "长期记忆", segment: "units", icon: <Database className="h-4 w-4" /> },
+  { label: "记忆检索", segment: "search", icon: <Search className="h-4 w-4" /> },
+  {
+    label: "短期记忆",
+    segment: "messages",
+    icon: <MessageSquare className="h-4 w-4" />,
+  },
+  {
+    label: "请求审计",
+    segment: "requests",
+    icon: <FileClock className="h-4 w-4" />,
+  },
+  { label: "设置", segment: "settings", icon: <Settings className="h-4 w-4" /> },
+] as const;
+
+export default function MemoryDetailLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  const params = useParams<{ store: string }>();
+  const memoryStoreName = decodeURIComponent(params.store);
+  const searchParams = useSearchParams();
+  const { data: memoryStore, isLoading } = useMemoryStore(memoryStoreName);
+  const [showDeleteDialog, setShowDeleteDialog] = useState(false);
+
+  const querySuffix = searchParams.toString()
+    ? `?${searchParams.toString()}`
+    : "";
+  const basePath = `/memory/${encodeURIComponent(memoryStoreName)}`;
+  const items = TABS.map((tab) => ({
+    href: `${basePath}/${tab.segment}${querySuffix}`,
+    label: tab.label,
+    icon: tab.icon,
+  }));
+
+  if (isLoading) {
+    return (
+      <DetailLayout sidebar={<MemoryDetailSidebarSkeleton />}>
+        <div className="space-y-6">
+          <Skeleton className="h-10 w-64" />
+          <Skeleton className="h-28 w-full" />
+          <Skeleton className="h-64 w-full" />
+        </div>
+      </DetailLayout>
+    );
+  }
+
+  if (!memoryStore) {
+    return (
+      <DetailLayout sidebar={<MemoryDetailSidebarSkeleton />}>
+        <div className="flex items-center justify-center py-20 text-muted-foreground">
+          记忆库不存在或已被删除
+        </div>
+      </DetailLayout>
+    );
+  }
+
+  return (
+    <>
+      <DetailLayout
+        sidebar={
+          <DetailSidebar>
+            <DetailSidebarHeader
+              icon={<Brain />}
+              accent="purple"
+              name={memoryStore.memoryStoreName}
+              typeLabel="记忆库 · MEMORY STORE"
+              description={memoryStore.description}
+              actions={
+                <DropdownMenu>
+                  <DropdownMenuTrigger asChild>
+                    <button
+                      type="button"
+                      aria-label="更多操作"
+                      className="flex h-7 w-7 items-center justify-center rounded-md text-[hsl(var(--muted-foreground))] transition-colors hover:bg-[hsl(var(--background))] hover:text-[hsl(var(--foreground))]"
+                    >
+                      <MoreVertical className="h-4 w-4" />
+                    </button>
+                  </DropdownMenuTrigger>
+                  <DropdownMenuContent align="end">
+                    <DropdownMenuItem
+                      onSelect={(e) => {
+                        e.preventDefault();
+                        setShowDeleteDialog(true);
+                      }}
+                      className="text-[hsl(var(--destructive))] focus:bg-[hsl(var(--danger-soft))] focus:text-[hsl(var(--destructive))] hover:bg-[hsl(var(--danger-soft))] hover:text-[hsl(var(--destructive))]"
+                    >
+                      <Trash2 className="h-3.5 w-3.5" />
+                      删除记忆库
+                    </DropdownMenuItem>
+                  </DropdownMenuContent>
+                </DropdownMenu>
+              }
+            />
+            <DetailSidebarMenu items={items} />
+            <DetailSidebarBack href="/memory" label="返回列表" />
+          </DetailSidebar>
+        }
+      >
+        <div className="space-y-6">
+          <MemoryScopeBar />
+          <div>{children}</div>
+        </div>
+      </DetailLayout>
+
+      <MemoryDeleteDialog
+        memoryStoreName={memoryStoreName}
+        open={showDeleteDialog}
+        onOpenChange={setShowDeleteDialog}
+        redirectToList
+      />
+    </>
+  );
+}
+
+function MemoryDetailSidebarSkeleton() {
+  return (
+    <DetailSidebar>
+      <div className="space-y-3 px-4 pt-4 pb-4 border-b border-[hsl(var(--border-light))]">
+        <Skeleton className="h-9 w-9 rounded-lg" />
+        <Skeleton className="h-4 w-3/4" />
+        <Skeleton className="h-3 w-1/2" />
+      </div>
+      <div className="space-y-1 px-2 py-2">
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+        <Skeleton className="h-8 w-full" />
+      </div>
+    </DetailSidebar>
+  );
+}