@beanx/cathygo-web-core 0.1.0 → 0.1.1

package/dist/index.d.ts

@@ -123,11 +123,19 @@ type AgentRunThinking = {
 type ChatAction = {
     type: 'session.created';
     sessionId: string;
+} | {
+    type: 'session.loading';
+    sessionId: string;
 } | {
     type: 'session.loaded';
     sessionId: string;
     messages: ChatMessage$1[];
     activities?: AgentActivity[];
+} | {
+    type: 'session.load.failed';
+    sessionId: string;
+    error: string;
+    code?: string;
 } | {
     type: 'user.sent';
     id: string;
@@ -174,6 +182,9 @@ type CathyGOChatAppProps = {
     gatewayLinked?: boolean;
     model?: GatewayModelStatus;
     agentStatus?: AgentIdentityStatus;
+    activeSessionId?: string;
+    loadingSessionId?: string;
+    debugPanels?: boolean;
     homeAvatarSrc?: string;
     onDraftChange: (value: string) => void;
     onFilesSelected?: (files: File[]) => void;
@@ -184,8 +195,9 @@ type CathyGOChatAppProps = {
     onSuggest?: (text: string) => void;
     onOpenChat: (sessionId: string) => void;
     onNewChat: () => void;
+    onSettingsOpen?: () => void;
 };
-declare function CathyGOChatApp({ screen, chat, chats, draft, attachments, attachmentPolicy, composerError, busy, connectionStatus, gatewayLinked, model, agentStatus, homeAvatarSrc, onDraftChange, onFilesSelected, onRemoveAttachment, onSendMessage, onSendHomeMessage, onAbort, onSuggest, onOpenChat, onNewChat, }: CathyGOChatAppProps): react.JSX.Element;
+declare function CathyGOChatApp({ screen, chat, chats, draft, attachments, attachmentPolicy, composerError, busy, connectionStatus, gatewayLinked, model, agentStatus, activeSessionId, loadingSessionId, debugPanels, homeAvatarSrc, onDraftChange, onFilesSelected, onRemoveAttachment, onSendMessage, onSendHomeMessage, onAbort, onSuggest, onOpenChat, onNewChat, onSettingsOpen, }: CathyGOChatAppProps): react.JSX.Element;
 
 type UseCathyGOChatResult = {
     chat: ChatState;
@@ -246,8 +258,9 @@ type ChatTopBarProps = {
     debugUI?: boolean;
     canAbort?: boolean;
     onAbort?: () => void;
+    onSettingsOpen?: () => void;
 };
-declare function ChatTopBar({ agentStatus, connectionStatus, gatewayLinked, model, debugUI, canAbort, onAbort, }: ChatTopBarProps): react.JSX.Element;
+declare function ChatTopBar({ agentStatus, connectionStatus, gatewayLinked, model, debugUI, canAbort, onAbort, onSettingsOpen, }: ChatTopBarProps): react.JSX.Element;
 
 type ChatTranscriptProps = {
     messages: ChatMessage$1[];
@@ -325,19 +338,22 @@ interface ChatHomeViewProps {
     model?: GatewayModelStatus;
     agentStatus?: AgentIdentityStatus;
     avatarSrc?: string;
+    onSettingsOpen?: () => void;
     onDraftChange: (value: string) => void;
     onFilesSelected?: (files: File[]) => void;
     onRemoveAttachment?: (id: string) => void;
     onSend: (modeId: ChatHomeModeId) => void;
 }
-declare function ChatHomeView({ draft, attachments, attachmentPolicy, error, busy, connectionStatus, gatewayLinked, model, agentStatus, avatarSrc, onDraftChange, onFilesSelected, onRemoveAttachment, onSend, }: ChatHomeViewProps): react.JSX.Element;
+declare function ChatHomeView({ draft, attachments, attachmentPolicy, error, busy, connectionStatus, gatewayLinked, model, agentStatus, avatarSrc, onSettingsOpen, onDraftChange, onFilesSelected, onRemoveAttachment, onSend, }: ChatHomeViewProps): react.JSX.Element;
 
 interface ChatListViewProps {
     chats: ConversationSummary[];
+    activeSessionId?: string;
+    loadingSessionId?: string;
     onOpen: (sessionId: string) => void;
     onNewChat: () => void;
 }
-declare function ChatListView({ chats, onOpen, onNewChat }: ChatListViewProps): react.JSX.Element;
+declare function ChatListView({ chats, activeSessionId, loadingSessionId, onOpen, onNewChat, }: ChatListViewProps): react.JSX.Element;
 
 interface ChatViewProps {
     chat: ChatState;
@@ -345,18 +361,21 @@ interface ChatViewProps {
     attachments?: PendingComposerAttachment[];
     attachmentPolicy?: ComposerAttachmentPolicy;
     composerError?: string;
+    busy?: boolean;
     connectionStatus: string;
     gatewayLinked?: boolean;
     model?: GatewayModelStatus;
     agentStatus?: AgentIdentityStatus;
+    debugPanels?: boolean;
     onDraftChange: (value: string) => void;
     onFilesSelected?: (files: File[]) => void;
     onRemoveAttachment?: (id: string) => void;
     onSend: () => void;
     onAbort: () => void;
     onSuggest?: (text: string) => void;
+    onSettingsOpen?: () => void;
 }
-declare function ChatView({ chat, draft, attachments, attachmentPolicy, composerError, connectionStatus, gatewayLinked, model, agentStatus, onDraftChange, onFilesSelected, onRemoveAttachment, onSend, onAbort, onSuggest, }: ChatViewProps): react.JSX.Element;
+declare function ChatView({ chat, draft, attachments, attachmentPolicy, composerError, busy: externalBusy, connectionStatus, gatewayLinked, model, agentStatus, debugPanels, onDraftChange, onFilesSelected, onRemoveAttachment, onSend, onAbort, onSuggest, onSettingsOpen, }: ChatViewProps): react.JSX.Element;
 
 declare function modelStatusText(model: GatewayModelStatus): string;
 

package/dist/index.js

@@ -1,15 +1,6 @@
 // src/features/chat/ChatHomeView.tsx
 import { useRef as useRef2, useState as useState2 } from "react";
 
-// src/chat-ui/agentIdentity.ts
-function agentDisplayName(status) {
-  return status?.display_name?.trim() || status?.agent_id?.trim() || "CathyGO Agent";
-}
-function agentShortId(status) {
-  const value = status?.agent_short_id?.trim();
-  return value || void 0;
-}
-
 // src/chat-ui/icons.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
 function IconNewChat({ className }) {
@@ -773,6 +764,15 @@ function IconSend({ className }) {
   );
 }
 
+// src/chat-ui/agentIdentity.ts
+function agentDisplayName(status) {
+  return status?.display_name?.trim() || status?.agent_id?.trim() || "CathyGO Agent";
+}
+function agentShortId(status) {
+  const value = status?.agent_short_id?.trim();
+  return value || void 0;
+}
+
 // src/chat-ui/components/ChatAgentIdentity.tsx
 import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
 function ChatAgentIdentity({ agentStatus }) {
@@ -816,7 +816,8 @@ function ChatTopBar({
   model,
   debugUI,
   canAbort,
-  onAbort
+  onAbort,
+  onSettingsOpen
 }) {
   const tone = connectionTone(connectionStatus, gatewayLinked);
   const statusLabel = gatewayLinked ? "Connected" : connectionStatus;
@@ -833,6 +834,17 @@ function ChatTopBar({
         }
       ),
       debugUI ? /* @__PURE__ */ jsx3("span", { className: "chat-topbar-debug", children: "Debug" }) : null,
+      onSettingsOpen ? /* @__PURE__ */ jsx3(
+        "button",
+        {
+          "aria-label": "\u6253\u5F00\u8BBE\u7F6E",
+          className: "chat-topbar-icon-btn",
+          onClick: onSettingsOpen,
+          title: "\u8BBE\u7F6E",
+          type: "button",
+          children: /* @__PURE__ */ jsx3(IconSettings, {})
+        }
+      ) : null,
       canAbort ? /* @__PURE__ */ jsx3("button", { className: "chat-topbar-abort", onClick: onAbort, type: "button", children: "\u505C\u6B62" }) : null
     ] })
   ] });
@@ -1108,6 +1120,7 @@ function ChatHomeView({
   model,
   agentStatus,
   avatarSrc,
+  onSettingsOpen,
   onDraftChange,
   onFilesSelected,
   onRemoveAttachment,
@@ -1130,7 +1143,8 @@ function ChatHomeView({
         connectionStatus,
         gatewayLinked,
         model,
-        agentStatus
+        agentStatus,
+        onSettingsOpen
       }
     ),
     /* @__PURE__ */ jsxs5("div", { className: "chat-home-center", children: [
@@ -1188,29 +1202,37 @@ function stripMathForPreview(text, maxLen = 80) {
 
 // src/features/chat/ChatListView.tsx
 import { jsx as jsx6, jsxs as jsxs6 } from "react/jsx-runtime";
-function ChatListView({ chats, onOpen, onNewChat }) {
+function ChatListView({
+  chats,
+  activeSessionId,
+  loadingSessionId,
+  onOpen,
+  onNewChat
+}) {
   return /* @__PURE__ */ jsxs6("section", { className: "cathygo-chat-panel list-workspace", children: [
     /* @__PURE__ */ jsxs6("header", { className: "page-topbar", children: [
       /* @__PURE__ */ jsx6("h1", { className: "page-topbar-title", children: "\u5BF9\u8BDD\u5386\u53F2" }),
       /* @__PURE__ */ jsx6("button", { className: "primary-action", onClick: onNewChat, type: "button", children: "\u65B0\u5BF9\u8BDD" })
     ] }),
-    /* @__PURE__ */ jsx6("div", { className: "chat-column list-column", children: chats.length ? /* @__PURE__ */ jsx6("div", { className: "history-list", children: chats.map((chat) => /* @__PURE__ */ jsxs6(
-      "button",
-      {
-        className: "history-row",
-        onClick: () => onOpen(chat.session_id),
-        type: "button",
-        children: [
-          /* @__PURE__ */ jsx6("strong", { children: chat.title }),
-          /* @__PURE__ */ jsx6("span", { children: chat.preview ? stripMathForPreview(chat.preview, 120) : "\u6682\u65E0\u9884\u89C8" }),
-          /* @__PURE__ */ jsxs6("small", { children: [
-            chat.message_count,
-            " \u6761\u6D88\u606F"
-          ] })
-        ]
-      },
-      chat.session_id
-    )) }) : /* @__PURE__ */ jsx6("p", { className: "empty", children: "\u6682\u65E0\u5BF9\u8BDD\u3002\u521B\u5EFA\u65B0\u5BF9\u8BDD\u540E\u4F1A\u51FA\u73B0\u5728\u8FD9\u91CC\u3002" }) })
+    /* @__PURE__ */ jsx6("div", { className: "chat-column list-column", children: chats.length ? /* @__PURE__ */ jsx6("div", { className: "history-list", children: chats.map((chat) => {
+      const active = chat.session_id === activeSessionId;
+      const loading = chat.session_id === loadingSessionId;
+      return /* @__PURE__ */ jsxs6(
+        "button",
+        {
+          "aria-current": active ? "true" : void 0,
+          className: `history-row${active ? " active" : ""}${loading ? " loading" : ""}`,
+          onClick: () => onOpen(chat.session_id),
+          type: "button",
+          children: [
+            /* @__PURE__ */ jsx6("strong", { children: chat.title }),
+            /* @__PURE__ */ jsx6("span", { children: chat.preview ? stripMathForPreview(chat.preview, 120) : "\u6682\u65E0\u9884\u89C8" }),
+            /* @__PURE__ */ jsx6("small", { children: loading ? "\u6B63\u5728\u6253\u5F00" : `${chat.message_count} \u6761\u6D88\u606F` })
+          ]
+        },
+        chat.session_id
+      );
+    }) }) : /* @__PURE__ */ jsx6("p", { className: "empty", children: "\u6682\u65E0\u5BF9\u8BDD\u3002\u521B\u5EFA\u65B0\u5BF9\u8BDD\u540E\u4F1A\u51FA\u73B0\u5728\u8FD9\u91CC\u3002" }) })
   ] });
 }
 
@@ -1631,22 +1653,26 @@ function ChatView({
   attachments,
   attachmentPolicy,
   composerError,
+  busy: externalBusy,
   connectionStatus,
   gatewayLinked,
   model,
   agentStatus,
+  debugPanels = true,
   onDraftChange,
   onFilesSelected,
   onRemoveAttachment,
   onSend,
   onAbort,
-  onSuggest
+  onSuggest,
+  onSettingsOpen
 }) {
-  const busy = Boolean(chat.activeTurnId);
-  const ready = Boolean(chat.sessionId);
+  const loadingSession = chat.status === "Loading";
+  const busy = Boolean(chat.activeTurnId) || Boolean(externalBusy) || loadingSession;
+  const ready = Boolean(chat.sessionId) && !loadingSession;
   const usingMock = model?.provider === "mock";
   const modelLabel = model ? model.model || model.display_name || model.provider : "loading model status";
-  const debugUI = isDebugUIEnabled();
+  const debugUI = debugPanels && isDebugUIEnabled();
   return /* @__PURE__ */ jsxs11("section", { className: "cathygo-chat-panel chat-workspace", children: [
     /* @__PURE__ */ jsx13(
       ChatTopBar,
@@ -1657,7 +1683,8 @@ function ChatView({
         agentStatus,
         debugUI,
         canAbort: Boolean(chat.activeTurnId),
-        onAbort
+        onAbort,
+        onSettingsOpen
       }
     ),
     debugUI ? /* @__PURE__ */ jsxs11("div", { className: "chat-debug-panels", children: [
@@ -1681,7 +1708,7 @@ function ChatView({
       )
     ] }) : null,
     /* @__PURE__ */ jsxs11("div", { className: "chat-main", children: [
-      /* @__PURE__ */ jsx13(
+      loadingSession ? /* @__PURE__ */ jsx13(ChatSessionLoading, {}) : /* @__PURE__ */ jsx13(
         ChatTranscript,
         {
           activeTurnId: chat.activeTurnId,
@@ -1691,6 +1718,7 @@ function ChatView({
           onSuggest: ready && !busy ? onSuggest : void 0
         }
       ),
+      !loadingSession && chat.status === "Error" && chat.error ? /* @__PURE__ */ jsx13("p", { className: "chat-session-error", children: chat.error }) : null,
       /* @__PURE__ */ jsx13(
         MessageComposer,
         {
@@ -1708,6 +1736,17 @@ function ChatView({
     ] })
   ] });
 }
+function ChatSessionLoading() {
+  return /* @__PURE__ */ jsx13("div", { className: "chat-transcript-wrap", children: /* @__PURE__ */ jsx13("section", { className: "chat-transcript", "aria-busy": "true", "aria-label": "\u6B63\u5728\u52A0\u8F7D\u4F1A\u8BDD", children: /* @__PURE__ */ jsxs11("div", { className: "chat-column session-loading", children: [
+    /* @__PURE__ */ jsx13("div", { className: "session-loading-title" }),
+    /* @__PURE__ */ jsx13("div", { className: "session-loading-line wide" }),
+    /* @__PURE__ */ jsx13("div", { className: "session-loading-line" }),
+    /* @__PURE__ */ jsxs11("div", { className: "session-loading-card", children: [
+      /* @__PURE__ */ jsx13("div", {}),
+      /* @__PURE__ */ jsx13("div", {})
+    ] })
+  ] }) }) });
+}
 
 // src/CathyGOChatApp.tsx
 import { jsx as jsx14 } from "react/jsx-runtime";
@@ -1724,6 +1763,9 @@ function CathyGOChatApp({
   gatewayLinked,
   model,
   agentStatus,
+  activeSessionId,
+  loadingSessionId,
+  debugPanels = true,
   homeAvatarSrc,
   onDraftChange,
   onFilesSelected,
@@ -1733,10 +1775,20 @@ function CathyGOChatApp({
   onAbort,
   onSuggest,
   onOpenChat,
-  onNewChat
+  onNewChat,
+  onSettingsOpen
 }) {
   if (screen === "history") {
-    return /* @__PURE__ */ jsx14(ChatListView, { chats, onOpen: onOpenChat, onNewChat });
+    return /* @__PURE__ */ jsx14(
+      ChatListView,
+      {
+        activeSessionId,
+        chats,
+        loadingSessionId,
+        onOpen: onOpenChat,
+        onNewChat
+      }
+    );
   }
   if (screen === "home") {
     return /* @__PURE__ */ jsx14(
@@ -1752,6 +1804,7 @@ function CathyGOChatApp({
         gatewayLinked,
         model,
         agentStatus,
+        onSettingsOpen,
         onDraftChange,
         onFilesSelected,
         onRemoveAttachment,
@@ -1766,17 +1819,20 @@ function CathyGOChatApp({
       draft,
       attachments,
       attachmentPolicy,
+      busy,
       composerError,
       connectionStatus,
       gatewayLinked,
       model,
       agentStatus,
+      debugPanels,
       onDraftChange,
       onFilesSelected,
       onRemoveAttachment,
       onSend: onSendMessage,
       onAbort,
-      onSuggest
+      onSuggest,
+      onSettingsOpen
     }
   );
 }
@@ -1805,6 +1861,19 @@ function reduceChat(state, action) {
       errorCode: void 0
     };
   }
+  if (action.type === "session.loading") {
+    return {
+      ...state,
+      sessionId: action.sessionId,
+      activeTurnId: void 0,
+      messages: [],
+      activitiesByTurnId: {},
+      progressByTurnId: {},
+      status: "Loading",
+      error: void 0,
+      errorCode: void 0
+    };
+  }
   if (action.type === "session.loaded") {
     return {
       ...state,
@@ -1818,6 +1887,17 @@ function reduceChat(state, action) {
       errorCode: void 0
     };
   }
+  if (action.type === "session.load.failed") {
+    return {
+      ...state,
+      sessionId: action.sessionId,
+      activeTurnId: void 0,
+      progressByTurnId: {},
+      status: "Error",
+      error: action.error,
+      errorCode: action.code
+    };
+  }
   if (action.type === "user.sent") {
     return {
       ...state,

package/dist/styles.css

@@ -240,6 +240,25 @@
   padding: 5px 12px;
 }
 
+.chat-topbar-icon-btn {
+  align-items: center;
+  background: transparent;
+  border: 1px solid var(--border-subtle);
+  border-radius: 50%;
+  color: var(--text-muted);
+  cursor: pointer;
+  display: inline-flex;
+  flex-shrink: 0;
+  height: 32px;
+  justify-content: center;
+  width: 32px;
+}
+
+.chat-topbar-icon-btn:hover {
+  background: var(--bg-hover);
+  color: var(--text-primary);
+}
+
 .chat-topbar-abort:hover {
   background: var(--bg-hover);
 }
@@ -469,6 +488,68 @@
   background: var(--bg-hover);
 }
 
+.session-loading {
+  gap: 14px;
+  margin-top: 72px;
+  max-width: 40rem;
+}
+
+.session-loading-title,
+.session-loading-line,
+.session-loading-card {
+  animation: session-loading-pulse 1.2s ease-in-out infinite;
+  background: linear-gradient(90deg, #ececf1 0%, #f7f7f8 48%, #ececf1 100%);
+  background-size: 200% 100%;
+  border-radius: 8px;
+}
+
+.session-loading-title {
+  height: 28px;
+  width: 180px;
+}
+
+.session-loading-line {
+  height: 16px;
+  width: 68%;
+}
+
+.session-loading-line.wide {
+  width: 92%;
+}
+
+.session-loading-card {
+  border-radius: 12px;
+  display: grid;
+  gap: 12px;
+  margin-left: auto;
+  min-height: 132px;
+  padding: 18px;
+  width: min(360px, 80%);
+}
+
+.session-loading-card div {
+  background: rgba(255, 255, 255, 0.65);
+  border-radius: 7px;
+}
+
+.chat-session-error {
+  color: #b42318;
+  font-size: 14px;
+  margin: 0 auto 8px;
+  max-width: var(--chat-column-width);
+  padding: 0 20px;
+  width: 100%;
+}
+
+@keyframes session-loading-pulse {
+  0% {
+    background-position: 100% 0;
+  }
+  100% {
+    background-position: -100% 0;
+  }
+}
+
 .empty-chat h2,
 .empty-state h1 {
   color: #1f2937;
@@ -1293,10 +1374,19 @@
   width: 100%;
 }
 
-.history-row:hover {
+.history-row:hover,
+.history-row.active {
   background: var(--bg-hover);
 }
 
+.history-row.active {
+  box-shadow: inset 3px 0 0 #2563eb;
+}
+
+.history-row.loading small {
+  color: #2563eb;
+}
+
 .list-surface {
   align-content: start;
   display: grid;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@beanx/cathygo-web-core",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "type": "module",
   "files": [
     "dist"