@lvce-editor/chat-view 2.0.0 → 2.1.0

package/dist/chatViewWorkerMain.js

@@ -1027,7 +1027,7 @@ const createMockRpc = ({
 };
 
 const rpcs = Object.create(null);
-const set$3 = (id, rpc) => {
+const set$4 = (id, rpc) => {
   rpcs[id] = rpc;
 };
 const get$2 = id => {
@@ -1060,7 +1060,7 @@ const create$2 = rpcId => {
       const mockRpc = createMockRpc({
         commandMap
       });
-      set$3(rpcId, mockRpc);
+      set$4(rpcId, mockRpc);
       // @ts-ignore
       mockRpc[Symbol.dispose] = () => {
         remove(rpcId);
@@ -1069,11 +1069,15 @@ const create$2 = rpcId => {
       return mockRpc;
     },
     set(rpc) {
-      set$3(rpcId, rpc);
+      set$4(rpcId, rpc);
     }
   };
 };
 
+const {
+  set: set$3
+} = create$2(6002);
+
 const ClientX = 'event.clientX';
 const ClientY = 'event.clientY';
 const Key = 'event.key';
@@ -1310,6 +1314,9 @@ const chats = () => {
 const newChat = () => {
   return i18nString('New Chat');
 };
+const debug = () => {
+  return i18nString('Debug');
+};
 const backToChats = () => {
   return i18nString('Back to chats');
 };
@@ -2006,7 +2013,7 @@ const now$1 = () => {
   return new Date().toISOString();
 };
 const isSameMessage$1 = (a, b) => {
-  return a.id === b.id && a.inProgress === b.inProgress && a.role === b.role && a.text === b.text && a.time === b.time;
+  return a.id === b.id && a.inProgress === b.inProgress && a.role === b.role && a.text === b.text && a.time === b.time && JSON.stringify(a.toolCalls || []) === JSON.stringify(b.toolCalls || []);
 };
 const canAppendMessages$1 = (previousMessages, nextMessages) => {
   if (nextMessages.length < previousMessages.length) {
@@ -2078,6 +2085,7 @@ const getMutationEvents$1 = (previous, next) => {
           text: nextMessage.text,
           time: nextMessage.time,
           timestamp,
+          toolCalls: nextMessage.toolCalls,
           type: 'chat-message-updated'
         });
       }
@@ -2132,7 +2140,8 @@ const replaySession$1 = (id, summary, events) => {
           ...message,
           inProgress: event.inProgress,
           text: event.text,
-          time: event.time
+          time: event.time,
+          toolCalls: event.toolCalls
         };
       });
       continue;
@@ -2311,7 +2320,7 @@ const now = () => {
   return new Date().toISOString();
 };
 const isSameMessage = (a, b) => {
-  return a.id === b.id && a.inProgress === b.inProgress && a.role === b.role && a.text === b.text && a.time === b.time;
+  return a.id === b.id && a.inProgress === b.inProgress && a.role === b.role && a.text === b.text && a.time === b.time && JSON.stringify(a.toolCalls || []) === JSON.stringify(b.toolCalls || []);
 };
 const canAppendMessages = (previousMessages, nextMessages) => {
   if (nextMessages.length < previousMessages.length) {
@@ -2383,6 +2392,7 @@ const getMutationEvents = (previous, next) => {
           text: nextMessage.text,
           time: nextMessage.time,
           timestamp,
+          toolCalls: nextMessage.toolCalls,
           type: 'chat-message-updated'
         });
       }
@@ -2431,7 +2441,8 @@ const replaySession = (id, title, events) => {
           ...message,
           inProgress: event.inProgress,
           text: event.text,
-          time: event.time
+          time: event.time,
+          toolCalls: event.toolCalls
         };
       });
       continue;
@@ -3084,7 +3095,59 @@ const parseSseEvent = eventChunk => {
   }
   return dataLines;
 };
