@nextclaw/ui 0.14.1-beta.1 → 0.14.2

package/src/features/chat/pages/ncp-chat-page.tsx

@@ -11,41 +11,14 @@ import {
 } from "@/features/chat/components/layout/chat-page-shell";
 import { parseSessionKeyFromRoute } from "@/features/chat/features/session/utils/chat-session-route.utils";
 import { ChatPresenter } from "@/features/chat/presenters/chat.presenter";
-import {
-  isNcpAgentStartupUnavailableErrorMessage,
-  useNcpSessionConversation,
-} from "@/features/chat/features/ncp/hooks/use-ncp-session-conversation";
-import {
-  useNcpChatSelectedSession,
-} from "@/features/chat/features/ncp/hooks/use-ncp-chat-derived-state";
 import { useChatQueryStoreSync } from "@/features/chat/features/ncp/hooks/use-ncp-chat-query-store-sync";
 import {
   ChatPresenterProvider,
   usePresenter,
 } from "@/features/chat/components/providers/chat-presenter.provider";
 import { useConfirmDialog } from "@/shared/hooks/use-confirm-dialog";
-import { useSystemStatus } from "@/features/system-status";
 import { useAppPresenter } from "@/app/components/app-presenter-provider";
-import { isNcpChatRuntimeBlocked, resolveNcpChatSendErrorMessage } from "@/features/chat/features/runtime/utils/ncp-chat-runtime-availability.utils";
 import { useUiShowContentEvent } from "@/features/chat/features/ncp/hooks/use-ui-show-content-event";
-import { readNcpContextWindowValue } from "@/features/chat/features/session/utils/ncp-session-context-metadata.utils";
-
-function useChatDraftIntentConsumer() {
-  const appPresenter = useAppPresenter();
-  const presenter = usePresenter();
-  useEffect(() => {
-    const applyIntent = (intent: { id: number; prompt: string }) => {
-      presenter.startAgentCreationDraft(intent.prompt);
-      appPresenter.chatDraftIntentManager.markConsumed(intent.id);
-    };
-    const unsubscribe = appPresenter.chatDraftIntentManager.subscribe(applyIntent);
-    const pendingIntent = appPresenter.chatDraftIntentManager.consumePending();
-    if (pendingIntent) {
-      applyIntent(pendingIntent);
-    }
-    return unsubscribe;
-  }, [appPresenter, presenter]);
-}
 
 function useNcpChatRouteSelection() {
   const { sessionId: routeSessionIdParam } = useParams<{ sessionId?: string }>();
@@ -59,31 +32,6 @@ function useNcpChatRouteSelection() {
   };
 }
 
