@tablestore/tablestore-agent-cli 0.2.0 → 0.2.1

package/dist/dashboard-runtime/dashboard/src/components/knowledge-base/kb-settings-form.tsx

@@ -33,6 +33,8 @@ import {
   TableRow,
 } from "@/components/ui/table";
 import { TagInput } from "@/components/shared/tag-input";
+import { RetrievalResultCountField } from "./retrieval-result-count-field";
+import { buildKnowledgeBaseRetrievalConfiguration } from "./knowledge-base-retrieval-config";
 import { useUpdateKB } from "@/hooks/use-update-kb";
 import { updateKBSchema, type UpdateKBInput } from "@/schemas/knowledge-base";
 import type { KnowledgeBase } from "@/types/knowledge-base";
@@ -52,9 +54,19 @@ export function KBSettingsForm({ knowledgeBase }: KBSettingsFormProps) {
       tags: knowledgeBase.tags ?? [],
       retrievalConfiguration: {
         searchType: knowledgeBase.retrievalConfiguration?.searchType ?? ["DENSE_VECTOR"],
+        denseVectorSearchConfiguration:
+          knowledgeBase.retrievalConfiguration?.denseVectorSearchConfiguration ?? {
+            numberOfResults:
+              knowledgeBase.retrievalConfiguration?.rerankingConfiguration?.numberOfResults ?? 20,
+          },
+        fullTextSearchConfiguration:
+          knowledgeBase.retrievalConfiguration?.fullTextSearchConfiguration ?? {
+            numberOfResults:
+              knowledgeBase.retrievalConfiguration?.rerankingConfiguration?.numberOfResults ?? 20,
+          },
         rerankingConfiguration: {
           type: knowledgeBase.retrievalConfiguration?.rerankingConfiguration?.type ?? "RRF",
-          numberOfResults: knowledgeBase.retrievalConfiguration?.rerankingConfiguration?.numberOfResults ?? 5,
+          numberOfResults: knowledgeBase.retrievalConfiguration?.rerankingConfiguration?.numberOfResults ?? 20,
           rrfConfiguration: knowledgeBase.retrievalConfiguration?.rerankingConfiguration?.rrfConfiguration ?? {
             denseVectorSearchWeight: 0.6,
             fullTextSearchWeight: 0.4,
@@ -88,16 +100,7 @@ export function KBSettingsForm({ knowledgeBase }: KBSettingsFormProps) {
       const request: Parameters<typeof updateKB.mutateAsync>[0] = {
         ...values,
         retrievalConfiguration: values.retrievalConfiguration
-          ? {
-              ...values.retrievalConfiguration,
-              rerankingConfiguration: values.retrievalConfiguration.rerankingConfiguration
-                ? {
-                    ...values.retrievalConfiguration.rerankingConfiguration,
-                    numberOfResults:
-                      values.retrievalConfiguration.rerankingConfiguration.numberOfResults ?? 5,
-                  }
-                : undefined,
-            }
+          ? buildKnowledgeBaseRetrievalConfiguration(values.retrievalConfiguration)
           : undefined,
       };
       await updateKB.mutateAsync(request);
@@ -113,12 +116,14 @@ export function KBSettingsForm({ knowledgeBase }: KBSettingsFormProps) {
   const metadataFields = knowledgeBase.metadata ?? [];
 
   return (
-    <div className="space-y-8">
-      {/* 基本信息 - 可编辑 */}
-      <section className="space-y-4">
-        <h3 className="text-lg font-semibold">基本信息</h3>
-        <Form {...form}>
-          <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-4">
+    <div className="grid gap-6 xl:grid-cols-[minmax(0,1fr)_320px]">
+      <Form {...form}>
+        <form onSubmit={form.handleSubmit(onSubmit)} className="space-y-6">
+          <section className="rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-5 shadow-sm">
+            <SettingsSectionHeader
+              title="基本信息"
+              description="调整知识库说明和标签，帮助团队快速识别用途。"
+            />
             <FormField
               control={form.control}
               name="description"
@@ -156,10 +161,14 @@ export function KBSettingsForm({ knowledgeBase }: KBSettingsFormProps) {
               )}
             />
 
-            {/* 检索配置 - 可编辑 */}
-            <div className="space-y-4 pt-4 border-t border-[hsl(var(--border))]">
-              <h4 className="text-sm font-medium">检索配置</h4>
+          </section>
 
+          <section className="rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-5 shadow-sm">
+            <SettingsSectionHeader
+              title="检索配置"
+              description="控制默认召回方式、返回规模和 Rerank 策略。"
+            />
+            <div className="space-y-4">
               <FormField
                 control={form.control}
                 name="retrievalConfiguration.searchType"
@@ -195,6 +204,50 @@ export function KBSettingsForm({ knowledgeBase }: KBSettingsFormProps) {
                 )}
               />
 
+              <div className="space-y-3">
+                <div className="space-y-1">
+                  <p className="text-sm font-medium text-[hsl(var(--foreground))]">
+                    返回数量
+                  </p>
+                  <p className="text-xs text-[hsl(var(--muted-foreground))]">
+                    控制每路召回参与排序的候选数，以及 Rerank 后实际返回的片段数。
+                  </p>
+                </div>
+                <div className="grid grid-cols-[repeat(auto-fit,minmax(min(260px,100%),1fr))] gap-3">
+                  <RetrievalResultCountField
+                    control={form.control}
+                    name="retrievalConfiguration.denseVectorSearchConfiguration.numberOfResults"
+                    label="向量召回数"
+                    description="向量检索参与后续排序的候选片段数。"
+                    max={100}
+                    muted={
+                      !form
+                        .watch("retrievalConfiguration.searchType")
+                        ?.includes("DENSE_VECTOR")
+                    }
+                  />
+                  <RetrievalResultCountField
+                    control={form.control}
+                    name="retrievalConfiguration.fullTextSearchConfiguration.numberOfResults"
+                    label="全文召回数"
+                    description="全文检索参与后续排序的候选片段数。"
+                    max={100}
+                    muted={
+                      !form
+                        .watch("retrievalConfiguration.searchType")
+                        ?.includes("FULL_TEXT")
+                    }
+                  />
+                </div>
+                <RetrievalResultCountField
+                  control={form.control}
+                  name="retrievalConfiguration.rerankingConfiguration.numberOfResults"
+                  label="重排序返回数"
+                  description="Rerank 后保留并返回的片段数。"
+                  max={200}
+                />
+              </div>
+
               <FormField
                 control={form.control}
                 name="retrievalConfiguration.rerankingConfiguration.type"
@@ -405,74 +458,97 @@ export function KBSettingsForm({ knowledgeBase }: KBSettingsFormProps) {
               </div>
             </div>
 
-            <div className="flex justify-end pt-2">
+            <div className="flex justify-end border-t border-[hsl(var(--border-light))] pt-4">
               <Button type="submit" disabled={updateKB.isPending}>
                 {updateKB.isPending ? "保存中..." : "保存更改"}
               </Button>
             </div>
-          </form>
-        </Form>
-      </section>
+          </section>
+        </form>
+      </Form>
 
-      {/* Embedding 配置 - 只读 */}
-      <section className="space-y-4">
-        <h3 className="text-lg font-semibold">Embedding 配置</h3>
-        <div className="rounded-lg border border-[hsl(var(--border))] p-4 space-y-3 bg-[hsl(var(--muted))]/30">
-          <ReadOnlyField
-            label="提供方"
-            value={embeddingConfig?.provider === "bailian" ? "百炼 (Bailian)" : "自定义 (Custom)"}
-          />
-          <ReadOnlyField label="模型" value={embeddingConfig?.model ?? "—"} />
-          <ReadOnlyField
-            label="维度"
-            value={embeddingConfig?.dimension?.toString() ?? "—"}
+      <aside className="space-y-6">
+        {/* Embedding 配置 - 只读 */}
+        <section className="rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-5 shadow-sm">
+          <SettingsSectionHeader
+            title="Embedding 配置"
+            description="创建后不可修改"
           />
-          {embeddingConfig?.provider === "custom" && embeddingConfig?.url && (
-            <ReadOnlyField label="API URL" value={embeddingConfig.url} />
-          )}
-        </div>
-        <p className="text-xs text-muted-foreground">
-          Embedding 配置在创建后不可修改
-        </p>
-      </section>
+          <div className="space-y-3">
+            <ReadOnlyField
+              label="提供方"
+              value={embeddingConfig?.provider === "bailian" ? "百炼 (Bailian)" : "自定义 (Custom)"}
+            />
+            <ReadOnlyField label="模型" value={embeddingConfig?.model ?? "—"} />
+            <ReadOnlyField
+              label="维度"
+              value={embeddingConfig?.dimension?.toString() ?? "—"}
+            />
+            {embeddingConfig?.provider === "custom" && embeddingConfig?.url && (
+              <ReadOnlyField label="API URL" value={embeddingConfig.url} />
+            )}
+          </div>
+        </section>
 
-      {/* Metadata Schema - 只读 */}
-      <section className="space-y-4">
-        <h3 className="text-lg font-semibold">Metadata Schema</h3>
-        {metadataFields.length > 0 ? (
-          <div className="rounded-lg border">
-            <Table>
-              <TableHeader>
-                <TableRow>
-                  <TableHead>字段名</TableHead>
-                  <TableHead>类型</TableHead>
-                </TableRow>
-              </TableHeader>
-              <TableBody>
-                {metadataFields.map((field) => (
-                  <TableRow key={field.name}>
-                    <TableCell className="font-mono text-sm">
-                      {field.name}
-                    </TableCell>
-                    <TableCell className="text-sm text-muted-foreground">
-                      {field.type}
-                    </TableCell>
+        {/* Metadata Schema - 只读 */}
+        <section className="rounded-lg border border-[hsl(var(--border))] bg-[hsl(var(--card))] p-5 shadow-sm">
+          <SettingsSectionHeader
+            title="Metadata Schema"
+            description="创建后不可修改"
+          />
+          {metadataFields.length > 0 ? (
+            <div className="overflow-hidden rounded-md border border-[hsl(var(--border-light))]">
+              <Table>
+                <TableHeader>
+                  <TableRow>
+                    <TableHead>字段名</TableHead>
+                    <TableHead>类型</TableHead>
                   </TableRow>
-                ))}
-              </TableBody>
-            </Table>
-          </div>
-        ) : (
-          <p className="text-sm text-muted-foreground">未定义 Metadata Schema</p>
-        )}
-        <p className="text-xs text-muted-foreground">
-          Metadata Schema 在创建后不可修改
-        </p>
-      </section>
+                </TableHeader>
+                <TableBody>
+                  {metadataFields.map((field) => (
+                    <TableRow key={field.name}>
+                      <TableCell className="font-mono text-sm">
+                        {field.name}
+                      </TableCell>
+                      <TableCell className="text-sm text-muted-foreground">
+                        {field.type}
+                      </TableCell>
+                    </TableRow>
+                  ))}
+                </TableBody>
+              </Table>
+            </div>
+          ) : (
+            <p className="rounded-md bg-[hsl(var(--muted)/0.35)] px-3 py-2 text-sm text-muted-foreground">
+              未定义 Metadata Schema
+            </p>
+          )}
+        </section>
+      </aside>
     </div>
   );
 }
 
+function SettingsSectionHeader({
+  title,
+  description,
+}: {
+  title: string;
+  description: string;
+}) {
+  return (
+    <header className="mb-4 border-b border-[hsl(var(--border-light))] pb-3">
+      <h3 className="text-[15px] font-semibold leading-tight text-[hsl(var(--foreground))]">
+        {title}
+      </h3>
+      <p className="mt-1 text-xs leading-relaxed text-[hsl(var(--muted-foreground))]">
+        {description}
+      </p>
+    </header>
+  );
+}
+
 function ReadOnlyField({ label, value }: { label: string; value: string }) {
   return (
     <div className="flex items-center justify-between">

package/dist/dashboard-runtime/dashboard/src/components/knowledge-base/knowledge-base-retrieval-config.ts

@@ -0,0 +1,110 @@
+import type {
+  RetrievalConfig,
+  RerankType,
+  SearchType,
+} from "@/types/knowledge-base";
+
+export interface KnowledgeBaseRetrievalConfigInput {
+  searchType?: SearchType[];
+  denseTopK?: number;
+  fullTextTopK?: number;
+  rerankTopK?: number;
+  rerankType?: RerankType;
+  rrfK?: number;
+  rrfDenseWeight?: number;
+  rrfFullTextWeight?: number;
+  weightDense?: number;
+  weightFullText?: number;
+  modelProvider?: string;
+  modelName?: string;
+  denseVectorSearchConfiguration?: { numberOfResults?: number };
+  fullTextSearchConfiguration?: { numberOfResults?: number };
+  rerankingConfiguration?: {
+    type?: RerankType;
+    numberOfResults?: number;
+    rrfConfiguration?: {
+      denseVectorSearchWeight?: number;
+      fullTextSearchWeight?: number;
+      k?: number;
+    };
+    weightConfiguration?: {
+      denseVectorSearchWeight?: number;
+      fullTextSearchWeight?: number;
+    };
+    modelConfiguration?: {
+      provider?: string;
+      model?: string;
+    };
+  };
+}
+
+export function buildKnowledgeBaseRetrievalConfiguration(
+  input: KnowledgeBaseRetrievalConfigInput | undefined,
+): RetrievalConfig | undefined {
+  if (!input) return undefined;
+
+  const rerank = input.rerankingConfiguration;
+  const rerankType = input.rerankType ?? rerank?.type;
+  const config: RetrievalConfig = {
+    searchType: input.searchType ?? [],
+  };
+
+  const denseTopK =
+    input.denseTopK ?? input.denseVectorSearchConfiguration?.numberOfResults;
+  const fullTextTopK =
+    input.fullTextTopK ?? input.fullTextSearchConfiguration?.numberOfResults;
+  const rerankTopK = input.rerankTopK ?? rerank?.numberOfResults;
+
+  if (denseTopK !== undefined) {
+    config.denseVectorSearchConfiguration = { numberOfResults: denseTopK };
+  }
+  if (fullTextTopK !== undefined) {
+    config.fullTextSearchConfiguration = { numberOfResults: fullTextTopK };
+  }
+
+  if (rerankType) {
+    const reranking: NonNullable<RetrievalConfig["rerankingConfiguration"]> = {
+      type: rerankType,
+    };
+    if (rerankTopK !== undefined) reranking.numberOfResults = rerankTopK;
+
+    if (rerankType === "RRF") {
+      reranking.rrfConfiguration = {
+        denseVectorSearchWeight:
+          input.rrfDenseWeight ??
+          rerank?.rrfConfiguration?.denseVectorSearchWeight ??
+          0,
+        fullTextSearchWeight:
+          input.rrfFullTextWeight ??
+          rerank?.rrfConfiguration?.fullTextSearchWeight ??
+          0,
+        k: input.rrfK ?? rerank?.rrfConfiguration?.k ?? 60,
+      };
+    } else if (rerankType === "WEIGHT") {
+      reranking.weightConfiguration = {
+        denseVectorSearchWeight:
+          input.weightDense ??
+          rerank?.weightConfiguration?.denseVectorSearchWeight ??
+          0,
+        fullTextSearchWeight:
+          input.weightFullText ??
+          rerank?.weightConfiguration?.fullTextSearchWeight ??
+          0,
+      };
+    } else if (rerankType === "MODEL") {
+      reranking.modelConfiguration = {
+        provider:
+          input.modelProvider ??
+          rerank?.modelConfiguration?.provider ??
+          "bailian",
+        model:
+          input.modelName ??
+          rerank?.modelConfiguration?.model ??
+          "gte-rerank-v2",
+      };
+    }
+    config.rerankingConfiguration = reranking;
+  }
+
+  return config;
+}

package/dist/dashboard-runtime/dashboard/src/components/knowledge-base/retrieval-result-count-field.tsx

@@ -0,0 +1,106 @@
+'use client';
+
+import type { Control, FieldPath, FieldValues } from "react-hook-form";
+import { ListOrdered } from "lucide-react";
+
+import { cn } from "@/lib/utils";
+import {
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+} from "@/components/ui/form";
+import { Input } from "@/components/ui/input";
+import {
+  RETRIEVAL_RESULT_COUNT_MIN,
+  parseRetrievalResultCountInput,
+} from "./retrieval-result-count";
+
+interface RetrievalResultCountFieldProps<TFieldValues extends FieldValues> {
+  control: Control<TFieldValues>;
+  name: FieldPath<TFieldValues>;
+  label?: string;
+  description?: string;
+  min?: number;
+  max?: number;
+  muted?: boolean;
+  className?: string;
+}
+
+export function RetrievalResultCountField<TFieldValues extends FieldValues>({
+  control,
+  name,
+  label = "返回片段数",
+  description = "单次检索返回的最多片段数，Rerank 后取前 N 条。",
+  min = RETRIEVAL_RESULT_COUNT_MIN,
+  max,
+  muted = false,
+  className,
+}: RetrievalResultCountFieldProps<TFieldValues>) {
+  return (
+    <FormField
+      control={control}
+      name={name}
+      render={({ field }) => {
+        const inputValue =
+          typeof field.value === "number" && Number.isFinite(field.value)
+            ? String(field.value)
+            : "";
+
+        return (
+          <FormItem
+            className={cn(
+              "mb-0 rounded-md border border-[hsl(var(--border)/0.6)] bg-[hsl(var(--card)/0.72)] p-3 shadow-[0_1px_2px_hsl(var(--foreground)/0.04)]",
+              muted && "opacity-65",
+              className,
+            )}
+          >
+            <div className="grid gap-3 sm:grid-cols-[minmax(0,1fr)_auto] sm:items-center">
+              <div className="flex min-w-0 gap-3">
+                <span className="mt-0.5 flex h-7 w-7 shrink-0 items-center justify-center rounded-md bg-[hsl(var(--primary)/0.08)] text-[hsl(var(--primary))]">
+                  <ListOrdered className="h-3.5 w-3.5" />
+                </span>
+                <div className="min-w-0 space-y-1">
+                  <FormLabel className="text-sm font-medium">
+                    {label}
+                  </FormLabel>
+                  <p className="text-xs leading-relaxed text-[hsl(var(--muted-foreground))]">
+                    {description}
+                  </p>
+                </div>
+              </div>
+
+              <div className="relative w-28 shrink-0">
+                <FormControl>
+                  <Input
+                    ref={field.ref}
+                    name={field.name}
+                    type="number"
+                    inputMode="numeric"
+                    min={min}
+                    max={max}
+                    aria-label={label}
+                    className="h-9 w-full bg-[hsl(var(--background))] pr-8 text-right font-mono text-sm tabular-nums shadow-sm [appearance:textfield] [&::-webkit-inner-spin-button]:appearance-none [&::-webkit-outer-spin-button]:appearance-none"
+                    value={inputValue}
+                    onBlur={field.onBlur}
+                    onChange={(event) =>
+                      field.onChange(
+                        parseRetrievalResultCountInput(event.target.value),
+                      )
+                    }
+                  />
+                </FormControl>
+                <span className="pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-xs text-[hsl(var(--muted-foreground))]">
+                  条
+                </span>
+              </div>
+            </div>
+
+            <FormMessage className="pt-1" />
+          </FormItem>
+        );
+      }}
+    />
+  );
+}

package/dist/dashboard-runtime/dashboard/src/components/knowledge-base/retrieval-result-count.ts

@@ -0,0 +1,11 @@
+export const RETRIEVAL_RESULT_COUNT_MIN = 0;
+
+export function parseRetrievalResultCountInput(
+  value: string,
+): number | undefined {
+  const trimmed = value.trim();
+  if (!trimmed) return undefined;
+
+  const parsed = Number(trimmed);
+  return Number.isFinite(parsed) ? parsed : undefined;
+}

package/dist/dashboard-runtime/dashboard/src/components/layout/detail-sidebar.tsx

@@ -3,11 +3,18 @@
 import * as React from "react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
-import { ArrowLeft } from "lucide-react";
+import { ArrowLeft, PanelLeftClose, PanelLeft } from "lucide-react";
 import { cva, type VariantProps } from "class-variance-authority";
 
 import { cn } from "@/lib/utils";
 import { useSidebarCollapsed } from "@/hooks/use-sidebar-collapsed";
+import { useDetailSidebarCollapsed } from "@/hooks/use-detail-sidebar-collapsed";
+import {
+  Tooltip,
+  TooltipContent,
+  TooltipProvider,
+  TooltipTrigger,
+} from "@/components/ui/tooltip";
 
 /**
  * webUI-style "detail-page" secondary sidebar. Pairs with the primary
@@ -26,6 +33,12 @@ export function DetailSidebar({
   className?: string;
   children: React.ReactNode;
 }) {
+  const { collapsed } = useDetailSidebarCollapsed();
+  // When collapsed, render nothing — the parent `DetailLayout` renders a
+  // `DetailSidebarRestoreButton` so the user can bring the sidebar back.
+  // Returning null (rather than a zero-width aside) keeps the flex math
+  // simple: the right pane just fills the row.
+  if (collapsed) return null;
   return (
     <aside
       className={cn(
@@ -44,6 +57,35 @@ export function DetailSidebar({
   );
 }
 
+/**
+ * Floating "open detail sidebar" button shown in the right pane when the
+ * detail sidebar is collapsed. Anchored to the top-left of the content
+ * area so it lands roughly where the sidebar's header would have been —
+ * matching VSCode's restore-from-collapsed pattern.
+ */
+function DetailSidebarRestoreButton() {
+  const { toggle } = useDetailSidebarCollapsed();
+  return (
+    <TooltipProvider delayDuration={200}>
+      <Tooltip>
+        <TooltipTrigger asChild>
+          <button
+            type="button"
+            aria-label="展开侧边栏"
+            onClick={toggle}
+            className="hidden md:flex absolute left-3 top-3 z-10 h-8 w-8 items-center justify-center rounded-md border border-[hsl(var(--border))] bg-[hsl(var(--card))] text-[hsl(var(--muted-foreground))] shadow-sm transition-colors hover:bg-[hsl(var(--accent))] hover:text-[hsl(var(--foreground))]"
+          >
+            <PanelLeft className="h-4 w-4" />
+          </button>
+        </TooltipTrigger>
+        <TooltipContent side="right" sideOffset={6}>
+          展开侧边栏
+        </TooltipContent>
+      </Tooltip>
+    </TooltipProvider>
+  );
+}
+
 const detailIconAccent = cva(
   "flex h-9 w-9 items-center justify-center rounded-lg [&>svg]:h-[18px] [&>svg]:w-[18px]",
   {
@@ -83,11 +125,38 @@ export function DetailSidebarHeader({
   actions,
   extra,
 }: DetailSidebarHeaderProps) {
+  const { toggle } = useDetailSidebarCollapsed();
   return (
     <header className="flex flex-col gap-2 border-b border-[hsl(var(--border-light))] px-4 pb-4 pt-4">
       <div className="flex items-start justify-between gap-2">
         <div className={detailIconAccent({ accent })}>{icon}</div>
-        {actions ? <div className="-mt-1 -mr-1">{actions}</div> : null}
+        {/*
+          Right-side controls: any consumer-supplied actions (delete, etc.)
+          plus a built-in "collapse sidebar" button. The collapse button is
+          baked in so every detail page gets it for free; it sits to the
+          right of consumer actions so it always lands at the far edge —
+          the visual anchor users learn to reach for.
+        */}
+        <div className="-mt-1 -mr-1 flex items-center gap-0.5">
+          {actions}
+          <TooltipProvider delayDuration={200}>
+            <Tooltip>
+              <TooltipTrigger asChild>
+                <button
+                  type="button"
+                  aria-label="收起侧边栏"
+                  onClick={toggle}
+                  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))]"
+                >
+                  <PanelLeftClose className="h-4 w-4" />
+                </button>
+              </TooltipTrigger>
+              <TooltipContent side="bottom" sideOffset={6}>
+                收起侧边栏
+              </TooltipContent>
+            </Tooltip>
+          </TooltipProvider>
+        </div>
       </div>
       <div className="space-y-0.5">
         <div className="text-sm font-semibold leading-tight text-[hsl(var(--foreground))]">
@@ -245,11 +314,22 @@ export function DetailLayout({
   sidebar: React.ReactNode;
   children: React.ReactNode;
 }) {
+  const { collapsed } = useDetailSidebarCollapsed();
   return (
     <AppShellLayout>
       {sidebar}
-      <div className="min-w-0 flex-1 overflow-y-auto px-7 py-5 max-md:px-4">
-        {children}
+      {/*
+        Wrap the right pane in a `relative` so the restore button can pin
+        to its top-left without scrolling away with the content. Splitting
+        the previous single `flex-1 overflow-y-auto` into a `relative` outer
+        + an inner `absolute inset-0` scroll container achieves this without
+        changing the visible layout for the expanded case.
+      */}
+      <div className="relative min-w-0 flex-1">
+        {collapsed ? <DetailSidebarRestoreButton /> : null}
+        <div className="absolute inset-0 overflow-y-auto px-7 py-5 max-md:px-4">
+          {children}
+        </div>
       </div>
     </AppShellLayout>
   );