-const parseOpenApiStream = async (response, onTextChunk) => {
+const updateToolCallAccumulator = (accumulator, chunk) => {
+  let changed = false;
+  const nextAccumulator = {
+    ...accumulator
+  };
+  for (const item of chunk) {
+    if (!item || typeof item !== 'object') {
+      continue;
+    }
+    const index = Reflect.get(item, 'index');
+    if (typeof index !== 'number') {
+      continue;
+    }
+    const current = nextAccumulator[index] || {
+      arguments: '',
+      name: ''
+    };
+    const id = Reflect.get(item, 'id');
+    const toolFunction = Reflect.get(item, 'function');
+    let {
+      name
+    } = current;
+    let args = current.arguments;
+    if (toolFunction && typeof toolFunction === 'object') {
+      const deltaName = Reflect.get(toolFunction, 'name');
+      const deltaArguments = Reflect.get(toolFunction, 'arguments');
+      if (typeof deltaName === 'string' && deltaName) {
+        name = deltaName;
+      }
+      if (typeof deltaArguments === 'string') {
+        args += deltaArguments;
+      }
+    }
+    const next = {
+      arguments: args,
+      id: typeof id === 'string' ? id : current.id,
+      name
+    };
+    if (JSON.stringify(next) !== JSON.stringify(current)) {
+      nextAccumulator[index] = next;
+      changed = true;
+    }
+  }
+  if (!changed) {
+    return undefined;
+  }
+  const toolCalls = Object.entries(nextAccumulator).toSorted((a, b) => Number(a[0]) - Number(b[0])).map(entry => entry[1]).filter(toolCall => !!toolCall.name);
+  return {
+    nextAccumulator,
+    toolCalls
+  };
+};
+const parseOpenApiStream = async (response, onTextChunk, onToolCallsChunk, onDataEvent, onEventStreamFinished) => {
   if (!response.body) {
     return {
       details: 'request-failed',
@@ -3096,6 +3159,7 @@ const parseOpenApiStream = async (response, onTextChunk) => {
   let remainder = '';
   let text = '';
   let done = false;
+  let toolCallAccumulator = {};
   while (!done) {
     const {
       done: streamDone,
@@ -3121,6 +3185,9 @@ const parseOpenApiStream = async (response, onTextChunk) => {
       }
       for (const line of dataLines) {
         if (line === '[DONE]') {
+          if (onEventStreamFinished) {
+            await onEventStreamFinished();
+          }
           done = true;
           break;
         }
@@ -3133,6 +3200,9 @@ const parseOpenApiStream = async (response, onTextChunk) => {
         if (!parsed || typeof parsed !== 'object') {
           continue;
         }
+        if (onDataEvent) {
+          await onDataEvent(parsed);
+        }
         const choices = Reflect.get(parsed, 'choices');
         if (!Array.isArray(choices)) {
           continue;
@@ -3145,6 +3215,14 @@ const parseOpenApiStream = async (response, onTextChunk) => {
         if (!delta || typeof delta !== 'object') {
           continue;
         }
+        const toolCalls = Reflect.get(delta, 'tool_calls');
+        const updatedToolCallResult = Array.isArray(toolCalls) ? updateToolCallAccumulator(toolCallAccumulator, toolCalls) : undefined;
+        if (updatedToolCallResult) {
+          toolCallAccumulator = updatedToolCallResult.nextAccumulator;
+        }
+        if (updatedToolCallResult && onToolCallsChunk) {
+          await onToolCallsChunk(updatedToolCallResult.toolCalls);
+        }
         const content = Reflect.get(delta, 'content');
         const chunkText = getStreamChunkText(content);
         if (!chunkText) {
@@ -3161,6 +3239,9 @@ const parseOpenApiStream = async (response, onTextChunk) => {
     const dataLines = parseSseEvent(remainder);
     for (const line of dataLines) {
       if (line === '[DONE]') {
+        if (onEventStreamFinished) {
+          await onEventStreamFinished();
+        }
         continue;
       }
       let parsed;
@@ -3172,6 +3253,9 @@ const parseOpenApiStream = async (response, onTextChunk) => {
       if (!parsed || typeof parsed !== 'object') {
         continue;
       }
+      if (onDataEvent) {
+        await onDataEvent(parsed);
+      }
       const choices = Reflect.get(parsed, 'choices');
       if (!Array.isArray(choices)) {
         continue;
@@ -3184,6 +3268,14 @@ const parseOpenApiStream = async (response, onTextChunk) => {
       if (!delta || typeof delta !== 'object') {
         continue;
       }
+      const toolCalls = Reflect.get(delta, 'tool_calls');
+      const updatedToolCallResult = Array.isArray(toolCalls) ? updateToolCallAccumulator(toolCallAccumulator, toolCalls) : undefined;
+      if (updatedToolCallResult) {
+        toolCallAccumulator = updatedToolCallResult.nextAccumulator;
+      }
+      if (updatedToolCallResult && onToolCallsChunk) {
+        await onToolCallsChunk(updatedToolCallResult.toolCalls);
+      }
       const content = Reflect.get(delta, 'content');
       const chunkText = getStreamChunkText(content);
       if (!chunkText) {
@@ -3226,7 +3318,10 @@ const getOpenApiErrorDetails = async response => {
 const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApiApiBaseUrl, assetDir, platform, options) => {
   const {
     includeObfuscation = false,
+    onDataEvent,
+    onEventStreamFinished,
     onTextChunk,
+    onToolCallsChunk,
     stream
   } = options ?? {
     stream: false
@@ -3271,7 +3366,7 @@ const getOpenApiAssistantText = async (messages, modelId, openApiApiKey, openApi
       };
     }
     if (stream) {
-      return parseOpenApiStream(response, onTextChunk);
+      return parseOpenApiStream(response, onTextChunk, onToolCallsChunk, onDataEvent, onEventStreamFinished);
     }
     let parsed;
     try {
@@ -3685,11 +3780,14 @@ const isOpenRouterModel = (selectedModelId, models) => {
 
 const getAiResponse = async ({
   assetDir,
+  messageId,
   messages,
   mockApiCommandId,
   models,
-  nextMessageId,
+  onDataEvent,
+  onEventStreamFinished,
   onTextChunk,
+  onToolCallsChunk,
   openApiApiBaseUrl,
   openApiApiKey,
   openRouterApiBaseUrl,
@@ -3718,7 +3816,10 @@ const getAiResponse = async ({
     } else if (openApiApiKey) {
       const result = await getOpenApiAssistantText(messages, getOpenApiModelId(selectedModelId), openApiApiKey, openApiApiBaseUrl, assetDir, platform, {
         includeObfuscation: passIncludeObfuscation,
+        onDataEvent,
+        onEventStreamFinished,
         onTextChunk,
+        onToolCallsChunk,
         stream: streamingEnabled
       });
       if (result.type === 'success') {
@@ -3766,7 +3867,7 @@ const getAiResponse = async ({
     minute: '2-digit'
   });
   return {
-    id: `message-${nextMessageId}`,
+    id: messageId || crypto.randomUUID(),
     role: 'assistant',
     text,
     time: assistantTime
@@ -3821,7 +3922,6 @@ const handleClickSaveOpenApiApiKey = async state => {
     messages: retryMessages,
     mockApiCommandId: updatedState.mockApiCommandId,
     models: updatedState.models,
-    nextMessageId: updatedState.nextMessageId,
     openApiApiBaseUrl: updatedState.openApiApiBaseUrl,
     openApiApiKey: updatedState.openApiApiKey,
     openRouterApiBaseUrl: updatedState.openRouterApiBaseUrl,
@@ -3901,7 +4001,6 @@ const handleClickSaveOpenRouterApiKey = async state => {
     messages: retryMessages,
     mockApiCommandId: updatedState.mockApiCommandId,
     models: updatedState.models,
-    nextMessageId: updatedState.nextMessageId,
     openApiApiBaseUrl: updatedState.openApiApiBaseUrl,
     openApiApiKey: updatedState.openApiApiKey,
     openRouterApiBaseUrl: updatedState.openRouterApiBaseUrl,
@@ -3958,6 +4057,25 @@ const updateMessageTextInSelectedSession = (sessions, selectedSessionId, message
     };
   });
 };
+const updateMessageToolCallsInSelectedSession = (sessions, selectedSessionId, messageId, toolCalls) => {
+  return sessions.map(session => {
+    if (session.id !== selectedSessionId) {
+      return session;
+    }
+    return {
+      ...session,
+      messages: session.messages.map(message => {
+        if (message.id !== messageId) {
+          return message;
+        }
+        return {
+          ...message,
+          toolCalls
+        };
+      })
+    };
+  });
+};
 const handleTextChunkFunction = async (uid, assistantMessageId, chunk, handleTextChunkState) => {
   const selectedSession = handleTextChunkState.latestState.sessions.find(session => session.id === handleTextChunkState.latestState.selectedSessionId);
   if (!selectedSession) {
@@ -3994,6 +4112,34 @@ const handleTextChunkFunction = async (uid, assistantMessageId, chunk, handleTex
     previousState: nextState
   };
 };
+const handleToolCallsChunkFunction = async (uid, assistantMessageId, toolCalls, handleTextChunkState) => {
+  const selectedSession = handleTextChunkState.latestState.sessions.find(session => session.id === handleTextChunkState.latestState.selectedSessionId);
+  if (!selectedSession) {
+    return {
+      latestState: handleTextChunkState.latestState,
+      previousState: handleTextChunkState.previousState
+    };
+  }
+  const assistantMessage = selectedSession.messages.find(message => message.id === assistantMessageId);
+  if (!assistantMessage) {
+    return {
+      latestState: handleTextChunkState.latestState,
+      previousState: handleTextChunkState.previousState
+    };
+  }
+  const updatedSessions = updateMessageToolCallsInSelectedSession(handleTextChunkState.latestState.sessions, handleTextChunkState.latestState.selectedSessionId, assistantMessageId, toolCalls);
+  const nextState = {
+    ...handleTextChunkState.latestState,
+    sessions: updatedSessions
+  };
+  set(uid, handleTextChunkState.previousState, nextState);
+  // @ts-ignore
+  await invoke('Chat.rerender');
+  return {
+    latestState: nextState,
+    previousState: nextState
+  };
+};
 
 const appendMessageToSelectedSession = (sessions, selectedSessionId, message) => {
   return sessions.map(session => {
@@ -4034,13 +4180,14 @@ const handleSubmit = async state => {
     hour: '2-digit',
     minute: '2-digit'
   });
+  const userMessageId = crypto.randomUUID();
   const userMessage = {
-    id: `message-${nextMessageId}`,
+    id: userMessageId,
     role: 'user',
     text: userText,
     time: userTime
   };
-  const assistantMessageId = `message-${nextMessageId + 1}`;
+  const assistantMessageId = crypto.randomUUID();
   const assistantTime = new Date().toLocaleTimeString([], {
     hour: '2-digit',
     minute: '2-digit'
@@ -4127,11 +4274,30 @@ const handleSubmit = async state => {
   } : undefined;
   const assistantMessage = await getAiResponse({
     assetDir,
+    messageId: assistantMessageId,
     messages,
     mockApiCommandId,
     models,
-    nextMessageId: optimisticState.nextMessageId,
+    onDataEvent: async value => {
+      await appendChatViewEvent({
+        sessionId: optimisticState.selectedSessionId,
+        timestamp: new Date().toISOString(),
+        type: 'data-event',
+        value
+      });
+    },
+    onEventStreamFinished: async () => {
+      await appendChatViewEvent({
+        sessionId: optimisticState.selectedSessionId,
+        timestamp: new Date().toISOString(),
+        type: 'event-stream-finished',
+        value: '[DONE]'
+      });
+    },
     onTextChunk: handleTextChunkFunctionRef,
+    onToolCallsChunk: async toolCalls => {
+      handleTextChunkState = await handleToolCallsChunkFunction(state.uid, assistantMessageId, toolCalls, handleTextChunkState);
+    },
     openApiApiBaseUrl,
     openApiApiKey,
     openRouterApiBaseUrl,
@@ -4177,6 +4343,7 @@ const Send = 'send';
 const Back = 'back';
 const Model = 'model';
 const CreateSession = 'create-session';
+const SessionDebug = 'session-debug';
 const Settings = 'settings';
 const CloseChat = 'close-chat';
 const SessionDelete = 'SessionDelete';
@@ -4321,6 +4488,11 @@ const handleClickNew = async state => {
   return createSession(state);
 };
 
+const handleClickSessionDebug = async state => {
+  await invoke('Main.openUri', `chat-debug://${state.selectedSessionId}`);
+  return state;
+};
+
 const handleClickSettings = async () => {
   // TODO
   await invoke('Main.openUri', 'app://settings.json');
@@ -4377,7 +4549,7 @@ const handleInputFocus = async (state, name) => {
       focused: true
     };
   }
-  if (name === CreateSession || name === Settings || name === CloseChat || name === Back) {
+  if (name === CreateSession || name === SessionDebug || name === Settings || name === CloseChat || name === Back) {
     return {
       ...state,
       focus: 'header',
@@ -4866,6 +5038,7 @@ const HandleSubmit = 19;
 const HandleModelChange = 20;
 const HandleChatListScroll = 21;
 const HandleMessagesScroll = 22;
+const HandleClickSessionDebug = 23;
 
 const getModelLabel = model => {
   if (model.provider === 'openRouter') {
@@ -5013,6 +5186,11 @@ const getHeaderActionVirtualDom = item => {
 
 const getChatHeaderActionsDom = () => {
   const items = [{
+    icon: 'MaskIcon MaskIconDebugPause',
+    name: SessionDebug,
+    onClick: HandleClickSessionDebug,
+    title: debug()
+  }, {
     icon: 'MaskIcon MaskIconAdd',
     name: CreateSession,
     onClick: HandleClickNew,
@@ -5117,6 +5295,126 @@ const getMissingOpenRouterApiKeyDom = (openRouterApiKeyInput, openRouterApiKeySt
   });
 };
 
+const orderedListItemRegex = /^\s*\d+\.\s+(.*)$/;
+const parseMessageContent = rawMessage => {
+  if (rawMessage === '') {
+    return [{
+      text: '',
+      type: 'text'
+    }];
+  }
+  const lines = rawMessage.split(/\r?\n/);
+  const nodes = [];
+  let paragraphLines = [];
+  let listItems = [];
+  const flushParagraph = () => {
+    if (paragraphLines.length === 0) {
+      return;
+    }
+    nodes.push({
+      text: paragraphLines.join('\n'),
+      type: 'text'
+    });
+    paragraphLines = [];
+  };
+  const flushList = () => {
+    if (listItems.length === 0) {
+      return;
+    }
+    nodes.push({
+      items: listItems,
+      type: 'list'
+    });
+    listItems = [];
+  };
+  for (const line of lines) {
+    if (!line.trim()) {
+      flushList();
+      flushParagraph();
+      continue;
+    }
+    const match = line.match(orderedListItemRegex);
+    if (match) {
+      flushParagraph();
+      listItems.push({
+        text: match[1],
+        type: 'list-item'
+      });
+      continue;
+    }
+    flushList();
+    paragraphLines.push(line);
+  }
+  flushList();
+  flushParagraph();
+  return nodes.length === 0 ? [{
+    text: '',
+    type: 'text'
+  }] : nodes;
+};
+const getMessageContentDom = nodes => {
+  return nodes.flatMap(node => {
+    if (node.type === 'text') {
+      return [{
+        childCount: 1,
+        className: Markdown,
+        type: P
+      }, text(node.text)];
+    }
+    return [{
+      childCount: node.items.length,
+      className: ChatOrderedList,
+      type: Ol
+    }, ...node.items.flatMap(item => {
+      return [{
+        childCount: 1,
+        className: ChatOrderedListItem,
+        type: Li
+      }, text(item.text)];
+    })];
+  });
+};
+
+const getToolCallArgumentPreview = rawArguments => {
+  if (!rawArguments.trim()) {
+    return '""';
+  }
+  let parsed;
+  try {
+    parsed = JSON.parse(rawArguments);
+  } catch {
+    return rawArguments;
+  }
+  if (!parsed || typeof parsed !== 'object') {
+    return rawArguments;
+  }
+  const path = Reflect.get(parsed, 'path');
+  if (typeof path === 'string') {
+    return `"${path}"`;
+  }
+  const keys = Object.keys(parsed);
+  if (keys.length === 1) {
+    const value = Reflect.get(parsed, keys[0]);
+    if (typeof value === 'string') {
+      return `"${value}"`;
+    }
+  }
+  return rawArguments;
+};
+const getToolCallsDom = message => {
+  if (message.role !== 'assistant' || !message.toolCalls || message.toolCalls.length === 0) {
+    return [];
+  }
+  return message.toolCalls.flatMap(toolCall => {
+    const argumentPreview = getToolCallArgumentPreview(toolCall.arguments);
+    const label = `${toolCall.name} ${argumentPreview}`;
+    return [{
+      childCount: 1,
+      className: Markdown,
+      type: P
+    }, text(label)];
+  });
+};
 const getOpenRouterRequestFailedDom = () => {
   return [{
     childCount: openRouterRequestFailureReasons.length,
@@ -5149,7 +5447,10 @@ const getChatMessageDom = (message, openRouterApiKeyInput, openApiApiKeyInput =
   const isOpenRouterApiKeyMissingMessage = message.role === 'assistant' && message.text === openRouterApiKeyRequiredMessage;
   const isOpenRouterRequestFailedMessage = message.role === 'assistant' && message.text === openRouterRequestFailedMessage;
   const isOpenRouterTooManyRequestsMessage = message.role === 'assistant' && message.text.startsWith(openRouterTooManyRequestsMessage);
-  const extraChildCount = isOpenApiApiKeyMissingMessage || isOpenRouterApiKeyMissingMessage || isOpenRouterRequestFailedMessage || isOpenRouterTooManyRequestsMessage ? 2 : 1;
+  const messageIntermediate = parseMessageContent(message.text);
+  const messageDom = getMessageContentDom(messageIntermediate);
+  const toolCallsDom = getToolCallsDom(message);
+  const extraChildCount = isOpenApiApiKeyMissingMessage || isOpenRouterApiKeyMissingMessage || isOpenRouterRequestFailedMessage || isOpenRouterTooManyRequestsMessage ? messageIntermediate.length + 1 + toolCallsDom.length : messageIntermediate.length + toolCallsDom.length;
   return [{
     childCount: 1,
     className: mergeClassNames(Message, roleClassName),
@@ -5158,11 +5459,7 @@ const getChatMessageDom = (message, openRouterApiKeyInput, openApiApiKeyInput =
     childCount: extraChildCount,
     className: ChatMessageContent,
     type: Div
-  }, {
-    childCount: 1,
-    className: Markdown,
-    type: P
-  }, text(message.text), ...(isOpenApiApiKeyMissingMessage ? getMissingOpenApiApiKeyDom(openApiApiKeyInput) : []), ...(isOpenRouterApiKeyMissingMessage ? getMissingOpenRouterApiKeyDom(openRouterApiKeyInput, openRouterApiKeyState) : []), ...(isOpenRouterRequestFailedMessage ? getOpenRouterRequestFailedDom() : []), ...(isOpenRouterTooManyRequestsMessage ? getOpenRouterTooManyRequestsDom() : [])];
+  }, ...messageDom, ...toolCallsDom, ...(isOpenApiApiKeyMissingMessage ? getMissingOpenApiApiKeyDom(openApiApiKeyInput) : []), ...(isOpenRouterApiKeyMissingMessage ? getMissingOpenRouterApiKeyDom(openRouterApiKeyInput, openRouterApiKeyState) : []), ...(isOpenRouterRequestFailedMessage ? getOpenRouterRequestFailedDom() : []), ...(isOpenRouterTooManyRequestsMessage ? getOpenRouterTooManyRequestsDom() : [])];
 };
 
 const getEmptyMessagesDom = () => {
@@ -5406,6 +5703,9 @@ const renderEventListeners = () => {
   }, {
     name: HandleClickNew,
     params: ['handleClickNew']
+  }, {
+    name: HandleClickSessionDebug,
+    params: ['handleClickSessionDebug']
   }, {
     name: HandleClickBack,
     params: ['handleClickBack']
@@ -5553,6 +5853,7 @@ const commandMap = {
   'Chat.handleClickDelete': wrapCommand(handleClickDelete),
   'Chat.handleClickList': wrapCommand(handleClickList),
   'Chat.handleClickNew': wrapCommand(handleClickNew),
+  'Chat.handleClickSessionDebug': wrapCommand(handleClickSessionDebug),
   'Chat.handleClickSettings': handleClickSettings,
   'Chat.handleInput': wrapCommand(handleInput),
   'Chat.handleInputFocus': wrapCommand(handleInputFocus),
@@ -5588,7 +5889,7 @@ const initializeChatNetworkWorker = async () => {
     commandMap: {},
     send
   });
-  return rpc;
+  set$3(rpc);
 };
 
 const listen = async () => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/chat-view",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "Chat View Worker",
   "repository": {
     "type": "git",