@lvce-editor/chat-view 1.4.0 → 1.5.0

package/dist/chatViewWorkerMain.js

@@ -975,6 +975,8 @@ const TextArea = 62;
 const Strong = 70;
 const Reference = 100;
 
+const ClientX = 'event.clientX';
+const ClientY = 'event.clientY';
 const Key = 'event.key';
 const ShiftKey = 'event.shiftKey';
 const TargetName = 'event.target.name';
@@ -1189,6 +1191,37 @@ const terminate = () => {
   globalThis.close();
 };
 
+const emptyObject = {};
+const RE_PLACEHOLDER = /\{(PH\d+)\}/g;
+const i18nString = (key, placeholders = emptyObject) => {
+  if (placeholders === emptyObject) {
+    return key;
+  }
+  const replacer = (match, rest) => {
+    return placeholders[rest];
+  };
+  return key.replaceAll(RE_PLACEHOLDER, replacer);
+};
+
+const chatTitle = i18nString('Chat');
+const chats = i18nString('Chats');
+const newChat = i18nString('New Chat');
+const backToChats = i18nString('Back to chats');
+const settings = i18nString('Settings');
+const closeChat = i18nString('Close Chat');
+const clickToOpenNewChat = i18nString('Click the + button to open a new chat.');
+const startConversation = i18nString('Start a conversation by typing below.');
+const you = i18nString('You');
+const assistant = i18nString('Assistant');
+const composePlaceholder = i18nString('Type your message. Enter to send, Shift+Enter for newline.');
+const sendMessage = i18nString('Send message');
+const send = i18nString('Send');
+const deleteChatSession = i18nString('Delete chat session');
+const defaultSessionTitle = i18nString('Chat 1');
+const dummyChatA = i18nString('Dummy Chat A');
+const dummyChatB = i18nString('Dummy Chat B');
+const dummyChatC = i18nString('Dummy Chat C');
+
 const createDefaultState = () => {
   const defaultSessionId = 'session-1';
   return {
@@ -1199,16 +1232,16 @@ const createDefaultState = () => {
     initial: true,
     lastSubmittedSessionId: '',
     nextMessageId: 1,
-    nextSessionId: 2,
     platform: 0,
     renamingSessionId: '',
     selectedSessionId: defaultSessionId,
     sessions: [{
       id: defaultSessionId,
       messages: [],
-      title: 'Chat 1'
+      title: defaultSessionTitle
     }],
     uid: 0,
+    viewMode: 'list',
     warningCount: 0
   };
 };
@@ -1237,7 +1270,7 @@ const isEqual$1 = (oldState, newState) => {
 };
 
 const isEqual = (oldState, newState) => {
-  return oldState.composerValue === newState.composerValue && oldState.ignoreNextInput === newState.ignoreNextInput && oldState.initial === newState.initial && oldState.renamingSessionId === newState.renamingSessionId && oldState.selectedSessionId === newState.selectedSessionId && oldState.sessions === newState.sessions;
+  return oldState.composerValue === newState.composerValue && oldState.ignoreNextInput === newState.ignoreNextInput && oldState.initial === newState.initial && oldState.renamingSessionId === newState.renamingSessionId && oldState.selectedSessionId === newState.selectedSessionId && oldState.sessions === newState.sessions && oldState.viewMode === newState.viewMode;
 };
 
 const RenderItems = 4;
@@ -1271,37 +1304,22 @@ const getKeyBindings = () => {
   return [];
 };
 
-const submitRename = state => {
-  const {
-    composerValue,
-    renamingSessionId,
-    sessions
-  } = state;
-  const title = composerValue.trim();
-  if (!renamingSessionId || !title) {
-    return {
-      ...state,
-      renamingSessionId: ''
-    };
+const SESSION_PREFIX$1 = 'session:';
+const CHAT_LIST_ITEM_CONTEXT_MENU = 'ChatListItemContextMenu';
+const handleChatListContextMenu = async (name, x, y) => {
+  if (!name || !name.startsWith(SESSION_PREFIX$1)) {
+    return;
   }
-  const updatedSessions = sessions.map(session => {
-    if (session.id !== renamingSessionId) {
-      return session;
-    }
-    return {
-      ...session,
-      title
-    };
-  });
-  return {
-    ...state,
-    composerValue: '',
-    ignoreNextInput: true,
-    renamingSessionId: '',
-    sessions: updatedSessions
-  };
+  const sessionId = name.slice(SESSION_PREFIX$1.length);
+  // @ts-ignore
+  await invoke('ContextMenu.show', x, y, CHAT_LIST_ITEM_CONTEXT_MENU, sessionId);
+};
+
+const generateSessionId = () => {
+  return crypto.randomUUID();
 };
-const submitMessage = state => {
+
+const handleSubmit = async state => {
   const {
     composerValue,
     nextMessageId,
@@ -1309,6 +1327,10 @@ const submitMessage = state => {
     sessions
   } = state;
   const text = composerValue.trim();
+  const time = new Date().toLocaleTimeString([], {
+    hour: '2-digit',
+    minute: '2-digit'
+  });
   if (!text) {
     return {
       ...state,
@@ -1322,7 +1344,8 @@ const submitMessage = state => {
     const message = {
       id: `message-${nextMessageId}`,
       role: 'user',
-      text
+      text,
+      time
     };
     return {
       ...session,
@@ -1338,23 +1361,15 @@ const submitMessage = state => {
     sessions: updatedSessions
   };
 };
-const handleKeyDown = async (state, key, shiftKey) => {
-  if (key !== 'Enter' || shiftKey) {
-    return state;
-  }
-  if (state.renamingSessionId) {
-    return submitRename(state);
-  }
-  return submitMessage(state);
-};
 
 const CREATE_SESSION = 'create-session';
 const SESSION_PREFIX = 'session:';
 const RENAME_PREFIX = 'session-rename:';
 const DELETE_PREFIX = 'session-delete:';
 const SEND = 'send';
+const BACK = 'back';
 const handleClickSend = async state => {
-  return handleKeyDown(state, 'Enter', false);
+  return handleSubmit(state);
 };
 const getNextSelectedSessionId = (sessions, deletedId) => {
   if (sessions.length === 0) {
@@ -1368,15 +1383,14 @@ const getNextSelectedSessionId = (sessions, deletedId) => {
   return sessions[nextIndex].id;
 };
 const createSession = state => {
-  const id = `session-${state.nextSessionId}`;
+  const id = generateSessionId();
   const session = {
     id,
     messages: [],
-    title: `Chat ${state.nextSessionId}`
+    title: `Chat ${state.sessions.length + 1}`
   };
   return {
     ...state,
-    nextSessionId: state.nextSessionId + 1,
     renamingSessionId: '',
     selectedSessionId: id,
     sessions: [...state.sessions, session]
@@ -1390,7 +1404,8 @@ const selectSession = (state, id) => {
   return {
     ...state,
     renamingSessionId: '',
-    selectedSessionId: id
+    selectedSessionId: id,
+    viewMode: 'detail'
   };
 };
 const startRename = (state, id) => {
@@ -1411,18 +1426,12 @@ const deleteSession = (state, id) => {
     return state;
   }
   if (filtered.length === 0) {
-    const fallbackId = `session-${state.nextSessionId}`;
-    const fallback = {
-      id: fallbackId,
-      messages: [],
-      title: `Chat ${state.nextSessionId}`
-    };
     return {
       ...state,
-      nextSessionId: state.nextSessionId + 1,
       renamingSessionId: '',
-      selectedSessionId: fallbackId,
-      sessions: [fallback]
+      selectedSessionId: '',
+      sessions: [],
+      viewMode: 'list'
     };
   }
   return {
@@ -1454,6 +1463,13 @@ const handleClick = async (state, name) => {
   if (name === SEND) {
     return handleClickSend(state);
   }
+  if (name === BACK) {
+    return {
+      ...state,
+      renamingSessionId: '',
+      viewMode: 'list'
+    };
+  }
   return state;
 };
 
@@ -1477,6 +1493,46 @@ const handleInput = async (state, value) => {
   };
 };
 
+const submitRename = state => {
+  const {
+    composerValue,
+    renamingSessionId,
+    sessions
+  } = state;
+  const title = composerValue.trim();
+  if (!renamingSessionId || !title) {
+    return {
+      ...state,
+      renamingSessionId: ''
+    };
+  }
+  const updatedSessions = sessions.map(session => {
+    if (session.id !== renamingSessionId) {
+      return session;
+    }
+    return {
+      ...session,
+      title
+    };
+  });
+  return {
+    ...state,
+    composerValue: '',
+    ignoreNextInput: true,
+    renamingSessionId: '',
+    sessions: updatedSessions
+  };
+};
+const handleKeyDown = async (state, key, shiftKey) => {
+  if (key !== 'Enter' || shiftKey) {
+    return state;
+  }
+  if (state.renamingSessionId) {
+    return submitRename(state);
+  }
+  return handleSubmit(state);
+};
+
 const id = 7201;
 const sendMessagePortToExtensionHostWorker = async port => {
   await sendMessagePortToExtensionHostWorker$1(port, id);
@@ -1499,26 +1555,47 @@ const initialize = async () => {
   set$2(rpc);
 };
 
-const ensureSessions = state => {
-  if (state.sessions.length > 0) {
-    return state.sessions;
+const isObject = value => {
+  return typeof value === 'object' && value !== null;
+};
+
+const getSavedSelectedSessionId = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
   }
-  const id = `session-${state.nextSessionId}`;
-  return [{
-    id,
-    messages: [],
-    title: `Chat ${state.nextSessionId}`
-  }];
+  const {
+    selectedSessionId
+  } = savedState;
+  if (typeof selectedSessionId !== 'string') {
+    return undefined;
+  }
+  return selectedSessionId;
+};
+
+const getSavedSessions = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
+  }
+  const {
+    sessions
+  } = savedState;
+  if (!Array.isArray(sessions)) {
+    return undefined;
+  }
+  return sessions;
 };
-const loadContent = async state => {
-  const sessions = ensureSessions(state);
-  const selectedSessionId = sessions.some(session => session.id === state.selectedSessionId) ? state.selectedSessionId : sessions[0].id;
+
+const loadContent = async (state, savedState) => {
+  const sessions = getSavedSessions(savedState) || state.sessions;
+  const preferredSessionId = getSavedSelectedSessionId(savedState) || state.selectedSessionId;
+  const selectedSessionId = sessions.some(session => session.id === preferredSessionId) ? preferredSessionId : sessions[0]?.id || '';
+  const viewMode = sessions.length === 0 ? 'list' : state.viewMode === 'detail' ? 'detail' : 'list';
   return {
     ...state,
     initial: false,
-    nextSessionId: state.sessions.length === 0 ? state.nextSessionId + 1 : state.nextSessionId,
     selectedSessionId,
-    sessions
+    sessions,
+    viewMode
   };
 };
 
@@ -1530,6 +1607,10 @@ const renderCss = (oldState, newState) => {
   return [SetCss, newState.uid, css];
 };
 
+const mergeClassNames = (...classNames) => {
+  return classNames.filter(Boolean).join(' ');
+};
+
 const text = data => {
   return {
     childCount: 0,
@@ -1827,168 +1908,264 @@ const diffTree = (oldNodes, newNodes) => {
 };
 
 const ChatActions = 'ChatActions';
+const ChatName = 'ChatName';
+const ChatSendArea = 'ChatSendArea';
+const Chat = 'Chat';
 const ChatHeader = 'ChatHeader';
 const Button = 'Button';
+const ButtonPrimary = 'ButtonPrimary';
 const ChatDetails = 'ChatDetails';
 const ChatDetailsContent = 'ChatDetailsContent';
 const IconButton = 'IconButton';
 const Label = 'Label';
 const ChatList = 'ChatList';
+const ChatListItem = 'ChatListItem';
 const Markdown = 'Markdown';
 const Message = 'Message';
 const MultilineInputBox = 'MultilineInputBox';
 const Viewlet = 'Viewlet';
 const ChatWelcomeMessage = 'ChatWelcomeMessage';
 
+const HandleContextMenu = 2;
 const HandleInput = 4;
 const HandleClick = 11;
 const HandleKeyDown = 12;
 const HandleClickClose = 13;
 const HandleClickSettings = 14;
 
-const getMessagesDom = messages => {
-  if (messages.length === 0) {
-    return [{
-      childCount: 1,
-      className: ChatWelcomeMessage,
-      type: Div
-    }, text('Start a conversation by typing below.')];
-  }
-  return messages.flatMap(message => {
+const getChatHeaderActionsDom = () => {
+  const items = [{
+    icon: '+',
+    name: 'create-session',
+    title: newChat
+  }, {
+    icon: '⚙',
+    onClick: HandleClickSettings,
+    title: settings
+  }, {
+    icon: '×',
+    onClick: HandleClickClose,
+    title: closeChat
+  }];
+  return [{
+    childCount: items.length,
+    className: ChatActions,
+    type: Div
+  }, ...items.flatMap(item => {
+    const name = 'name' in item ? item.name : undefined;
+    const onClick = 'onClick' in item ? item.onClick : undefined;
     return [{
-      childCount: 2,
-      className: Message,
-      type: Div
-    }, {
-      childCount: 1,
-      className: Label,
-      type: Strong
-    }, text(message.role === 'user' ? 'You' : 'Assistant'), {
       childCount: 1,
-      className: Markdown,
-      type: P
-    }, text(message.text)];
-  });
+      className: IconButton,
+      ...(name ? {
+        name
+      } : {}),
+      ...(onClick ? {
+        onClick
+      } : {}),
+      role: Button$2,
+      tabIndex: 0,
+      title: item.title,
+      type: Button$1
+    }, text(item.icon)];
+  })];
+};
+
+const getChatHeaderBackButtonVirtualDom = () => {
+  return [{
+    childCount: 1,
+    className: IconButton,
+    name: 'back',
+    role: Button$2,
+    tabIndex: 0,
+    title: backToChats,
+    type: Button$1
+  }, text('←')];
 };
 
-const getSessionDom = (session, _selectedSessionId) => {
-  const sessionClassName = ChatList;
+const getChatHeaderDomDetailMode = selectedSessionTitle => {
   return [{
     childCount: 2,
-    className: sessionClassName,
+    className: ChatHeader,
     type: Div
   }, {
+    childCount: 2,
+    className: ChatName,
+    type: Div
+  }, ...getChatHeaderBackButtonVirtualDom(), {
     childCount: 1,
-    className: Button,
-    name: `session:${session.id}`,
-    role: Button$2,
-    tabIndex: 0,
-    type: Button$1
-  }, text(session.title), {
+    className: Label,
+    type: Span
+  }, text(selectedSessionTitle), ...getChatHeaderActionsDom()];
+};
+
+const getChatDetailsDom = (selectedSessionTitle, messagesNodes, composerValue) => {
+  return [{
+    childCount: 3,
+    className: ChatDetails,
+    type: Div
+  }, {
+    childCount: 1,
+    className: Label,
+    type: Span
+  }, text(selectedSessionTitle), {
+    childCount: Math.max(messagesNodes.length, 0),
+    className: ChatDetailsContent,
+    type: Div
+  }, ...messagesNodes, {
     childCount: 2,
-    className: ChatActions,
+    className: ChatSendArea,
     type: Div
+  }, {
+    childCount: 0,
+    className: MultilineInputBox,
+    name: 'composer',
+    placeholder: composePlaceholder,
+    rows: 4,
+    type: TextArea,
+    value: composerValue
   }, {
     childCount: 1,
-    className: IconButton,
-    name: `session-rename:${session.id}`,
+    className: Button + ' ' + ButtonPrimary,
+    name: 'send',
     role: Button$2,
     tabIndex: 0,
-    title: 'Rename chat session',
+    title: sendMessage,
     type: Button$1
-  }, text('Rename'), {
+  }, text(send)];
+};
+
+const getChatContentDom = (viewMode, sessionsLength, emptyStateNodes, sessionNodes, selectedSessionTitle, messagesNodes, composerValue) => {
+  return getChatDetailsDom(selectedSessionTitle, messagesNodes, composerValue);
+};
+
+const getChatMessageDom = message => {
+  return [{
+    childCount: 2,
+    className: Message,
+    type: Div
+  }, {
     childCount: 1,
-    className: IconButton,
-    name: `session-delete:${session.id}`,
-    role: Button$2,
-    tabIndex: 0,
-    title: 'Delete chat session',
-    type: Button$1
-  }, text('Delete')];
+    className: Label,
+    type: Strong
+  }, text(`${message.role === 'user' ? you : assistant} · ${message.time}`), {
+    childCount: 1,
+    className: Markdown,
+    type: P
+  }, text(message.text)];
+};
+const getMessagesDom = messages => {
+  if (messages.length === 0) {
+    return [{
+      childCount: 1,
+      className: ChatWelcomeMessage,
+      type: Div
+    }, text(startConversation)];
+  }
+  return messages.flatMap(message => {
+    return getChatMessageDom(message);
+  });
 };
 
-const getChatVirtualDom = (sessions, selectedSessionId, composerValue) => {
+const getChatModeDetailVirtualDom = (sessions, selectedSessionId, composerValue) => {
   const selectedSession = sessions.find(session => session.id === selectedSessionId);
+  const selectedSessionTitle = selectedSession?.title || chatTitle;
   const messages = selectedSession ? selectedSession.messages : [];
-  const sessionNodes = sessions.flatMap(session => getSessionDom(session));
   const messagesNodes = getMessagesDom(messages);
-  const dom = [{
-    childCount: 3,
+  const contentNodes = getChatContentDom('detail', sessions.length, [], [], selectedSessionTitle, messagesNodes, composerValue);
+  return [{
+    childCount: 2,
     className: Viewlet + ' Chat',
     onClick: HandleClick,
     onInput: HandleInput,
     onKeyDown: HandleKeyDown,
     type: Div
-  }, {
+  }, ...getChatHeaderDomDetailMode(selectedSessionTitle), ...contentNodes];
+};
+
+const getChatHeaderListModeDom = () => {
+  return [{
     childCount: 2,
     className: ChatHeader,
     type: Div
-  }, {
-    childCount: 4,
-    className: ChatActions,
-    type: Div
   }, {
     childCount: 1,
     className: Label,
     type: Span
-  }, text('Chats'), {
-    childCount: 1,
-    className: IconButton,
-    name: 'create-session',
-    role: Button$2,
-    tabIndex: 0,
-    title: 'New Chat',
-    type: Button$1
-  }, text('+'), {
-    childCount: 1,
-    className: IconButton,
-    onClick: HandleClickSettings,
-    role: Button$2,
-    tabIndex: 0,
-    title: 'Settings',
-    type: Button$1
-  }, text('⚙'), {
+  }, text(chats), ...getChatHeaderActionsDom()];
+};
+
+const getEmptyChatSessionsDom = sessionsLength => {
+  if (sessionsLength !== 0) {
+    return [];
+  }
+  return [{
     childCount: 1,
-    className: IconButton,
-    onClick: HandleClickClose,
-    role: Button$2,
-    tabIndex: 0,
-    title: 'Close Chat',
-    type: Button$1
-  }, text('×'), {
-    childCount: sessions.length,
-    className: ChatList,
+    className: Label,
     type: Div
-  }, ...sessionNodes, {
+  }, text(clickToOpenNewChat)];
+};
+
+const getSessionDom = (session, _selectedSessionId) => {
+  const sessionClassName = ChatListItem;
+  return [{
     childCount: 2,
-    className: ChatDetails,
+    className: sessionClassName,
     type: Div
   }, {
-    childCount: Math.max(messagesNodes.length, 0),
-    className: ChatDetailsContent,
+    childCount: 1,
+    className: ChatName,
+    name: `session:${session.id}`,
+    onContextMenu: HandleContextMenu,
+    tabIndex: 0,
     type: Div
-  }, ...messagesNodes, {
-    childCount: 2,
+  }, text(session.title), {
+    childCount: 1,
     className: ChatActions,
     type: Div
-  }, {
-    childCount: 0,
-    className: MultilineInputBox,
-    name: 'composer',
-    placeholder: 'Type your message. Enter to send, Shift+Enter for newline.',
-    rows: 4,
-    type: TextArea,
-    value: composerValue
   }, {
     childCount: 1,
-    className: Button,
-    name: 'send',
+    className: IconButton,
+    name: `session-delete:${session.id}`,
     role: Button$2,
     tabIndex: 0,
-    title: 'Send message',
+    title: deleteChatSession,
     type: Button$1
-  }, text('Send')];
-  return dom;
+  }, text('🗑')];
+};
+
+const getChatModeListVirtualDom = (sessions, selectedSessionId) => {
+  const sessionNodes = sessions.flatMap(session => getSessionDom(session));
+  const emptyStateNodes = getEmptyChatSessionsDom(sessions.length);
+  return [{
+    childCount: 2,
+    className: mergeClassNames(Viewlet, Chat),
+    onClick: HandleClick,
+    onInput: HandleInput,
+    onKeyDown: HandleKeyDown,
+    type: Div
+  }, ...getChatHeaderListModeDom(), {
+    childCount: sessions.length === 0 ? 1 : sessions.length,
+    className: ChatList,
+    type: Div
+  }, ...(sessions.length === 0 ? emptyStateNodes : sessionNodes)];
+};
+
+const getChatModeUnsupportedVirtualDom = () => {
+  return [{
+    childCount: 1,
+    type: Div
+  }, text('Unknown view mode')];
+};
+const getChatVirtualDom = (sessions, selectedSessionId, composerValue, viewMode) => {
+  switch (viewMode) {
+    case 'detail':
+      return getChatModeDetailVirtualDom(sessions, selectedSessionId, composerValue);
+    case 'list':
+      return getChatModeListVirtualDom(sessions);
+    default:
+      return getChatModeUnsupportedVirtualDom();
+  }
 };
 
 const renderItems = (oldState, newState) => {
@@ -1997,12 +2174,13 @@ const renderItems = (oldState, newState) => {
     initial,
     selectedSessionId,
     sessions,
-    uid
+    uid,
+    viewMode
   } = newState;
   if (initial) {
     return [SetDom2, uid, []];
   }
-  const dom = getChatVirtualDom(sessions, selectedSessionId, composerValue);
+  const dom = getChatVirtualDom(sessions, selectedSessionId, composerValue, viewMode);
   return [SetDom2, uid, dom];
 };
 
@@ -2050,6 +2228,10 @@ const render2 = (uid, diffResult) => {
 
 const renderEventListeners = () => {
   return [{
+    name: HandleContextMenu,
+    params: ['handleChatListContextMenu', TargetName, ClientX, ClientY],
+    preventDefault: true
+  }, {
     name: HandleClick,
     params: ['handleClick', TargetName]
   }, {
@@ -2078,40 +2260,40 @@ const saveState = state => {
   const {
     composerValue,
     nextMessageId,
-    nextSessionId,
     renamingSessionId,
     selectedSessionId,
-    sessions
+    sessions,
+    viewMode
   } = state;
   return {
     composerValue,
     nextMessageId,
-    nextSessionId,
     renamingSessionId,
     selectedSessionId,
-    sessions
+    sessions,
+    viewMode
   };
 };
 
 const dummySessions = [{
   id: 'session-a',
   messages: [],
-  title: 'Dummy Chat A'
+  title: dummyChatA
 }, {
   id: 'session-b',
   messages: [],
-  title: 'Dummy Chat B'
+  title: dummyChatB
 }, {
   id: 'session-c',
   messages: [],
-  title: 'Dummy Chat C'
+  title: dummyChatC
 }];
 const setChatList = state => {
   return {
     ...state,
-    nextSessionId: dummySessions.length + 1,
     selectedSessionId: dummySessions[0].id,
-    sessions: dummySessions
+    sessions: dummySessions,
+    viewMode: 'detail'
   };
 };
 
@@ -2120,11 +2302,13 @@ const commandMap = {
   'Chat.diff2': diff2,
   'Chat.getCommandIds': getCommandIds,
   'Chat.getKeyBindings': getKeyBindings,
+  'Chat.handleChatListContextMenu': handleChatListContextMenu,
   'Chat.handleClick': wrapCommand(handleClick),
   'Chat.handleClickClose': handleClickClose,
   'Chat.handleClickSettings': handleClickSettings,
   'Chat.handleInput': wrapCommand(handleInput),
   'Chat.handleKeyDown': wrapCommand(handleKeyDown),
+  'Chat.handleSubmit': wrapCommand(handleSubmit),
   'Chat.initialize': initialize,
   'Chat.loadContent': wrapCommand(loadContent),
   'Chat.loadContent2': wrapCommand(loadContent),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lvce-editor/chat-view",
-  "version": "1.4.0",
+  "version": "1.5.0",
   "description": "Chat View Worker",
   "repository": {
     "type": "git",
@@ -11,6 +11,7 @@
   "type": "module",
   "main": "dist/chatViewWorkerMain.js",
   "dependencies": {
+    "@lvce-editor/i18n": "^2.1.0",
     "@lvce-editor/virtual-dom-worker": "^8.9.0"
   }
 }