-type NcpChatConversation = ReturnType<typeof useNcpSessionConversation>;
-
-function useChatRunRuntimeConnection(params: {
-  agent: NcpChatConversation;
-  sessionKey: string | undefined;
-}) {
-  const presenter = usePresenter();
-  const { agent, sessionKey } = params;
-  useEffect(() => {
-    presenter.chatRunManager.setActiveRuntime({
-      sessionKey: sessionKey ?? null,
-      sendEnvelope: (envelope) => agent.send(envelope),
-      abortCurrentRun: () => agent.abort(),
-      resumeCurrentSessionRun: () => agent.streamRun(),
-    });
-    return () => {
-      presenter.chatRunManager.setActiveRuntime(null);
-    };
-  }, [
-    agent,
-    presenter,
-    sessionKey,
-  ]);
-}
-
 function useNcpChatUiBindings() {
   const presenter = usePresenter();
   const { confirm, ConfirmDialog } = useConfirmDialog();
@@ -101,42 +49,6 @@ function useNcpChatUiBindings() {
   return <ConfirmDialog />;
 }
 
-function useChatRunSnapshotSync(params: {
-  agent: NcpChatConversation;
-  isSending: boolean;
-  isRunning: boolean;
-  lastSendError: string | null;
-  routeSessionKey: string | null;
-}) {
-  const presenter = usePresenter();
-  const { agent, isRunning, isSending, lastSendError, routeSessionKey } = params;
-  useEffect(() => {
-    presenter.chatRunManager.applyRunSnapshot({
-      routeSessionKey,
-      isHydrating: agent.isHydrating,
-      isSending,
-      isRunning,
-      visibleMessages: agent.visibleMessages,
-      contextWindow: readNcpContextWindowValue(agent.snapshot.contextWindow),
-      sendErrorMessage: lastSendError,
-      materializedSessionKey:
-        agent.snapshot.activeRun?.sessionId ??
-        agent.visibleMessages.find((message) => message.sessionId.trim())?.sessionId ??
-        null,
-    });
-  }, [
-    agent.isHydrating,
-    agent.snapshot.activeRun?.sessionId,
-    agent.snapshot.contextWindow,
-    agent.visibleMessages,
-    isRunning,
-    isSending,
-    lastSendError,
-    presenter,
-    routeSessionKey,
-  ]);
-}
-
 export function NcpChatPage({ view }: ChatPageProps) {
   const appPresenter = useAppPresenter();
   const [presenter] = useState(() => new ChatPresenter(appPresenter));
@@ -149,52 +61,18 @@ export function NcpChatPage({ view }: ChatPageProps) {
 
 function NcpChatPageContent({ view }: ChatPageProps) {
   const presenter = usePresenter();
-  const systemStatus = useSystemStatus();
-  const isRuntimeBlocked = isNcpChatRuntimeBlocked(systemStatus);
   const confirmDialog = useNcpChatUiBindings();
   const routeSelection = useNcpChatRouteSelection();
   const { routeSessionKey, sessionKey } = routeSelection;
   useChatQueryStoreSync({
     sessionKey: sessionKey ?? null,
   });
-  const selectedSession = useNcpChatSelectedSession(sessionKey ?? null);
-  const agent = useNcpSessionConversation(sessionKey);
-  const rawLastSendError =
-    agent.hydrateError?.message ?? agent.snapshot.error?.message ?? null;
-  const filteredLastSendError =
-    systemStatus.phase === "ready" &&
-    isNcpAgentStartupUnavailableErrorMessage(rawLastSendError)
-      ? null
-      : rawLastSendError;
-  const currentSessionRunning = agent.isRunning || selectedSession?.status === "running";
-  const isSending = agent.isSending || currentSessionRunning;
-  const lastSendError =
-    isRuntimeBlocked
-      ? null
-      : systemStatus.phase === "ready"
-      ? filteredLastSendError
-      : resolveNcpChatSendErrorMessage({
-          message: filteredLastSendError,
-          status: systemStatus,
-        });
-  useChatRunRuntimeConnection({
-    agent,
-    sessionKey,
-  });
   useChatSessionSync({
     view,
     routeSessionKey,
     syncRouteSessionSelection:
       presenter.chatSessionListManager.syncRouteSessionSelection,
   });
-  useChatDraftIntentConsumer();
   useUiShowContentEvent();
-  useChatRunSnapshotSync({
-    agent,
-    isRunning: currentSessionRunning,
-    routeSessionKey,
-    lastSendError,
-    isSending,
-  });
   return <ChatPageLayout view={view} confirmDialog={confirmDialog} />;
 }

package/src/features/chat/presenters/chat.presenter.ts

@@ -1,39 +1,22 @@
 import { ChatSessionListManager } from '@/features/chat/managers/chat-session-list.manager';
-import { ChatRunManager } from '@/features/chat/managers/chat-run.manager';
 import { ChatUiManager } from '@/features/chat/managers/chat-ui.manager';
-import { ChatInputManager } from '@/features/chat/managers/chat-input.manager';
 import { ChatQueryManager } from '@/features/chat/managers/chat-query.manager';
 import { ChatThreadManager } from '@/features/chat/managers/chat-thread.manager';
 import type { AppPresenter } from '@/app/presenters/app.presenter';
 
 export class ChatPresenter {
   readonly chatUiManager: ChatUiManager;
-  readonly chatRunManager: ChatRunManager;
   readonly chatSessionListManager: ChatSessionListManager;
-  readonly chatInputManager: ChatInputManager;
   readonly chatQueryManager: ChatQueryManager;
   readonly chatThreadManager: ChatThreadManager;
 
   constructor(appPresenter: AppPresenter) {
     this.chatUiManager = new ChatUiManager(appPresenter.docBrowserManager);
-    this.chatRunManager = new ChatRunManager(this.chatUiManager);
-    this.chatSessionListManager = new ChatSessionListManager(this.chatUiManager, this.chatRunManager);
+    this.chatSessionListManager = new ChatSessionListManager(this.chatUiManager);
     this.chatQueryManager = new ChatQueryManager();
-    this.chatInputManager = new ChatInputManager(
-      this.chatRunManager,
-      this.chatSessionListManager
-    );
     this.chatThreadManager = new ChatThreadManager(
       this.chatUiManager,
-      this.chatSessionListManager,
-      this.chatRunManager
+      this.chatSessionListManager
     );
   }
-
-  startAgentCreationDraft = (prompt: string) => {
-    this.chatSessionListManager.createSession();
-    this.chatSessionListManager.setSelectedAgentId('main');
-    this.chatInputManager.setDraft(prompt);
-    this.chatInputManager.requestComposerFocusAtEnd();
-  };
 }

package/src/features/chat/stores/__tests__/chat-thread.store.test.ts

@@ -22,6 +22,7 @@ function resetChatThreadStore() {
       activeWorkspacePanelKind: null,
       childSessionTabs: [],
       activeChildSessionKey: null,
+      activeSideChatDraft: null,
       workspaceFileTabs: [],
       activeWorkspaceFileKey: null,
       workspaceNavigationHistory: [],
@@ -85,6 +86,36 @@ describe('chat thread workspace panel persistence', () => {
     expect(persisted.state.snapshot.workspaceFileTabs[0].fullLines).toBeUndefined();
   });
 
+  it('does not persist an unmaterialized side chat draft', () => {
+    useChatThreadStore.getState().setSnapshot({
+      workspacePanelParentKey: 'session-1',
+      activeWorkspacePanelKind: 'side-chat-draft',
+      activeSideChatDraft: {
+        draftKey: 'draft-1',
+        parentSessionKey: 'session-1',
+      },
+      workspaceNavigationHistory: [
+        { kind: 'child-session', key: 'child-session-1' },
+        { kind: 'side-chat-draft', key: 'draft-1' },
+      ],
+      workspaceNavigationHistoryIndex: 1,
+    });
+
+    const persisted = JSON.parse(
+      window.localStorage.getItem(chatThreadWorkspaceStorageKey) ?? '{}',
+    );
+
+    expect(persisted.state.snapshot).toMatchObject({
+      workspacePanelParentKey: 'session-1',
+      activeWorkspacePanelKind: null,
+      workspaceNavigationHistory: [
+        { kind: 'child-session', key: 'child-session-1' },
+      ],
+      workspaceNavigationHistoryIndex: 0,
+    });
+    expect(persisted.state.snapshot.activeSideChatDraft).toBeUndefined();
+  });
+
   it('hydrates the workspace panel state and repairs stale active file keys', async () => {
     window.localStorage.setItem(
       chatThreadWorkspaceStorageKey,

package/src/features/chat/stores/chat-thread.store.ts

@@ -14,6 +14,11 @@ export type ChatChildSessionTab = {
   agentId?: string | null;
 };
 
+export type ChatWorkspaceSideChatDraft = {
+  draftKey: string;
+  parentSessionKey: string;
+};
+
 export type ChatWorkspaceFileTab = {
   key: string;
   parentSessionKey: string | null;
@@ -32,17 +37,10 @@ export type ChatWorkspaceFileTab = {
 };
 
 export type ChatWorkspaceNavigationEntry =
-  | {
-      kind: 'child-session';
-      key: string;
-    }
-  | {
-      kind: 'file';
-      key: string;
-    }
-  | {
-      kind: 'cron';
-    };
+  | { kind: 'child-session'; key: string }
+  | { kind: 'side-chat-draft'; key: string }
+  | { kind: 'file'; key: string }
+  | { kind: 'cron' };
 
 export type ChatThreadSnapshot = {
   sessionTypeLabel?: string | null;
@@ -63,9 +61,10 @@ export type ChatThreadSnapshot = {
   parentSessionKey?: string | null;
   parentSessionLabel?: string | null;
   workspacePanelParentKey?: string | null;
-  activeWorkspacePanelKind?: "child-session" | "file" | "cron" | null;
+  activeWorkspacePanelKind?: "child-session" | "side-chat-draft" | "file" | "cron" | null;
   childSessionTabs: ChatChildSessionTab[];
   activeChildSessionKey?: string | null;
+  activeSideChatDraft?: ChatWorkspaceSideChatDraft | null;
   workspaceFileTabs: ChatWorkspaceFileTab[];
   activeWorkspaceFileKey?: string | null;
   workspaceNavigationHistory: ChatWorkspaceNavigationEntry[];
@@ -105,6 +104,8 @@ type PersistedChatWorkspaceSnapshot = Pick<
   | 'workspaceNavigationHistoryIndex'
 >;
 
+type PersistedWorkspacePanelKind = 'child-session' | 'file' | 'cron';
+
 const initialSnapshot: ChatThreadSnapshot = {
   sessionTypeLabel: null,
   sessionTypeIcon: null,
@@ -127,6 +128,7 @@ const initialSnapshot: ChatThreadSnapshot = {
   activeWorkspacePanelKind: null,
   childSessionTabs: [],
   activeChildSessionKey: null,
+  activeSideChatDraft: null,
   workspaceFileTabs: [],
   activeWorkspaceFileKey: null,
   workspaceNavigationHistory: [],
@@ -158,7 +160,7 @@ function normalizeHistoryIndex(value: unknown, maxIndex: number): number {
 
 function isWorkspacePanelKind(
   value: unknown,
-): value is NonNullable<ChatThreadSnapshot['activeWorkspacePanelKind']> {
+): value is PersistedWorkspacePanelKind {
   return value === 'child-session' || value === 'file' || value === 'cron';
 }
 
@@ -344,19 +346,33 @@ export const useChatThreadStore = create<ChatThreadStore>()(
       name: CHAT_THREAD_WORKSPACE_STORAGE_KEY,
       version: CHAT_THREAD_WORKSPACE_STORAGE_VERSION,
       storage: createJSONStorage(() => window.localStorage),
-      partialize: (state): PersistedChatThreadStore => ({
-        snapshot: {
-          workspacePanelParentKey: state.snapshot.workspacePanelParentKey,
-          activeWorkspacePanelKind: state.snapshot.activeWorkspacePanelKind,
-          activeChildSessionKey: state.snapshot.activeChildSessionKey,
-          workspaceFileTabs: state.snapshot.workspaceFileTabs
-            .slice(-CHAT_THREAD_MAX_PERSISTED_WORKSPACE_FILE_TABS)
-            .map(toPersistedWorkspaceFileTab),
-          activeWorkspaceFileKey: state.snapshot.activeWorkspaceFileKey,
-          workspaceNavigationHistory: state.snapshot.workspaceNavigationHistory,
-          workspaceNavigationHistoryIndex: state.snapshot.workspaceNavigationHistoryIndex,
-        }
-      }),
+      partialize: (state): PersistedChatThreadStore => {
+        const workspaceNavigationHistory = state.snapshot.workspaceNavigationHistory
+          .filter((entry) => entry.kind !== 'side-chat-draft');
+        const workspaceNavigationHistoryIndex =
+          workspaceNavigationHistory.length > 0
+            ? Math.min(
+              state.snapshot.workspaceNavigationHistoryIndex,
+              workspaceNavigationHistory.length - 1,
+            )
+            : 0;
+        return {
+          snapshot: {
+            workspacePanelParentKey: state.snapshot.workspacePanelParentKey,
+            activeWorkspacePanelKind:
+              state.snapshot.activeWorkspacePanelKind === 'side-chat-draft'
+                ? null
+                : state.snapshot.activeWorkspacePanelKind,
+            activeChildSessionKey: state.snapshot.activeChildSessionKey,
+            workspaceFileTabs: state.snapshot.workspaceFileTabs
+              .slice(-CHAT_THREAD_MAX_PERSISTED_WORKSPACE_FILE_TABS)
+              .map(toPersistedWorkspaceFileTab),
+            activeWorkspaceFileKey: state.snapshot.activeWorkspaceFileKey,
+            workspaceNavigationHistory,
+            workspaceNavigationHistoryIndex,
+          }
+        };
+      },
       merge: (persistedState, currentState) => {
         const persistedSnapshot = isRecord(persistedState)
           ? persistedState.snapshot

package/src/features/marketplace/components/__tests__/marketplace-page.test.tsx

@@ -236,6 +236,30 @@ describe("MarketplacePage", () => {
     expect(card?.textContent).not.toContain("Skill");
   });
 
+  it("hides redundant skill tags while keeping useful tags", () => {
+    mocks.itemsQuery = createItemsQuery({
+      data: {
+        total: 1,
+        page: 1,
+        pageSize: 20,
+        totalPages: 1,
+        sort: "relevance",
+        items: [
+          createMarketplaceItem({
+            tags: ["skill", "automation", "Skill", "ops"],
+          }),
+        ],
+      } satisfies MarketplaceListView,
+    });
+
+    render(<MarketplacePage forcedType="skills" />);
+
+    expect(screen.queryByText("skill")).toBeNull();
+    expect(screen.queryByText("Skill")).toBeNull();
+    expect(screen.getAllByText("automation").length).toBeGreaterThan(0);
+    expect(screen.getAllByText("ops").length).toBeGreaterThan(0);
+  });
+
   it("does not dim the loaded list during background refresh", () => {
     mocks.itemsQuery = createItemsQuery({
       data: {

package/src/features/marketplace/components/curated-shelves/marketplace-shelf-card.tsx

@@ -46,7 +46,7 @@ export function SkillShelfCard(props: {
         layout === "rail" ? "w-[260px] shrink-0" : "w-full min-w-0",
       )}
     >
-      <div>
+      <div className="flex min-h-0 flex-1 flex-col">
         <div className="mb-2.5 flex min-w-0 items-start gap-2.5">
           <MarketplaceItemIcon name={item.name} fallback={item.install.spec} />
           <div className="min-w-0 flex-1 pt-0.5">
@@ -97,17 +97,22 @@ function formatShelfMeta(item: MarketplaceItemSummary) {
 }
 
 function TagLine({ tags }: { tags: string[] }) {
-  const visibleTags = tags.slice(0, 2);
+  const visibleTags = tags.filter(isVisibleShelfTag).slice(0, 2);
   if (visibleTags.length === 0) {
     return null;
   }
   return (
-    <div className="mt-2 truncate text-[11px] font-medium text-gray-400">
+    <div className="mt-auto truncate pt-2 text-[11px] font-medium text-gray-400">
       {visibleTags.join(" / ")}
     </div>
   );
 }
 
+function isVisibleShelfTag(tag: string) {
+  const normalized = tag.trim().toLowerCase();
+  return normalized.length > 0 && normalized !== "skill";
+}
+
 function formatUpdatedAt(value: string) {
   const date = value.slice(0, 10);
   return date || value;

package/src/features/marketplace/components/marketplace-item-list-view.tsx

@@ -127,8 +127,8 @@ export function MarketplaceItemListView({
       <div
         data-testid={showSkeleton ? "marketplace-list-skeleton" : undefined}
         className={cn(
-          "grid grid-cols-1 gap-3 lg:grid-cols-2 2xl:grid-cols-3",
-          showSkeleton && "min-h-0 flex-1 auto-rows-[104px] content-start",
+          "grid grid-cols-1 gap-2.5 md:grid-cols-2 xl:grid-cols-3",
+          showSkeleton && "min-h-0 flex-1 auto-rows-[156px] content-start",
         )}
       >
         {showSkeleton && <MarketplaceListSkeleton count={36} />}