@nextclaw/ui 0.26.5 → 0.27.1

package/src/features/right-panel-resources/managers/page-resource.manager.ts

@@ -6,6 +6,7 @@ import { GLOBAL_WORKBENCH_SURFACE } from "@/shared/components/workbench/types/wo
 import { useChatThreadStore } from "@/features/chat";
 import type { ChatThreadManager } from "@/features/chat";
 import type { AppPresenter } from "@/app/presenters/app.presenter";
+import type { WorkspaceTextExcerpt } from "@/features/chat";
 import { useDocBrowserStore } from "@/shared/components/doc-browser/stores/doc-browser.store";
 import { useFloatingSessionStore } from "@/features/chat";
 import { sessionSurfaceManager } from "@/features/chat";
@@ -61,29 +62,28 @@ export class PageResourceManager {
   };
 
   resolve = (
-    uri: string,
+    rawUri: string,
     context?: { workingDir?: string | null; sessionKey?: string | null },
   ): PageResource | null => {
-    if (!/^(nextclaw:\/\/|https?:\/\/)/i.test(uri)) return null;
-    if (uri.startsWith("nextclaw://file/")) {
-      try {
+    if (!/^(nextclaw:\/\/|https?:\/\/)/i.test(rawUri)) return null;
+    try {
+      const uri = this.app.rightPanelResourceRouteResolver.normalize(rawUri);
+      if (uri.startsWith("nextclaw://file/")) {
         const target = resolveFileResourceTarget(uri, context);
         return target ? pageResourceFromTarget(target) : null;
-      } catch {
-        return null;
       }
-    }
-    const saved =
-      this.remembered.get(uri) ??
-      usePageNavigationStore.getState().pinned.find((page) => page.uri === uri);
-    if (saved) return saved;
-    const tab = useDocBrowserStore
-      .getState()
-      .snapshot.tabs.find(
-        (item) => (item.resourceUri ?? item.currentUrl) === uri,
-      );
-    if (tab) return pageResourceFromTab(tab);
-    try {
+      const saved =
+        this.remembered.get(uri) ??
+        usePageNavigationStore
+          .getState()
+          .pinned.find((page) => page.uri === uri);
+      if (saved) return saved;
+      const tab = useDocBrowserStore
+        .getState()
+        .snapshot.tabs.find(
+          (item) => (item.resourceUri ?? item.currentUrl) === uri,
+        );
+      if (tab) return pageResourceFromTab(tab);
       if (uri.startsWith("nextclaw://page?")) {
         const path = new URL(uri).searchParams.get("path");
         if (
@@ -190,7 +190,9 @@ export class PageResourceManager {
         location === "floating" ? "floating" : "docked",
       );
       if (location === "main")
-        this.app.workbenchSurfaceManager.toggleMaximize(`session-workspace:${parent ?? "draft"}`);
+        this.app.workbenchSurfaceManager.toggleMaximize(
+          `session-workspace:${parent ?? "draft"}`,
+        );
       return;
     }
     const sessionKey = parseSessionKeyFromPanelUrl(page.uri);
@@ -208,7 +210,7 @@ export class PageResourceManager {
         (item) => (item.resourceUri ?? item.currentUrl) === page.uri,
       );
       if (existing.isOpen && tab) {
-        this.app.docBrowserManager.openTarget(page.target, { newTab: true });
+        this.app.docBrowserManager.setActiveTab(tab.id);
         this.app.workbenchSurfaceManager.restore(GLOBAL_WORKBENCH_SURFACE);
         return;
       }
@@ -216,7 +218,9 @@ export class PageResourceManager {
     if (
       location === "main" ||
       page.target.kind === "route" ||
-      (location === "default" && page.mainPath && page.target.kind !== "panel-app")
+      (location === "default" &&
+        page.mainPath &&
+        page.target.kind !== "panel-app")
     ) {
       navigate(pageResourceMainPath(page));
     } else if (location === "floating" && sessionKey) {
@@ -295,6 +299,19 @@ export class PageResourceManager {
     } else this.open(next, "default", navigate);
   };
 
+  addExcerptToChat = (
+    excerpt: WorkspaceTextExcerpt,
+    pathname: string,
+    navigate: (path: string) => void,
+  ): void => {
+    const isChat = pathname === "/chat" || pathname.startsWith("/chat/");
+    this.app.chatComposerIntentManager.requestExcerptReference({
+      ...excerpt,
+      targetSessionKey: isChat ? parseSessionKeyFromRoute(pathname.slice("/chat/".length)) : null,
+    });
+    if (!isChat) navigate("/chat");
+  };
+
   addToChat = (
     page: PageResource,
     pathname: string,

package/src/features/right-panel-resources/utils/__tests__/right-panel-resource-route-resolver.utils.test.ts

@@ -2,6 +2,23 @@ import { describe, expect, it } from 'vitest';
 import { RightPanelResourceRouteResolver } from '@/features/right-panel-resources';
 
 describe('RightPanelResourceRouteResolver', () => {
+  it('does not treat different document sections as the same destination', () => {
+    const resolver = new RightPanelResourceRouteResolver();
+    expect(resolver.areUrlsEquivalent('https://docs.nextclaw.io/en/guide/commands#one',
+      'https://docs.nextclaw.io/en/guide/commands#two', 'docs', 'docs')).toBe(false);
+  });
+  it.each(['nextclaw://docs/guide/commands?source=chat#sessions', 'https://docs.nextclaw.io/zh/guide/commands?source=chat#sessions'])(
+    'keeps document query and anchor in the resource and final destination: %s', (uri) => {
+      const target = new RightPanelResourceRouteResolver().resolve(uri);
+      expect(target.url).toContain('?source=chat#sessions');
+      expect(target.resourceUri).toContain('?source=chat#sessions');
+    },
+  );
+  it('preserves the app marketplace through resource normalization', () => {
+    expect(new RightPanelResourceRouteResolver().resolve('nextclaw://apps?tab=marketplace')).toMatchObject({
+      kind: 'apps', dedupeKey: 'apps', url: 'nextclaw://apps?tab=marketplace', resourceUri: 'nextclaw://apps?tab=marketplace',
+    });
+  });
   it.each(['cron-job', 'inbox-delivery', 'skill', 'agent', 'project'])('resolves %s as an object, not an unsupported website', (type) => {
     const uri = 'nextclaw://objects/' + type + '/' + encodeURIComponent('workspace:项目/对象');
     expect(new RightPanelResourceRouteResolver().resolve(uri)).toMatchObject({ kind: 'system-object', url: uri, resourceUri: uri });

package/src/features/right-panel-resources/utils/right-panel-resource-uri.utils.ts

@@ -42,15 +42,16 @@ export function createChatUiResourceReferenceFromTab(
   });
 }
 
-export type RightPanelAppsTab = 'apps' | 'panel-apps' | 'service-apps';
+export type RightPanelAppsTab = 'apps' | 'panel-apps' | 'service-apps' | 'marketplace';
 
 const DEFAULT_RIGHT_PANEL_APPS_TAB: RightPanelAppsTab = 'apps';
 
 function isRightPanelAppsTab(value: unknown): value is RightPanelAppsTab {
-  return value === 'apps' || value === 'panel-apps' || value === 'service-apps';
+  return value === 'apps' || value === 'panel-apps' || value === 'service-apps' || value === 'marketplace';
 }
 
 export function createRightPanelAppsUrl(tab: RightPanelAppsTab = DEFAULT_RIGHT_PANEL_APPS_TAB): string {
+  if (tab === 'marketplace') return `${RIGHT_PANEL_APPS_URL}?tab=marketplace`;
   if (tab === 'panel-apps') return RIGHT_PANEL_PANEL_APPS_URL;
   if (tab === 'service-apps') return RIGHT_PANEL_SERVICE_APPS_URL;
   return RIGHT_PANEL_APPS_URL;

package/src/features/service-apps/components/service-action-row.tsx

@@ -1,3 +1,4 @@
+import { ACTION_FEEDBACK, ACTION_MENU_ITEM_CLASS } from '@/shared/components/ui/actions/action-feedback';
 import { useState } from "react";
 import type {
   AgentProfileView,
@@ -73,7 +74,7 @@ export function ServiceActionRow({
                 <ShieldPlus className="h-3.5 w-3.5" />
               </button>
             </PopoverTrigger>
-            <PopoverContent align="end" className="w-56 rounded-xl p-1.5">
+            <PopoverContent align="end" variant="menu">
               <div className="px-2 py-1.5 text-[11px] font-medium text-muted-foreground">
                 {t("serviceAppsGrantToAgent")}
               </div>
@@ -85,9 +86,9 @@ export function ServiceActionRow({
                     onGrantAgent(action.id, agent.id);
                     setAgentMenuOpen(false);
                   }}
-                  className="flex w-full items-center gap-2 rounded-lg px-2 py-1.5 text-left text-xs text-foreground transition-colors hover:bg-[var(--interaction-hover)] focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border"
+                  className={`${ACTION_MENU_ITEM_CLASS} text-foreground ${ACTION_FEEDBACK.item}`}
                 >
-                  <Bot className="h-3.5 w-3.5 text-muted-foreground" />
+                  <Bot className="h-4 w-4 shrink-0 text-muted-foreground" />
                   <span className="min-w-0 truncate">
                     {agent.displayName?.trim() || agent.id}
                   </span>

package/src/features/service-apps/components/service-app-delete-dialog.tsx

@@ -51,11 +51,11 @@ export function ServiceAppDeleteDialog({
       onOpenChange={(nextOpen) => !deletePending && onOpenChange(nextOpen)}
     >
       <DialogContent
-        className="max-w-md [&>:last-child]:hidden"
+        className="max-w-md"
         onEscapeKeyDown={(event) => deletePending && event.preventDefault()}
         onInteractOutside={(event) => deletePending && event.preventDefault()}
       >
-        <DialogHeader>
+        <DialogHeader showClose={false}>
           <DialogTitle>{t("serviceAppsDeleteConfirmTitle")}</DialogTitle>
           <DialogDescription>
             {t("serviceAppsDeleteConfirmDescription")} {appTitle}

package/src/features/service-apps/components/service-app-list-item.tsx

@@ -1,3 +1,4 @@
+import { ACTION_FEEDBACK, ACTION_MENU_ITEM_CLASS } from '@/shared/components/ui/actions/action-feedback';
 import { PageResourceActionItems } from "@/features/right-panel-resources";
 import { pageResourceFromSystemObject } from "@/features/right-panel-resources";
 import { useState } from "react";
@@ -380,15 +381,15 @@ function ServiceAppMenuItem({
     <button
       type="button"
       className={cn(
-        "flex w-full items-center gap-2 rounded-lg px-2.5 py-2 text-left text-sm transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-border disabled:cursor-not-allowed disabled:opacity-50",
+        ACTION_MENU_ITEM_CLASS,
         destructive
-          ? "text-destructive hover:bg-destructive/10"
-          : "text-muted-foreground hover:bg-[var(--interaction-hover)] hover:text-accent-foreground",
+          ? ACTION_FEEDBACK.destructive
+          : `text-foreground ${ACTION_FEEDBACK.item}`,
       )}
       disabled={disabled}
       onClick={onClick}
     >
-      <Icon className="h-4 w-4 shrink-0" />
+      <Icon className={cn("h-4 w-4 shrink-0", !destructive && "text-muted-foreground")} />
       <span>{label}</span>
     </button>
   );

package/src/features/service-apps/components/service-apps-panel.tsx

@@ -31,8 +31,10 @@ type ServiceActionView = ServiceActionListView["actions"][number];
 
 export function ServiceAppsPanel({
   onManagePackage,
+  resourceId,
 }: {
   onManagePackage: (packageId: string) => void;
+  resourceId?: string;
 }) {
   const serviceApps = useServiceApps();
   const appData = useAppData();
@@ -84,7 +86,8 @@ export function ServiceAppsPanel({
     );
   }
 
-  const apps: ServiceAppRecordView[] = serviceApps.data?.entries ?? [];
+  const apps: ServiceAppRecordView[] = (serviceApps.data?.entries ?? []).filter((app) => !resourceId || app.id === resourceId);
+  if (resourceId && !apps.length) return <p role="alert" className="p-4">{t("resourceNotFound")}</p>;
   const diagnostics = serviceApps.data?.diagnostics ?? [];
   const actions: ServiceActionView[] = serviceActions.data?.actions ?? [];
   const grants: ServiceActionGrantView[] =
@@ -165,7 +168,7 @@ export function ServiceAppsPanel({
                   discoveredActionsByApp[app.id] ??
                   actions.filter((action) => action.appId === app.id)
                 }
-                actionsOpen={Boolean(expandedActionsByApp[app.id])}
+                actionsOpen={expandedActionsByApp[app.id] ?? Boolean(resourceId)}
                 grants={grants}
                 agents={agents.data?.agents ?? []}
                 deletePending={deleteServiceApp.isPending}

package/src/features/settings/components/config/provider-model-suggestions-panel.tsx

@@ -101,7 +101,7 @@ export function ProviderModelSuggestionsPanel(props: ProviderModelSuggestionsPan
               />
             </div>
           ) : null}
-          <div className='custom-scrollbar max-h-44 overflow-y-auto overscroll-contain'>
+          <div className='custom-scrollbar max-h-44 overflow-y-auto'>
             {visibleModels.map((modelName) => (
               <label
                 key={modelName}

package/src/features/settings/pages/providers-config-page.tsx

@@ -1,3 +1,4 @@
+import { ACTION_FEEDBACK, ACTION_MENU_ITEM_CLASS } from '@/shared/components/ui/actions/action-feedback';
 import { useMemo, useState } from 'react';
 import { KeyRound, MoreVertical, Plus, Search, Trash2 } from 'lucide-react';
 import {
@@ -307,10 +308,10 @@ export function ProvidersConfigPage() {
                             <MoreVertical className='h-4 w-4' />
                           </button>
                         </PopoverTrigger>
-                        <PopoverContent className='w-40 p-1' align='end' onClick={(event) => event.stopPropagation()}>
+                        <PopoverContent variant='menu' align='end' onClick={(event) => event.stopPropagation()}>
                           <button
                             type='button'
-                            className='flex w-full items-center gap-2 rounded-md px-2 py-2 text-sm text-red-600 hover:bg-destructive/10'
+                            className={`${ACTION_MENU_ITEM_CLASS} ${ACTION_FEEDBACK.destructive}`}
                             onClick={() => setProviderToDelete(provider.providerId)}
                           >
                             <Trash2 className='h-4 w-4' />

package/src/index.css

@@ -93,27 +93,35 @@
     background: hsl(var(--gray-400) / 0.48);
   }
 
-  .doc-browser-tab-scrollbar {
+  .compact-tab-scrollbar {
     scrollbar-width: thin;
-    scrollbar-color: hsl(var(--gray-300) / 0.34) transparent;
+    scrollbar-color: var(--tab-scrollbar-thumb, hsl(var(--gray-300) / 0.34)) transparent;
   }
 
-  .doc-browser-tab-scrollbar::-webkit-scrollbar {
+  /* Native thin scrollbars override pixel sizes and may expand on hover. */
+  @supports selector(::-webkit-scrollbar) {
+    .compact-tab-scrollbar {
+      scrollbar-width: auto;
+      scrollbar-color: auto;
+    }
+  }
+
+  .compact-tab-scrollbar::-webkit-scrollbar {
     width: 2px;
     height: 2px;
   }
 
-  .doc-browser-tab-scrollbar::-webkit-scrollbar-track {
+  .compact-tab-scrollbar::-webkit-scrollbar-track {
     background: transparent;
   }
 
-  .doc-browser-tab-scrollbar::-webkit-scrollbar-thumb {
-    background: hsl(var(--gray-300) / 0.34);
+  .compact-tab-scrollbar::-webkit-scrollbar-thumb {
+    background: var(--tab-scrollbar-thumb, hsl(var(--gray-300) / 0.34));
     border-radius: 999px;
   }
 
-  .doc-browser-tab-scrollbar::-webkit-scrollbar-thumb:hover {
-    background: hsl(var(--gray-400) / 0.44);
+  .compact-tab-scrollbar::-webkit-scrollbar-thumb:hover {
+    background: var(--tab-scrollbar-thumb-hover, hsl(var(--gray-400) / 0.44));
   }
 
   /* ========================================
@@ -680,6 +688,32 @@
   --md-table-head-bg: rgba(191, 219, 254, 0.16);
 }
 
+:root[data-theme="paper-ink"] .chat-markdown-user {
+  --md-text: hsl(var(--primary-foreground));
+  --md-muted: hsl(42 20% 80%);
+  --md-border: hsl(42 20% 80% / 0.24);
+  --md-link: hsl(45 42% 84%);
+  --md-inline-code-bg: hsl(45 20% 90% / 0.1);
+  --md-inline-code-color: hsl(var(--primary-foreground));
+  --md-blockquote-border: hsl(45 30% 80% / 0.5);
+  --md-blockquote-bg: hsl(45 20% 90% / 0.06);
+  --md-table-head-bg: hsl(45 20% 90% / 0.08);
+}
+
+:root[data-theme="plain-paper"] .chat-markdown-user,
+:root[data-theme="plain-paper"] .chat-markdown-assistant,
+:root[data-theme="paper-ink"] .chat-markdown-assistant {
+  --md-text: hsl(var(--foreground));
+  --md-muted: hsl(var(--gray-600));
+  --md-border: hsl(var(--border));
+  --md-link: hsl(var(--link-foreground));
+  --md-inline-code-bg: hsl(var(--gray-200) / 0.5);
+  --md-inline-code-color: hsl(var(--gray-800));
+  --md-blockquote-border: hsl(var(--brand-400) / 0.5);
+  --md-blockquote-bg: hsl(var(--brand-100) / 0.4);
+  --md-table-head-bg: hsl(var(--gray-200) / 0.4);
+}
+
 :root[data-theme="work"] .chat-markdown-assistant {
   --md-link: #1f73c9;
   --md-border: rgba(0, 0, 0, 0.11);

package/src/shared/components/doc-browser/__tests__/doc-browser-context.test.tsx

@@ -55,6 +55,22 @@ async function resetMemoryThenRehydrate(savedState: string | null) {
 }
 
 describe('DocBrowserManager layout notifications', () => {
+  it.each(['nextclaw://objects/chat-session/example', 'nextclaw://chat-session/sid_ZXhhbXBsZQ'])(
+    'restores historical conversation tabs as real session views: %s', async (uri) => {
+      window.localStorage.setItem(docBrowserStorageKey, JSON.stringify({ version: 1, state: { snapshot: {
+        isOpen: true, activeTabId: 'old',
+        tabs: [{ id: 'old', kind: 'system-object', title: 'Conversation', currentUrl: uri, resourceUri: uri }],
+        activeHistory: [{ tabId: 'old', kind: 'system-object', url: uri, resourceUri: uri }],
+      } } }));
+      await rehydrateDocBrowserFromStorage();
+      expect(useDocBrowserStore.getState().snapshot.tabs[0]).toMatchObject({
+        kind: 'chat-session', currentUrl: 'nextclaw://sessions/example', resourceUri: 'nextclaw://sessions/example',
+      });
+      expect(useDocBrowserStore.getState().snapshot.activeHistory[0]).toMatchObject({
+        kind: 'chat-session', url: 'nextclaw://sessions/example',
+      });
+    },
+  );
   it('notifies the app layout coordinator after opening the docked browser', () => {
     const onRightPanelOpened = vi.fn();
     const manager = new DocBrowserManager(new WorkbenchSurfaceManager(),

package/src/shared/components/doc-browser/__tests__/doc-browser.test.tsx

@@ -505,7 +505,7 @@ describe("DocBrowser", () => {
 
     render(<DocBrowser />);
 
-    expect(screen.getByTitle("Local App").getAttribute("tabindex")).toBeNull();
+    expect(screen.getAllByTitle("Local App").find((element) => element.tagName === 'IFRAME')!.getAttribute("tabindex")).toBeNull();
   });
 });
 
@@ -875,7 +875,7 @@ describe("DocBrowser content tabs", () => {
     render(<DocBrowser />);
 
     const addressInput = screen.getByRole("textbox", { name: "Address" }) as HTMLInputElement;
-    const iframe = screen.getByTitle("Local App") as HTMLIFrameElement;
+    const iframe = screen.getAllByTitle("Local App").find((element) => element.tagName === 'IFRAME') as HTMLIFrameElement;
     const externalLink = screen.getByRole("link", { name: /Open in Browser/i }) as HTMLAnchorElement;
 
     expect(addressInput.value).toBe("http://127.0.0.1:5173/dashboard");

package/src/shared/components/doc-browser/__tests__/resource-link-interceptor.test.tsx

@@ -54,7 +54,7 @@ describe("ordinary Markdown resource links end to end", () => {
       </QueryClientProvider>,
     );
   }
-  it.each(["cron-job", "skill", "agent", "project", "inbox-delivery"])(
+  it.each(["cron-job", "skill", "agent", "project", "inbox-delivery", "panel-app", "service-app", "mcp-server", "project-work"])(
     "opens a normal Markdown %s object link in the shared resource viewer",
     (kind) => {
       const uri = "nextclaw://objects/" + kind + "/existing-object";
@@ -72,6 +72,34 @@ describe("ordinary Markdown resource links end to end", () => {
       expect(screen.getByTestId("route").textContent).toBe("/chat");
     },
   );
+  it.each(['sessions/ncp-mu2x4zdy-9wzl0otb', 'chat-session/ncp-mu2x4zdy-9wzl0otb',
+    'chat-session/sid_bmNwLW11Mng0emR5LTl3emwwb3Ri', 'objects/chat-session/ncp-mu2x4zdy-9wzl0otb',
+    'objects/chat-sessions/ncp-mu2x4zdy-9wzl0otb'])(
+    'opens the actual conversation route from %s', (path) => {
+      setup(`[Conversation](nextclaw://${path})`);
+      fireEvent.click(screen.getByRole('link', { name: 'Conversation' }));
+      expect(screen.getByTestId('route').textContent).toBe('/chat/ncp-mu2x4zdy-9wzl0otb');
+      expect(useDocBrowserStore.getState().snapshot.isOpen).toBe(false);
+    },
+  );
+  it.each([
+    ['nextclaw://docs/guide/getting-started', 'docs'],
+    ['nextclaw://apps?tab=service-apps', 'apps'],
+    ['nextclaw://marketplace-detail/skill%3Aexample', 'marketplace-detail'],
+    ['nextclaw://file/absolute/tmp/readme.md', 'workspace-file'],
+  ])('opens the %s resource family through ordinary Markdown', (uri, kind) => {
+    setup(`[Resource](${uri})`);
+    fireEvent.click(screen.getByRole('link', { name: 'Resource' }));
+    const { snapshot } = useDocBrowserStore.getState();
+    expect(snapshot.tabs.find((item) => item.id === snapshot.activeTabId)?.kind).toBe(kind);
+  });
+  it.each([['nextclaw://marketplace', '/skills'], ['nextclaw://page?path=%2Fagents', '/agents']])(
+    'navigates built-in page %s', (uri, path) => {
+      setup(`[Page](${uri})`);
+      fireEvent.click(screen.getByRole('link', { name: 'Page' }));
+      expect(screen.getByTestId('route').textContent).toBe(path);
+    },
+  );
   it("opens a normal Panel App link in the global sidebar without a catalog lookup", () => {
     setup();
     const link = screen.getByRole("link", { name: "Notes" });

package/src/shared/components/doc-browser/doc-browser-tab-strip.tsx

@@ -112,7 +112,7 @@ export function DocBrowserTabStrip({
             <span className="truncate">{current?.title || t('docBrowserTabUntitled')}</span><ChevronDown className="h-4 w-4 shrink-0" />
           </button>
         </PopoverTrigger>
-        <PopoverContent align="start" className="max-h-[70dvh] w-72 overflow-y-auto p-1">
+        <PopoverContent align="start" variant="menu" className="max-h-[70dvh]">
           <ContextMenuItems groups={mobileGroups} onClose={() => setMobileMenuOpen(false)} />
           {mobileToolbar}
         </PopoverContent>
@@ -126,7 +126,7 @@ export function DocBrowserTabStrip({
       tabs={compactTabs}
       actions={actions}
       className="flex h-10 min-w-0 flex-1 gap-1 border-0 bg-transparent px-0 select-none"
-      scrollClassName="doc-browser-tab-scrollbar flex h-full max-md:h-11 max-md:basis-full items-center gap-0.5"
+      scrollClassName="flex h-full max-md:h-11 max-md:basis-full items-center gap-0.5"
       tabsClassName="items-center gap-0.5"
       actionsClassName="h-full max-md:h-11 max-md:w-full items-center gap-0.5"
       tabBaseClassName="inline-flex cursor-pointer items-center gap-0.5 h-7 max-md:min-h-11 px-2 rounded-md text-xs max-w-[220px] shrink-0 transition-colors"

package/src/shared/components/doc-browser/stores/doc-browser.store.ts

@@ -1,4 +1,5 @@
 import { ViewMemoryStorage } from '@/shared/lib/navigation-history';
+import { createSessionResourceUri, parseSessionResourceUri } from '@nextclaw/shared';
 import { create } from 'zustand';
 import { createJSONStorage, persist } from 'zustand/middleware';
 import type {
@@ -80,16 +81,19 @@ function normalizePersistedDocBrowserTab(value: unknown): DocBrowserTab | null {
     ? value.resourceUri.trim()
     : undefined;
   const dockIcon = normalizePersistedDockIcon(value.dockIcon);
+  const currentUrl = history[historyIndex] ?? value.currentUrl;
+  const sessionId = parseSessionResourceUri(resourceUri ?? currentUrl);
+  const sessionUri = sessionId ? createSessionResourceUri(sessionId) : undefined;
 
   return {
     id: value.id,
-    kind: value.kind,
+    kind: sessionUri ? 'chat-session' : value.kind,
     title: value.title,
-    currentUrl: history[historyIndex] ?? value.currentUrl,
-    resourceUri,
+    currentUrl: sessionUri ?? currentUrl,
+    resourceUri: sessionUri ?? resourceUri,
     dockIcon,
     viewState: value.viewState,
-    dedupeKey,
+    dedupeKey: sessionUri ?? dedupeKey,
     history,
     historyIndex,
     navVersion,
@@ -123,12 +127,14 @@ function normalizePersistedActiveHistoryEntry(
   const resourceUri = typeof value.resourceUri === 'string' && value.resourceUri.trim().length > 0
     ? value.resourceUri.trim()
     : undefined;
+  const sessionId = parseSessionResourceUri(resourceUri ?? value.url);
+  const sessionUri = sessionId ? createSessionResourceUri(sessionId) : undefined;
 
   return {
-    kind: value.kind,
-    resourceUri,
+    kind: sessionUri ? 'chat-session' : value.kind,
+    resourceUri: sessionUri ?? resourceUri,
     tabId: value.tabId,
-    url: value.url,
+    url: sessionUri ?? value.url,
   };
 }
 

package/src/shared/components/doc-browser/utils/doc-browser-url.utils.ts

@@ -112,7 +112,8 @@ export function getDocsUrl(pathOrUrl: string): string {
 
 export function normalizeDocUrl(url: string): string {
   try {
-    return new URL(url).pathname.replace(/\.html$/, '').replace(/\/$/, '');
+    const parsed = new URL(url);
+    return `${parsed.pathname.replace(/\.html$/, '').replace(/\/$/, '')}${parsed.search}${parsed.hash}`;
   } catch {
     return url;
   }

package/src/shared/components/path-picker/server-path-picker-dialog.tsx

@@ -1,4 +1,4 @@
-import { useMemo, useState } from 'react';
+import { useMemo, useState, type ComponentProps } from 'react';
 import { Search } from 'lucide-react';
 import { useServerPathBrowse } from '@/shared/hooks/use-server-path-browse';
 import { useServerPathCreateDirectory } from '@/shared/hooks/use-server-path-create-directory';
@@ -25,6 +25,7 @@ type ServerPathPickerDialogProps = {
   defaultWorkspacePath?: string | null;
   isSaving: boolean;
   onOpenChange: (open: boolean) => void;
+  onCloseAutoFocus?: ComponentProps<typeof DialogContent>['onCloseAutoFocus'];
   onConfirm: (path: string) => Promise<void> | void;
   title: string;
   description?: string;
@@ -57,6 +58,7 @@ export function ServerPathPickerDialog({
   defaultWorkspacePath,
   isSaving,
   onOpenChange,
+  onCloseAutoFocus,
   onConfirm,
   title,
   description,
@@ -79,8 +81,8 @@ export function ServerPathPickerDialog({
         onOpenChange(nextOpen);
       }}
     >
-      <DialogContent className="max-h-[92vh] overflow-hidden p-0 sm:h-[44rem] sm:max-w-5xl sm:grid-rows-[auto_minmax(0,1fr)]">
-        <DialogHeader className="border-b border-border px-5 py-4 pr-12">
+      <DialogContent onCloseAutoFocus={onCloseAutoFocus} className="max-h-[92vh] overflow-hidden p-0 sm:h-[44rem] sm:max-w-5xl sm:grid-rows-[auto_minmax(0,1fr)]">
+        <DialogHeader className="border-b border-border px-5 py-4">
           <DialogTitle>{title}</DialogTitle>
           <DialogDescription className={description ? undefined : 'sr-only'}>
             {description ?? title}

package/src/shared/components/ui/__tests__/dialog.test.tsx

@@ -1,12 +1,48 @@
 import { render, screen } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
+import { describe, expect, it, vi } from 'vitest';
+import userEvent from '@testing-library/user-event';
+import { t } from '@/shared/lib/i18n';
 import {
   Dialog,
   DialogContent,
+  DialogHeader,
+  DialogDescription,
+  DialogTrigger,
   DialogTitle,
 } from '@/shared/components/ui/dialog';
 
 describe('Dialog', () => {
+  it('keeps header actions separate from closing and restores trigger focus', async () => {
+    const onAction = vi.fn();
+    const user = userEvent.setup();
+    render(<Dialog>
+      <DialogTrigger>Open report</DialogTrigger>
+      <DialogContent>
+        <DialogHeader actions={<button onClick={onAction}>Next report</button>}>
+          <DialogTitle>A long report title</DialogTitle>
+          <DialogDescription>Report summary</DialogDescription>
+        </DialogHeader>
+      </DialogContent>
+    </Dialog>);
+    await user.click(screen.getByRole('button', { name: 'Open report' }));
+    expect(screen.getAllByRole('button', { name: t('close') })).toHaveLength(1);
+    await user.click(screen.getByRole('button', { name: 'Next report' }));
+    expect(onAction).toHaveBeenCalledOnce();
+    expect(screen.getByRole('dialog')).toBeTruthy();
+    await user.click(screen.getByRole('button', { name: t('close') }));
+    expect(screen.queryByRole('dialog')).toBeNull();
+    expect(document.activeElement).toBe(screen.getByRole('button', { name: 'Open report' }));
+  });
+
+  it('supports explicit confirmation-only headers', () => {
+    render(<Dialog open><DialogContent><DialogHeader showClose={false}>
+      <DialogTitle>Confirm deletion</DialogTitle>
+      <DialogDescription>Choose an action below.</DialogDescription>
+    </DialogHeader></DialogContent></Dialog>);
+    expect(screen.queryByRole('button', { name: t('close') })).toBeNull();
+    expect(screen.getByRole('heading', { name: 'Confirm deletion' })).toBeTruthy();
+  });
+
   it('renders modal layers above floating panels', () => {
     render(
       <Dialog open>

package/src/shared/components/ui/actions/action-feedback.ts

@@ -1,8 +1 @@
-/** Neutral actions share one theme color across icon and menu surfaces. */
-export const ACTION_MENU_ITEM_CLASS = 'flex min-h-8 w-full items-center gap-2 rounded-lg px-2.5 py-1 text-left text-[13px] leading-5 font-medium outline-none transition-colors disabled:pointer-events-none disabled:opacity-45';
-
-export const ACTION_FEEDBACK = {
-  icon: 'hover:before:bg-[var(--interaction-hover)] active:before:bg-[var(--interaction-hover)] disabled:hover:before:bg-transparent disabled:active:before:bg-transparent',
-  item: 'hover:bg-[var(--interaction-hover)] focus-visible:bg-[var(--interaction-hover)] active:bg-[var(--interaction-hover)] disabled:hover:bg-transparent disabled:active:bg-transparent',
-  destructive: 'text-destructive hover:bg-destructive/10 focus-visible:bg-destructive/10 disabled:hover:bg-transparent',
-} as const;
+export { ACTION_FEEDBACK, ACTION_MENU_ITEM_CLASS } from '@nextclaw/agent-chat-ui';

package/src/shared/components/ui/actions/icon-action-button.tsx

@@ -44,7 +44,7 @@ const IconActionButton = React.forwardRef<HTMLButtonElement, IconActionButtonPro
       size = 'md',
       tone = 'default',
       tooltip,
-      tooltipSide = 'bottom',
+      tooltipSide,
       ...buttonProps
     },
     ref

package/src/shared/components/ui/confirm-dialog.tsx

@@ -48,14 +48,13 @@ export const ConfirmDialog = ({
   return (
     <Dialog open={open} onOpenChange={onOpenChange}>
       <DialogContent
-        className="[&>:last-child]:hidden"
         onOpenAutoFocus={(event) => {
           event.preventDefault();
           confirmButtonRef.current?.focus();
         }}
         onCloseAutoFocus={(event) => event.preventDefault()}
       >
-        <DialogHeader>
+        <DialogHeader showClose={false}>
           <DialogTitle>{title}</DialogTitle>
           {description ? <DialogDescription>{description}</DialogDescription> : null}
         </DialogHeader>