@nextclaw/ui 0.14.1-beta.1 → 0.14.2

package/src/features/chat/features/workspace/hooks/use-chat-conversation-workspace-state.ts

@@ -1,63 +1,72 @@
 import { useMemo } from "react";
 import { useCronJobs } from "@/features/cron";
 import type { useChatThreadStore } from "@/features/chat/stores/chat-thread.store";
+import { adaptNcpSessionSummaries } from "@/features/chat/features/session/utils/ncp-session-adapter.utils";
 import { isCronJobForSession } from "@/shared/lib/cron";
+import { useChatQueryStore } from "@/features/chat/stores/ncp-chat-query.store";
 
 type ChatThreadSnapshot = ReturnType<
   typeof useChatThreadStore.getState
 >["snapshot"];
 
-function shouldShowWorkspacePanel(
-  snapshot: ChatThreadSnapshot,
-  childSessionTabs: ChatThreadSnapshot["childSessionTabs"],
-  workspaceFileTabs: ChatThreadSnapshot["workspaceFileTabs"],
-  sessionCronJobCount: number,
-) {
-  if (snapshot.workspacePanelParentKey !== snapshot.sessionKey) {
-    return false;
-  }
-  return (
-    childSessionTabs.length > 0 ||
-    workspaceFileTabs.length > 0 ||
-    sessionCronJobCount > 0
-  );
-}
+const EMPTY_SESSION_SUMMARIES: never[] = [];
 
 export function useChatConversationWorkspaceState(
   snapshot: ChatThreadSnapshot,
+  sessionKey: string | null,
 ) {
-  const childSessionTabs = useMemo(
-    () =>
-      snapshot.childSessionTabs.filter(
-        (tab) => tab.parentSessionKey === snapshot.sessionKey,
-      ),
-    [snapshot.childSessionTabs, snapshot.sessionKey],
+  const sessionSummaries = useChatQueryStore(
+    (state) =>
+      state.snapshot.sessionsQuery?.data?.sessions ?? EMPTY_SESSION_SUMMARIES,
   );
+  const childSessionTabs = useMemo(() => {
+    const tabs = snapshot.childSessionTabs.filter(
+      (tab) => tab.parentSessionKey === sessionKey,
+    );
+    const tabKeys = new Set(tabs.map((tab) => tab.sessionKey));
+    return [
+      ...tabs,
+      ...adaptNcpSessionSummaries(sessionSummaries)
+        .filter(
+          (session) =>
+            session.parentSessionId === sessionKey && !tabKeys.has(session.key),
+        )
+        .map((session) => ({
+          sessionKey: session.key,
+          parentSessionKey: sessionKey,
+        })),
+    ];
+  }, [sessionKey, sessionSummaries, snapshot.childSessionTabs]);
   const workspaceFileTabs = useMemo(
     () =>
       snapshot.workspaceFileTabs.filter(
-        (tab) => tab.parentSessionKey === snapshot.sessionKey,
+        (tab) => tab.parentSessionKey === sessionKey,
       ),
-    [snapshot.sessionKey, snapshot.workspaceFileTabs],
+    [sessionKey, snapshot.workspaceFileTabs],
   );
+  const activeSideChatDraft =
+    snapshot.activeSideChatDraft?.parentSessionKey === sessionKey
+      ? snapshot.activeSideChatDraft
+      : null;
   const cronQuery = useCronJobs({ all: true });
   const sessionCronJobs = useMemo(
     () =>
       (cronQuery.data?.jobs ?? []).filter((job) =>
-        isCronJobForSession(job, snapshot.sessionKey),
+        isCronJobForSession(job, sessionKey),
       ),
-    [cronQuery.data?.jobs, snapshot.sessionKey],
+    [cronQuery.data?.jobs, sessionKey],
   );
 
   return {
     childSessionTabs,
+    activeSideChatDraft,
     workspaceFileTabs,
     sessionCronJobs,
-    showWorkspacePanel: shouldShowWorkspacePanel(
-      snapshot,
-      childSessionTabs,
-      workspaceFileTabs,
-      sessionCronJobs.length,
-    ),
+    showWorkspacePanel:
+      snapshot.workspacePanelParentKey === sessionKey &&
+      (activeSideChatDraft !== null ||
+        childSessionTabs.length > 0 ||
+        workspaceFileTabs.length > 0 ||
+        sessionCronJobs.length > 0),
   };
 }

package/src/features/chat/features/workspace/utils/__tests__/chat-workspace-panel-view-model.utils.test.ts

@@ -3,7 +3,7 @@ import type { ResolvedChildSessionTab } from "@/features/chat/features/ncp/hooks
 import {
   buildWorkspaceTabsViewModel,
   resolveWorkspaceSelection,
-} from "../chat-workspace-panel-view-model.utils";
+} from "@/features/chat/features/workspace/utils/chat-workspace-panel-view-model.utils";
 
 function createChildTab(
   overrides: Partial<ResolvedChildSessionTab> = {},
@@ -39,6 +39,7 @@ describe("resolveWorkspaceSelection", () => {
       resolveWorkspaceSelection({
         activePanelKind: "file",
         activeChildSessionKey: childTab.sessionKey,
+        activeSideChatDraft: null,
         activeWorkspaceFileKey: fileTab.key,
         childSessionTabs: [childTab],
         workspaceFileTabs: [fileTab],
@@ -57,6 +58,7 @@ describe("resolveWorkspaceSelection", () => {
       resolveWorkspaceSelection({
         activePanelKind: null,
         activeChildSessionKey: null,
+        activeSideChatDraft: null,
         activeWorkspaceFileKey: null,
         childSessionTabs: [childTab],
         workspaceFileTabs: [],
@@ -67,6 +69,28 @@ describe("resolveWorkspaceSelection", () => {
       tab: childTab,
     });
   });
+
+  it("honors the explicit side chat draft selection", () => {
+    const draft = {
+      draftKey: "draft-1",
+      parentSessionKey: "parent-1",
+    };
+
+    expect(
+      resolveWorkspaceSelection({
+        activePanelKind: "side-chat-draft",
+        activeChildSessionKey: null,
+        activeSideChatDraft: draft,
+        activeWorkspaceFileKey: null,
+        childSessionTabs: [createChildTab()],
+        workspaceFileTabs: [],
+        sessionCronJobCount: 0,
+      }),
+    ).toMatchObject({
+      kind: "side-chat-draft",
+      draft,
+    });
+  });
 });
 
 describe("buildWorkspaceTabsViewModel", () => {
@@ -79,6 +103,7 @@ describe("buildWorkspaceTabsViewModel", () => {
 
     const tabs = buildWorkspaceTabsViewModel({
       resolvedChildTabs: [childTab],
+      activeSideChatDraft: null,
       workspaceFileTabs: [],
       sessionCronJobCount: 0,
       activeSelection: null,
@@ -100,4 +125,37 @@ describe("buildWorkspaceTabsViewModel", () => {
     tabs[0]?.onSelect();
     expect(onSelectSession).toHaveBeenCalledWith("child-1");
   });
+
+  it("places the side chat draft tab before child session tabs", () => {
+    const draft = {
+      draftKey: "draft-1",
+      parentSessionKey: "parent-1",
+    };
+    const childTab = createChildTab();
+
+    const tabs = buildWorkspaceTabsViewModel({
+      resolvedChildTabs: [childTab],
+      activeSideChatDraft: draft,
+      workspaceFileTabs: [],
+      sessionCronJobCount: 0,
+      activeSelection: {
+        kind: "side-chat-draft",
+        draft,
+      },
+      optimisticReadAtBySessionKey: {},
+      onSelectSession: vi.fn(),
+      onSelectFile: vi.fn(),
+      onCloseFile: vi.fn(),
+      onSelectCronJobs: vi.fn(),
+    });
+
+    expect(tabs.map((tab) => tab.key)).toEqual([
+      "side-chat-draft:draft-1",
+      "child:child-1",
+    ]);
+    expect(tabs[0]).toMatchObject({
+      kind: "side-chat-draft",
+      active: true,
+    });
+  });
 });

package/src/features/chat/features/workspace/utils/chat-thread-workspace-session.utils.ts

@@ -0,0 +1,109 @@
+import type {
+  ChatChildSessionTab,
+  ChatThreadSnapshot,
+  ChatWorkspaceNavigationEntry,
+  ChatWorkspaceSideChatDraft,
+} from "@/features/chat/stores/chat-thread.store";
+import {
+  filterNavigationHistoryEntries,
+  pushNavigationHistoryEntry,
+} from "@/shared/lib/navigation-history";
+
+export function areWorkspaceNavigationEntriesEqual(
+  current: ChatWorkspaceNavigationEntry,
+  next: ChatWorkspaceNavigationEntry,
+): boolean {
+  if (current.kind !== next.kind) {
+    return false;
+  }
+  if (current.kind === 'cron') {
+    return true;
+  }
+  return next.kind !== 'cron' && current.key === next.key;
+}
+
+export function createSideChatDraft(parentSessionKey: string): ChatWorkspaceSideChatDraft {
+  const randomPart =
+    typeof globalThis.crypto?.randomUUID === 'function'
+      ? globalThis.crypto.randomUUID()
+      : `${Date.now().toString(36)}-${Math.random().toString(36).slice(2)}`;
+  return {
+    draftKey: `side-chat-draft:${parentSessionKey}:${randomPart}`,
+    parentSessionKey,
+  };
+}
+
+export function upsertChildSessionTab(
+  childSessionTabs: readonly ChatChildSessionTab[],
+  nextTab: ChatChildSessionTab,
+): ChatChildSessionTab[] {
+  const existingIndex = childSessionTabs.findIndex((tab) => tab.sessionKey === nextTab.sessionKey);
+  if (existingIndex === -1) {
+    return [nextTab, ...childSessionTabs];
+  }
+  const existingTab = childSessionTabs[existingIndex];
+  const nextTabs = [...childSessionTabs];
+  nextTabs[existingIndex] = {
+    ...existingTab,
+    parentSessionKey: existingTab.parentSessionKey ?? nextTab.parentSessionKey,
+    label: existingTab.label?.trim() ? existingTab.label : nextTab.label,
+    agentId: existingTab.agentId?.trim() ? existingTab.agentId : nextTab.agentId,
+  };
+  return nextTabs;
+}
+
+export function materializeSideChatDraftSnapshot(params: {
+  snapshot: ChatThreadSnapshot;
+  draftKey: string;
+  sessionKey: string;
+  label?: string | null;
+  agentId?: string | null;
+}): { patch: Partial<ChatThreadSnapshot>; parentSessionKey: string } | null {
+  const {
+    agentId: rawAgentId,
+    draftKey: rawDraftKey,
+    label: rawLabel,
+    sessionKey: rawSessionKey,
+    snapshot,
+  } = params;
+  const sessionKey = rawSessionKey.trim();
+  const draftKey = rawDraftKey.trim();
+  const { activeSideChatDraft } = snapshot;
+  if (!sessionKey || !draftKey || activeSideChatDraft?.draftKey !== draftKey) {
+    return null;
+  }
+  const { parentSessionKey } = activeSideChatDraft;
+  const filteredHistory = filterNavigationHistoryEntries(
+    {
+      entries: snapshot.workspaceNavigationHistory,
+      index: snapshot.workspaceNavigationHistoryIndex,
+    },
+    (entry) => entry.kind !== 'side-chat-draft' || entry.key !== draftKey,
+  );
+  const history = pushNavigationHistoryEntry(
+    filteredHistory,
+    {
+      kind: 'child-session',
+      key: sessionKey,
+    },
+    areWorkspaceNavigationEntriesEqual,
+  );
+  return {
+    parentSessionKey,
+    patch: {
+      workspacePanelParentKey: parentSessionKey,
+      activeWorkspacePanelKind: 'child-session',
+      activeChildSessionKey: sessionKey,
+      activeSideChatDraft: null,
+      activeWorkspaceFileKey: null,
+      childSessionTabs: upsertChildSessionTab(snapshot.childSessionTabs, {
+        sessionKey,
+        parentSessionKey,
+        label: rawLabel?.trim() || null,
+        agentId: rawAgentId?.trim() || null,
+      }),
+      workspaceNavigationHistory: [...history.entries],
+      workspaceNavigationHistoryIndex: history.index,
+    },
+  };
+}

package/src/features/chat/features/workspace/utils/chat-workspace-panel-view-model.utils.ts

@@ -1,6 +1,9 @@
 import type { ResolvedChildSessionTab } from "@/features/chat/features/ncp/hooks/use-ncp-child-session-tabs-view";
 import { shouldShowUnreadSessionIndicator } from "@/features/chat/stores/chat-session-list.store";
-import type { ChatWorkspaceFileTab } from "@/features/chat/stores/chat-thread.store";
+import type {
+  ChatWorkspaceFileTab,
+  ChatWorkspaceSideChatDraft,
+} from "@/features/chat/stores/chat-thread.store";
 import { t } from "@/shared/lib/i18n";
 
 export type WorkspaceSelection =
@@ -8,6 +11,10 @@ export type WorkspaceSelection =
       kind: "child-session";
       tab: ResolvedChildSessionTab;
     }
+  | {
+      kind: "side-chat-draft";
+      draft: ChatWorkspaceSideChatDraft;
+    }
   | {
       kind: "file";
       file: ChatWorkspaceFileTab;
@@ -18,7 +25,7 @@ export type WorkspaceSelection =
 
 export type WorkspaceTabViewModel = {
   key: string;
-  kind: "child-session" | "file" | "cron";
+  kind: "child-session" | "side-chat-draft" | "file" | "cron";
   title: string;
   tooltip: string;
   active: boolean;
@@ -35,8 +42,9 @@ export function readWorkspaceFileTitle(file: ChatWorkspaceFileTab): string {
 }
 
 export function resolveWorkspaceSelection(params: {
-  activePanelKind?: "child-session" | "file" | "cron" | null;
+  activePanelKind?: "child-session" | "side-chat-draft" | "file" | "cron" | null;
   activeChildSessionKey: string | null;
+  activeSideChatDraft: ChatWorkspaceSideChatDraft | null;
   activeWorkspaceFileKey: string | null;
   childSessionTabs: ResolvedChildSessionTab[];
   workspaceFileTabs: readonly ChatWorkspaceFileTab[];
@@ -45,6 +53,7 @@ export function resolveWorkspaceSelection(params: {
   const {
     activePanelKind,
     activeChildSessionKey,
+    activeSideChatDraft,
     activeWorkspaceFileKey,
     childSessionTabs,
     workspaceFileTabs,
@@ -55,6 +64,13 @@ export function resolveWorkspaceSelection(params: {
     return { kind: "cron" };
   }
 
+  if (activePanelKind === "side-chat-draft" && activeSideChatDraft) {
+    return {
+      kind: "side-chat-draft",
+      draft: activeSideChatDraft,
+    };
+  }
+
   if (activePanelKind !== "child-session" && activeWorkspaceFileKey) {
     const activeFile = workspaceFileTabs.find(
       (file) => file.key === activeWorkspaceFileKey,
@@ -86,6 +102,13 @@ export function resolveWorkspaceSelection(params: {
     };
   }
 
+  if (activeSideChatDraft) {
+    return {
+      kind: "side-chat-draft",
+      draft: activeSideChatDraft,
+    };
+  }
+
   if (workspaceFileTabs[0]) {
     return {
       kind: "file",
@@ -102,6 +125,7 @@ export function resolveWorkspaceSelection(params: {
 
 export function buildWorkspaceTabsViewModel(params: {
   resolvedChildTabs: ResolvedChildSessionTab[];
+  activeSideChatDraft: ChatWorkspaceSideChatDraft | null;
   workspaceFileTabs: readonly ChatWorkspaceFileTab[];
   sessionCronJobCount: number;
   activeSelection: WorkspaceSelection | null;
@@ -112,6 +136,7 @@ export function buildWorkspaceTabsViewModel(params: {
   onSelectCronJobs: () => void;
 }): WorkspaceTabViewModel[] {
   const {
+    activeSideChatDraft,
     resolvedChildTabs,
     workspaceFileTabs,
     sessionCronJobCount,
@@ -123,6 +148,21 @@ export function buildWorkspaceTabsViewModel(params: {
     onSelectCronJobs,
   } = params;
 
+  const sideChatDraftTabs = activeSideChatDraft
+    ? [
+        {
+          key: `side-chat-draft:${activeSideChatDraft.draftKey}`,
+          kind: "side-chat-draft" as const,
+          title: t("chatWorkspaceSideChatDraftTitle"),
+          tooltip: t("chatWorkspaceSideChatDraftSubtitle"),
+          active:
+            activeSelection?.kind === "side-chat-draft" &&
+            activeSelection.draft.draftKey === activeSideChatDraft.draftKey,
+          onSelect: () => undefined,
+        },
+      ]
+    : [];
+
   const childTabs = resolvedChildTabs.map((tab) => {
     const optimisticReadAt = optimisticReadAtBySessionKey[tab.sessionKey];
     const effectiveReadAt =
@@ -179,5 +219,5 @@ export function buildWorkspaceTabsViewModel(params: {
         ]
       : [];
 
-  return [...childTabs, ...fileTabs, ...cronTab];
+  return [...sideChatDraftTabs, ...childTabs, ...fileTabs, ...cronTab];
 }

package/src/features/chat/index.ts

@@ -4,7 +4,6 @@ export { ChatPresenterProvider } from "./components/providers/chat-presenter.pro
 export { usePresenter } from "./components/providers/chat-presenter.provider";
 export { ChatPresenter } from "./presenters/chat.presenter";
 export { ChatDraftIntentManager } from "./managers/chat-draft-intent.manager";
-export { useChatInputStore } from "./stores/chat-input.store";
 export { useChatSessionListStore } from "./stores/chat-session-list.store";
 export { useChatThreadStore } from "./stores/chat-thread.store";
 export { useNcpChatSessionTypes } from "./features/session-type/hooks/use-ncp-chat-session-types";