@lvce-editor/chat-view 3.9.0 → 4.0.0

package/dist/chatViewWorkerMain.js

@@ -1122,6 +1122,10 @@ const sendMessagePortToExtensionHostWorker$1 = async (port, rpcId = 0) => {
 const sendMessagePortToChatNetworkWorker = async port => {
   await invokeAndTransfer('SendMessagePortToExtensionHostWorker.sendMessagePortToChatNetworkWorker', port, 'HandleMessagePort.handleMessagePort');
 };
+const confirm = async (message, options) => {
+  const result = await invoke('ConfirmPrompt.prompt', message, options);
+  return result;
+};
 const activateByEvent$1 = (event, assetDir, platform) => {
   return invoke('ExtensionHostManagement.activateByEvent', event, assetDir, platform);
 };
@@ -1336,6 +1340,12 @@ const backToChats = () => {
 const settings = () => {
   return i18nString('Settings');
 };
+const chatFocusMode = () => {
+  return i18nString('Switch to chat focus mode');
+};
+const normalChatMode = () => {
+  return i18nString('Switch to normal chat mode');
+};
 const closeChat = () => {
   return i18nString('Close Chat');
 };
@@ -1393,13 +1403,16 @@ const unknownViewMode = () => {
 
 /* eslint-disable @cspell/spellchecker */
 
-const getDefaultModels = () => {
+const getDefaultModelsTest = () => {
   const defaultModelId = 'test';
   return [{
     id: defaultModelId,
     name: 'test',
     provider: 'test'
-  }, {
+  }];
+};
+const getDefaultModelsOpenAi = () => {
+  return [{
     id: 'openapi/gpt-5-mini',
     name: 'GPT-5 Mini',
     provider: 'openApi'
@@ -1415,7 +1428,10 @@ const getDefaultModels = () => {
     id: 'openapi/gpt-4.1-mini',
     name: 'GPT-4.1 Mini',
     provider: 'openApi'
-  }, {
+  }];
+};
+const getDefaultModelsOpenRouter = () => {
+  return [{
     id: 'codex-5.3',
     name: 'Codex 5.3',
     provider: 'openRouter'
@@ -1465,7 +1481,12 @@ const getDefaultModels = () => {
     provider: 'openRouter'
   }];
 };
+const getDefaultModels = () => {
+  return [...getDefaultModelsTest(), ...getDefaultModelsOpenAi(), ...getDefaultModelsOpenRouter()];
+};
+
 const createDefaultState = () => {
+  const defaultProjectId = 'project-1';
   const defaultSessionId = 'session-1';
   const defaultModelId = 'test';
   const chatMessageFontSize = 13;
@@ -1494,6 +1515,7 @@ const createDefaultState = () => {
     height: 0,
     initial: true,
     inputSource: 'script',
+    lastNormalViewMode: 'list',
     lastSubmittedSessionId: '',
     listItemHeight: 40,
     maxComposerRows: 5,
@@ -1513,12 +1535,21 @@ const createDefaultState = () => {
     openRouterApiKeyState: 'idle',
     passIncludeObfuscation: false,
     platform: 0,
+    projectExpandedIds: [defaultProjectId],
+    projectListScrollTop: 0,
+    projects: [{
+      id: defaultProjectId,
+      name: '_blank',
+      uri: ''
+    }],
     renamingSessionId: '',
     selectedModelId: defaultModelId,
+    selectedProjectId: defaultProjectId,
     selectedSessionId: defaultSessionId,
     sessions: [{
       id: defaultSessionId,
       messages: [],
+      projectId: defaultProjectId,
       title: defaultSessionTitle()
     }],
     streamingEnabled: true,
@@ -2138,29 +2169,49 @@ const createDefaultStorage = () => {
 let chatSessionStorage = createDefaultStorage();
 const listChatSessions = async () => {
   const sessions = await chatSessionStorage.listSessions();
-  return sessions.map(session => ({
-    id: session.id,
-    messages: [],
-    title: session.title
-  }));
+  return sessions.map(session => {
+    const summary = {
+      id: session.id,
+      messages: [],
+      title: session.title
+    };
+    if (!session.projectId) {
+      return summary;
+    }
+    return {
+      ...summary,
+      projectId: session.projectId
+    };
+  });
 };
 const getChatSession = async id => {
   const session = await chatSessionStorage.getSession(id);
   if (!session) {
     return undefined;
   }
-  return {
+  const result = {
     id: session.id,
     messages: [...session.messages],
     title: session.title
   };
+  if (!session.projectId) {
+    return result;
+  }
+  return {
+    ...result,
+    projectId: session.projectId
+  };
 };
 const saveChatSession = async session => {
-  await chatSessionStorage.setSession({
+  const value = {
     id: session.id,
     messages: [...session.messages],
     title: session.title
-  });
+  };
+  await chatSessionStorage.setSession(session.projectId ? {
+    ...value,
+    projectId: session.projectId
+  } : value);
 };
 const deleteChatSession = async id => {
   await chatSessionStorage.deleteSession(id);
@@ -2184,6 +2235,17 @@ const getNextSelectedSessionId = (sessions, deletedId) => {
   return sessions[nextIndex].id;
 };
 
+const getVisibleSessions = (sessions, selectedProjectId) => {
+  if (!selectedProjectId) {
+    return sessions;
+  }
+  const hasAssignedProjects = sessions.some(session => !!session.projectId);
+  if (!hasAssignedProjects) {
+    return sessions;
+  }
+  return sessions.filter(session => session.projectId === selectedProjectId);
+};
+
 const deleteSession = async (state, id) => {
   const {
     renamingSessionId,
@@ -2222,10 +2284,8 @@ const deleteSession = async (state, id) => {
   };
 };
 const deleteSessionAtIndex = async (state, index) => {
-  const {
-    sessions
-  } = state;
-  const session = sessions[index];
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  const session = visibleSessions[index];
   if (!session) {
     return state;
   }
@@ -2291,12 +2351,23 @@ const diffFocus = (oldState, newState) => {
   return oldState.focus === newState.focus && oldState.focused === newState.focused;
 };
 
+const isEqualProjectExpandedIds = (a, b) => {
+  if (a.length !== b.length) {
+    return false;
+  }
+  for (let i = 0; i < a.length; i++) {
+    if (a[i] !== b[i]) {
+      return false;
+    }
+  }
+  return true;
+};
 const isEqual = (oldState, newState) => {
-  return oldState.composerDropActive === newState.composerDropActive && oldState.composerDropEnabled === newState.composerDropEnabled && oldState.composerValue === newState.composerValue && oldState.initial === newState.initial && oldState.renamingSessionId === newState.renamingSessionId && oldState.selectedModelId === newState.selectedModelId && oldState.selectedSessionId === newState.selectedSessionId && oldState.sessions === newState.sessions && oldState.tokensMax === newState.tokensMax && oldState.tokensUsed === newState.tokensUsed && oldState.usageOverviewEnabled === newState.usageOverviewEnabled && oldState.viewMode === newState.viewMode;
+  return oldState.composerDropActive === newState.composerDropActive && oldState.composerDropEnabled === newState.composerDropEnabled && oldState.composerValue === newState.composerValue && oldState.initial === newState.initial && isEqualProjectExpandedIds(oldState.projectExpandedIds, newState.projectExpandedIds) && oldState.projectListScrollTop === newState.projectListScrollTop && oldState.renamingSessionId === newState.renamingSessionId && oldState.selectedModelId === newState.selectedModelId && oldState.selectedProjectId === newState.selectedProjectId && oldState.selectedSessionId === newState.selectedSessionId && oldState.sessions === newState.sessions && oldState.tokensMax === newState.tokensMax && oldState.tokensUsed === newState.tokensUsed && oldState.usageOverviewEnabled === newState.usageOverviewEnabled && oldState.viewMode === newState.viewMode;
 };
 
 const diffScrollTop = (oldState, newState) => {
-  return oldState.chatListScrollTop === newState.chatListScrollTop && oldState.messagesScrollTop === newState.messagesScrollTop;
+  return oldState.chatListScrollTop === newState.chatListScrollTop && oldState.messagesScrollTop === newState.messagesScrollTop && oldState.projectListScrollTop === newState.projectListScrollTop;
 };
 
 const RenderItems = 4;
@@ -2735,7 +2806,8 @@ const handleChatListContextMenu = async (state, eventX, eventY) => {
   if (index === -1) {
     return state;
   }
-  const item = state.sessions[index];
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  const item = visibleSessions[index];
   if (!item) {
     return state;
   }
@@ -2747,22 +2819,106 @@ const generateSessionId = () => {
   return crypto.randomUUID();
 };
 
-const createSession = async state => {
+const createSession = async (state, projectIdOverride = '') => {
   const id = generateSessionId();
+  const fallbackProjectId = state.projects.find(project => project.name === '_blank')?.id || state.projects[0]?.id || 'project-1';
+  const projectId = projectIdOverride || state.selectedProjectId || fallbackProjectId;
   const session = {
     id,
     messages: [],
+    projectId,
     title: `Chat ${state.sessions.length + 1}`
   };
   await saveChatSession(session);
   return {
     ...state,
+    projectExpandedIds: state.projectExpandedIds.includes(projectId) ? state.projectExpandedIds : [...state.projectExpandedIds, projectId],
     renamingSessionId: '',
+    selectedProjectId: projectId,
     selectedSessionId: id,
     sessions: [...state.sessions, session]
   };
 };
 
+const selectProject = async (state, projectId) => {
+  if (!projectId || state.selectedProjectId === projectId) {
+    return state;
+  }
+  const visibleSessions = getVisibleSessions(state.sessions, projectId);
+  if (visibleSessions.length === 0) {
+    return {
+      ...state,
+      selectedProjectId: projectId,
+      selectedSessionId: '',
+      viewMode: state.viewMode === 'chat-focus' ? 'chat-focus' : 'list'
+    };
+  }
+  const currentSessionVisible = visibleSessions.some(session => session.id === state.selectedSessionId);
+  const nextSelectedSessionId = currentSessionVisible ? state.selectedSessionId : visibleSessions[0].id;
+  const loadedSession = await getChatSession(nextSelectedSessionId);
+  const sessions = state.sessions.map(session => {
+    if (session.id !== nextSelectedSessionId || !loadedSession) {
+      return session;
+    }
+    return loadedSession;
+  });
+  return {
+    ...state,
+    selectedProjectId: projectId,
+    selectedSessionId: nextSelectedSessionId,
+    sessions,
+    viewMode: state.viewMode === 'chat-focus' ? 'chat-focus' : 'detail'
+  };
+};
+
+const getProjectName = (uri, fallbackIndex) => {
+  if (!uri) {
+    return `Project ${fallbackIndex}`;
+  }
+  const withoutScheme = uri.replace(/^file:\/\//, '');
+  const normalized = withoutScheme.replace(/\/+$/, '');
+  const lastSegment = normalized.split('/').pop();
+  if (!lastSegment) {
+    return `Project ${fallbackIndex}`;
+  }
+  return decodeURIComponent(lastSegment);
+};
+const getNextProjectId = projects => {
+  return `project-${projects.length + 1}`;
+};
+const pickProjectUri = async () => {
+  try {
+    const workspaceUri = await getWorkspacePath();
+    return workspaceUri;
+  } catch {
+    return '';
+  }
+};
+const handleClickCreateProject = async state => {
+  await confirm('project added');
+  const uri = await pickProjectUri();
+  if (!uri) {
+    return state;
+  }
+  const existingProject = state.projects.find(project => project.uri === uri);
+  if (existingProject) {
+    return selectProject(state, existingProject.id);
+  }
+  const id = getNextProjectId(state.projects);
+  const project = {
+    id,
+    name: getProjectName(uri, state.projects.length + 1),
+    uri
+  };
+  return {
+    ...state,
+    projects: [...state.projects, project],
+    selectedProjectId: project.id,
+    selectedSessionId: '',
+    viewMode: 'list'
+  };
+};
+
 const handleClickOpenApiApiKeySettings = async state => {
   await invoke('Main.openUri', 'app://settings.json');
   return state;
@@ -5812,13 +5968,35 @@ const ComposerDropTarget = 'composer-drop-target';
 const Send = 'send';
 const Back = 'back';
 const Model = 'model';
+const ToggleChatFocus = 'toggle-chat-focus';
+const CreateProject = 'create-project';
 const CreateSession = 'create-session';
+const CreateSessionInProjectPrefix = 'create-session-in-project:';
 const SessionDebug = 'session-debug';
 const Settings = 'settings';
 const CloseChat = 'close-chat';
 const SessionDelete = 'SessionDelete';
+const ProjectPrefix = 'project:';
 const SessionPrefix = 'session:';
 const RenamePrefix = 'session-rename:';
+const getProjectInputName = projectId => {
+  return `${ProjectPrefix}${projectId}`;
+};
+const getCreateSessionInProjectInputName = projectId => {
+  return `${CreateSessionInProjectPrefix}${projectId}`;
+};
+const isCreateSessionInProjectInputName = name => {
+  return name.startsWith(CreateSessionInProjectPrefix);
+};
+const getProjectIdFromCreateSessionInProjectInputName = name => {
+  return name.slice(CreateSessionInProjectPrefix.length);
+};
+const isProjectInputName = name => {
+  return name.startsWith(ProjectPrefix);
+};
+const getProjectIdFromInputName = name => {
+  return name.slice(ProjectPrefix.length);
+};
 const getSessionInputName = sessionId => {
   return `${SessionPrefix}${sessionId}`;
 };
@@ -5863,10 +6041,11 @@ const selectSession = async (state, id) => {
   });
   return {
     ...state,
+    lastNormalViewMode: state.viewMode === 'chat-focus' ? state.lastNormalViewMode : 'detail',
     renamingSessionId: '',
     selectedSessionId: id,
     sessions,
-    viewMode: 'detail'
+    viewMode: state.viewMode === 'chat-focus' ? 'chat-focus' : 'detail'
   };
 };
 
@@ -5887,14 +6066,61 @@ const startRename = (state, id) => {
   };
 };
 
+const toggleChatFocusMode = async state => {
+  if (state.viewMode === 'chat-focus') {
+    return {
+      ...state,
+      viewMode: state.lastNormalViewMode
+    };
+  }
+  if (state.viewMode === 'list' || state.viewMode === 'detail') {
+    return {
+      ...state,
+      lastNormalViewMode: state.viewMode,
+      viewMode: 'chat-focus'
+    };
+  }
+  return state;
+};
+
+const toggleProjectExpanded = async (state, projectId) => {
+  const isExpanded = state.projectExpandedIds.includes(projectId);
+  const projectExpandedIds = isExpanded ? state.projectExpandedIds.filter(id => id !== projectId) : [...state.projectExpandedIds, projectId];
+  const visibleSessions = getVisibleSessions(state.sessions, projectId);
+  if (visibleSessions.length === 0) {
+    return {
+      ...state,
+      projectExpandedIds,
+      selectedProjectId: projectId,
+      selectedSessionId: '',
+      viewMode: 'chat-focus'
+    };
+  }
+  const selectedSessionVisible = visibleSessions.some(session => session.id === state.selectedSessionId);
+  const selectedSessionId = selectedSessionVisible ? state.selectedSessionId : visibleSessions[0].id;
+  const loadedSession = await getChatSession(selectedSessionId);
+  const sessions = state.sessions.map(session => {
+    if (session.id !== selectedSessionId || !loadedSession) {
+      return session;
+    }
+    return loadedSession;
+  });
+  return {
+    ...state,
+    projectExpandedIds,
+    selectedProjectId: projectId,
+    selectedSessionId,
+    sessions,
+    viewMode: 'chat-focus'
+  };
+};
+
 const selectListIndex = async (state, index) => {
-  const {
-    sessions
-  } = state;
-  if (index < 0 || index >= sessions.length) {
+  const visibleSessions = getVisibleSessions(state.sessions, state.selectedProjectId);
+  if (index < 0 || index >= visibleSessions.length) {
     return state;
   }
-  const session = sessions[index];
+  const session = visibleSessions[index];
   return selectSession(state, session.id);
 };
 
@@ -5910,6 +6136,23 @@ const handleClick = async (state, name, id = '') => {
   if (name === CreateSession) {
     return createSession(state);
   }
+  if (name === CreateProject) {
+    return handleClickCreateProject(state);
+  }
+  if (isCreateSessionInProjectInputName(name)) {
+    const projectId = getProjectIdFromCreateSessionInProjectInputName(name);
+    return createSession(state, projectId);
+  }
+  if (name === ToggleChatFocus) {
+    return toggleChatFocusMode(state);
+  }
+  if (isProjectInputName(name)) {
+    const projectId = getProjectIdFromInputName(name);
+    if (state.viewMode === 'chat-focus') {
+      return toggleProjectExpanded(state, projectId);
+    }
+    return selectProject(state, projectId);
+  }
   if (isSessionInputName(name)) {
     const sessionId = getSessionIdFromInputName(name);
     return selectSession(state, sessionId);
@@ -5948,6 +6191,7 @@ const handleClick = async (state, name, id = '') => {
 const handleClickBack = async state => {
   return {
     ...state,
+    lastNormalViewMode: 'list',
     renamingSessionId: '',
     viewMode: 'list'
   };
@@ -6229,6 +6473,15 @@ const handleMessagesScroll = async (state, messagesScrollTop) => {
     messagesScrollTop
   };
 };
+const handleProjectListScroll = async (state, projectListScrollTop) => {
+  if (state.projectListScrollTop === projectListScrollTop) {
+    return state;
+  }
+  return {
+    ...state,
+    projectListScrollTop
+  };
+};
 
 const id = 7201;
 const sendMessagePortToExtensionHostWorker = async port => {
@@ -6328,7 +6581,7 @@ const getSavedViewMode = savedState => {
   const {
     viewMode
   } = savedState;
-  if (viewMode !== 'list' && viewMode !== 'detail') {
+  if (viewMode !== 'list' && viewMode !== 'detail' && viewMode !== 'chat-focus') {
     return undefined;
   }
   return viewMode;
@@ -6445,11 +6698,97 @@ const loadSelectedSessionMessages = async (sessions, selectedSessionId) => {
 };
 
 const toSummarySession = session => {
-  return {
+  const summary = {
     id: session.id,
     messages: [],
     title: session.title
   };
+  if (!session.projectId) {
+    return summary;
+  }
+  return {
+    ...summary,
+    projectId: session.projectId
+  };
+};
+const getSavedSelectedProjectId = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
+  }
+  const {
+    selectedProjectId
+  } = savedState;
+  if (typeof selectedProjectId !== 'string') {
+    return undefined;
+  }
+  return selectedProjectId;
+};
+const getSavedProjects = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
+  }
+  const {
+    projects
+  } = savedState;
+  if (!Array.isArray(projects)) {
+    return undefined;
+  }
+  const validProjects = projects.filter(project => {
+    if (!isObject(project)) {
+      return false;
+    }
+    return typeof project.id === 'string' && typeof project.name === 'string' && typeof project.uri === 'string';
+  });
+  if (validProjects.length === 0) {
+    return undefined;
+  }
+  return validProjects;
+};
+const ensureBlankProject = (projects, fallbackBlankProject) => {
+  if (projects.some(project => project.name === '_blank')) {
+    return projects;
+  }
+  return [fallbackBlankProject, ...projects];
+};
+const getSavedProjectListScrollTop = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
+  }
+  const {
+    projectListScrollTop
+  } = savedState;
+  if (typeof projectListScrollTop !== 'number') {
+    return undefined;
+  }
+  return projectListScrollTop;
+};
+const getSavedProjectExpandedIds = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
+  }
+  const {
+    projectExpandedIds
+  } = savedState;
+  if (!Array.isArray(projectExpandedIds)) {
+    return undefined;
+  }
+  const ids = projectExpandedIds.filter(id => typeof id === 'string');
+  if (ids.length === 0) {
+    return undefined;
+  }
+  return ids;
+};
+const getSavedLastNormalViewMode = savedState => {
+  if (!isObject(savedState)) {
+    return undefined;
+  }
+  const {
+    lastNormalViewMode
+  } = savedState;
+  if (lastNormalViewMode !== 'list' && lastNormalViewMode !== 'detail') {
+    return undefined;
+  }
+  return lastNormalViewMode;
 };
 const loadContent = async (state, savedState) => {
   const savedSelectedModelId = getSavedSelectedModelId(savedState);
@@ -6480,14 +6819,30 @@ const loadContent = async (state, savedState) => {
     sessions = state.sessions.map(toSummarySession);
   }
   const preferredSessionId = getSavedSelectedSessionId(savedState) || state.selectedSessionId;
+  const savedProjects = getSavedProjects(savedState);
+  const baseProjects = savedProjects && savedProjects.length > 0 ? savedProjects : state.projects;
+  const blankProject = state.projects.find(project => project.name === '_blank') || {
+    id: 'project-blank',
+    name: '_blank',
+    uri: ''
+  };
+  const projects = ensureBlankProject(baseProjects, blankProject);
+  const preferredProjectId = getSavedSelectedProjectId(savedState) || state.selectedProjectId;
+  const selectedProjectId = projects.some(project => project.id === preferredProjectId) ? preferredProjectId : projects[0]?.id || '';
   const preferredModelId = savedSelectedModelId || state.selectedModelId;
   const chatListScrollTop = getSavedChatListScrollTop(savedState) ?? state.chatListScrollTop;
   const messagesScrollTop = getSavedMessagesScrollTop(savedState) ?? state.messagesScrollTop;
+  const projectListScrollTop = getSavedProjectListScrollTop(savedState) ?? state.projectListScrollTop;
+  const savedProjectExpandedIds = getSavedProjectExpandedIds(savedState);
+  const projectExpandedIds = (savedProjectExpandedIds || state.projectExpandedIds).filter(id => projects.some(project => project.id === id));
   const selectedModelId = state.models.some(model => model.id === preferredModelId) ? preferredModelId : state.models[0]?.id || '';
-  const selectedSessionId = sessions.some(session => session.id === preferredSessionId) ? preferredSessionId : sessions[0]?.id || '';
+  const visibleSessions = getVisibleSessions(sessions, selectedProjectId);
+  const selectedSessionId = visibleSessions.some(session => session.id === preferredSessionId) ? preferredSessionId : visibleSessions[0]?.id || '';
   sessions = await loadSelectedSessionMessages(sessions, selectedSessionId);
   const preferredViewMode = savedViewMode || state.viewMode;
-  const viewMode = sessions.length === 0 || !selectedSessionId ? 'list' : preferredViewMode === 'detail' ? 'detail' : 'list';
+  const savedLastNormalViewMode = getSavedLastNormalViewMode(savedState);
+  const lastNormalViewMode = savedLastNormalViewMode || (preferredViewMode === 'detail' ? 'detail' : state.lastNormalViewMode);
+  const viewMode = sessions.length === 0 || !selectedSessionId ? 'list' : preferredViewMode;
   return {
     ...state,
     aiSessionTitleGenerationEnabled,
@@ -6496,13 +6851,18 @@ const loadContent = async (state, savedState) => {
     composerDropEnabled,
     emitStreamingFunctionCallEvents,
     initial: false,
+    lastNormalViewMode,
     messagesScrollTop,
     openApiApiKey,
     openApiApiKeyInput: openApiApiKey,
     openRouterApiKey,
     openRouterApiKeyInput: openRouterApiKey,
     passIncludeObfuscation,
+    projectExpandedIds,
+    projectListScrollTop,
+    projects,
     selectedModelId,
+    selectedProjectId,
     selectedSessionId,
     sessions,
     streamingEnabled,
@@ -6589,6 +6949,219 @@ const getCss = (composerHeight, listItemHeight, chatMessageFontSize, chatMessage
   --ChatMessageLineHeight: ${chatMessageLineHeight}px;
   --ChatMessageFontFamily: ${chatMessageFontFamily};
 }
+
+.Viewlet.Chat.ChatFocus {
+  background: linear-gradient(180deg, var(--ColorViewBackground, #1d2229) 0%, #1f252d 100%);
+  display: grid;
+  grid-template-columns: 320px 1fr;
+  grid-template-rows: auto 1fr auto;
+}
+
+.Chat.ChatFocus .ChatHeader {
+  grid-column: 1 / 3;
+}
+
+.Chat.ChatFocus .ProjectSidebar {
+  background: color-mix(in srgb, var(--ColorSideBarBackground, #232b35) 88%, #1f2b38 12%);
+  border-right: 1px solid var(--ColorBorder, #3a3d41);
+  box-shadow: inset -1px 0 0 rgba(0, 0, 0, 0.2);
+  display: flex;
+  flex-direction: column;
+  grid-column: 1;
+  grid-row: 2 / 4;
+  min-height: 0;
+}
+
+.Chat.ChatFocus .ProjectList {
+  min-height: 0;
+  overflow: auto;
+  padding: 10px 8px 12px;
+  scrollbar-color: color-mix(in srgb, var(--ColorScrollBarSliderBackground, #4b5563) 78%, transparent)
+    color-mix(in srgb, var(--ColorSideBarBackground, #232b35) 92%, transparent);
+  scrollbar-width: thin;
+}
+
+.Chat.ChatFocus .ProjectList::-webkit-scrollbar {
+  height: 10px;
+  width: 10px;
+}
+
+.Chat.ChatFocus .ProjectList::-webkit-scrollbar-track {
+  background: color-mix(in srgb, var(--ColorSideBarBackground, #232b35) 94%, transparent);
+  border-radius: 999px;
+}
+
+.Chat.ChatFocus .ProjectList::-webkit-scrollbar-thumb {
+  background: color-mix(in srgb, var(--ColorScrollBarSliderBackground, #4b5563) 70%, transparent);
+  border: 2px solid color-mix(in srgb, var(--ColorSideBarBackground, #232b35) 94%, transparent);
+  border-radius: 999px;
+}
+
+.Chat.ChatFocus .ProjectList::-webkit-scrollbar-thumb:hover {
+  background: color-mix(in srgb, var(--ColorScrollBarSliderHoverBackground, #667284) 80%, transparent);
+}
+
+.ProjectListGroup {
+  border: 1px solid transparent;
+  border-radius: 8px;
+  margin-bottom: 6px;
+  overflow: hidden;
+}
+
+.ProjectListItem {
+  align-items: center;
+  display: flex;
+  gap: 6px;
+  min-height: calc(var(--ChatListItemHeight) - 2px);
+}
+
+.ProjectListItemLabel {
+  align-items: center;
+  border-radius: 6px;
+  color: var(--ColorForeground, #d5dbe3);
+  cursor: pointer;
+  display: flex;
+  flex: 1;
+  font-weight: 500;
+  gap: 2px;
+  overflow: hidden;
+  padding: 0 10px;
+  text-overflow: ellipsis;
+  transition: background-color 80ms ease, color 80ms ease;
+  white-space: nowrap;
+}
+
+.ProjectListChevron {
+  color: color-mix(in srgb, var(--ColorForeground, #c8d0da) 70%, transparent);
+  display: inline-block;
+  flex: 0 0 12px;
+  font-size: 11px;
+  margin-right: 4px;
+  text-align: center;
+  width: 12px;
+}
+
+.ProjectListItemSelected {
+  background: color-mix(in srgb, var(--ColorListInactiveSelectionBackground, #39424d) 84%, #2f3741 16%);
+}
+
+.ProjectListItem:not(.ProjectListItemSelected) .ProjectListItemLabel:hover,
+.ProjectListItem:not(.ProjectListItemSelected) .ProjectListItemLabel:focus-visible {
+  background: color-mix(in srgb, var(--ColorListHoverBackground, #38414b) 50%, transparent);
+}
+
+.ProjectListItemSelected .ProjectListItemLabel {
+  color: var(--ColorListInactiveSelectionForeground, #e5ebf2);
+}
+
+.ProjectListItemActions {
+  display: flex;
+  padding-right: 6px;
+}
+
+.ProjectListItemAddChatButton {
+  align-items: center;
+  background: color-mix(in srgb, var(--ColorButtonSecondaryBackground, #3a434f) 76%, transparent);
+  border: 0;
+  border-radius: 5px;
+  color: var(--ColorForeground, #d0d8e2);
+  cursor: pointer;
+  display: inline-flex;
+  font-size: 13px;
+  font-weight: 500;
+  height: 18px;
+  justify-content: center;
+  opacity: 0;
+  padding: 0;
+  transition: opacity 90ms ease, background-color 90ms ease;
+  visibility: hidden;
+  width: 18px;
+}
+
+.ProjectListItem:hover .ProjectListItemAddChatButton,
+.ProjectListItem:focus-within .ProjectListItemAddChatButton {
+  opacity: 1;
+  visibility: visible;
+}
+
+.ProjectListItemAddChatButton:hover,
+.ProjectListItemAddChatButton:focus-visible {
+  background: color-mix(in srgb, var(--ColorButtonSecondaryHoverBackground, #4a5460) 82%, transparent);
+}
+
+.ProjectSessionItem {
+  align-items: center;
+  display: flex;
+  min-height: calc(var(--ChatListItemHeight) - 5px);
+}
+
+.ProjectSessionItemLabel {
+  border-radius: 6px;
+  color: color-mix(in srgb, var(--ColorForeground, #cfd7df) 92%, transparent);
+  cursor: pointer;
+  display: block;
+  flex: 1;
+  font-size: 12.5px;
+  overflow: hidden;
+  padding: 0 10px 0 28px;
+  text-overflow: ellipsis;
+  transition: background-color 80ms ease, color 80ms ease;
+  white-space: nowrap;
+}
+
+.ProjectSessionItemSelected {
+  background: color-mix(in srgb, var(--ColorListInactiveSelectionBackground, #353f4a) 86%, #2c3540 14%);
+}
+
+.ProjectSessionItem:not(.ProjectSessionItemSelected) .ProjectSessionItemLabel:hover,
+.ProjectSessionItem:not(.ProjectSessionItemSelected) .ProjectSessionItemLabel:focus-visible {
+  background: color-mix(in srgb, var(--ColorListHoverBackground, #38414c) 46%, transparent);
+}
+
+.ProjectSessionItemSelected .ProjectSessionItemLabel {
+  color: var(--ColorListInactiveSelectionForeground, #f2f6fc);
+}
+
+.Chat.ChatFocus .ProjectAddButton {
+  background: color-mix(in srgb, var(--ColorButtonSecondaryBackground, #21252c) 72%, transparent);
+  border: 0;
+  border-top: 1px solid color-mix(in srgb, var(--ColorBorder, #3a3d41) 70%, transparent);
+  color: var(--ColorForeground, #d2d9e2);
+  cursor: pointer;
+  font-size: 12.5px;
+  letter-spacing: 0.01em;
+  margin-top: auto;
+  min-height: var(--ChatListItemHeight);
+  padding: 0 12px;
+  text-align: left;
+  transition: background-color 80ms ease;
+}
+
+.Chat.ChatFocus .ProjectAddButton:hover,
+.Chat.ChatFocus .ProjectAddButton:focus-visible {
+  background: color-mix(in srgb, var(--ColorButtonSecondaryHoverBackground, #2a3039) 78%, transparent);
+}
+
+.ChatList,
+.ChatListEmpty,
+.ChatMessages {
+  min-height: 0;
+}
+
+.Chat.ChatFocus .ChatList,
+.Chat.ChatFocus .ChatListEmpty {
+  display: none;
+}
+
+.Chat.ChatFocus .ChatMessages {
+  grid-column: 2;
+  grid-row: 2;
+}
+
+.Chat.ChatFocus .ChatSendArea {
+  grid-column: 2;
+  grid-row: 3;
+}
 `;
   if (!renderHtmlCss.trim()) {
     return baseCss;
@@ -6666,6 +7239,19 @@ const ChatList = 'ChatList';
 const ChatListEmpty = 'ChatListEmpty';
 const ChatListItem = 'ChatListItem';
 const ChatListItemLabel = 'ChatListItemLabel';
+const ProjectAddButton = 'ProjectAddButton';
+const ProjectList = 'ProjectList';
+const ProjectListChevron = 'ProjectListChevron';
+const ProjectListGroup = 'ProjectListGroup';
+const ProjectListItem = 'ProjectListItem';
+const ProjectListItemActions = 'ProjectListItemActions';
+const ProjectListItemAddChatButton = 'ProjectListItemAddChatButton';
+const ProjectListItemLabel = 'ProjectListItemLabel';
+const ProjectListItemSelected = 'ProjectListItemSelected';
+const ProjectSessionItem = 'ProjectSessionItem';
+const ProjectSessionItemLabel = 'ProjectSessionItemLabel';
+const ProjectSessionItemSelected = 'ProjectSessionItemSelected';
+const ProjectSidebar = 'ProjectSidebar';
 const Markdown = 'Markdown';
 const MarkdownTable = 'MarkdownTable';
 const Message = 'Message';
@@ -6716,6 +7302,7 @@ const HandleDragLeave = 28;
 const HandleDrop = 29;
 const HandleDragEnterChatView = 30;
 const HandleDragOverChatView = 31;
+const HandleProjectListScroll = 32;
 
 const getModelLabel = model => {
   if (model.provider === 'openRouter') {
@@ -6832,82 +7419,6 @@ const getChatSendAreaDom = (composerValue, models, selectedModelId, usageOvervie
   }, ...getChatSelectVirtualDom(models, selectedModelId), ...(usageOverviewEnabled ? getUsageOverviewDom(tokensUsed, tokensMax) : []), ...getSendButtonDom(isSendDisabled)];
 };
 
-const getBackButtonVirtualDom = () => {
-  return [{
-    childCount: 1,
-    className: IconButton,
-    name: Back,
-    onClick: HandleClickBack,
-    role: Button$2,
-    title: backToChats(),
-    type: Button$1
-  }, {
-    childCount: 0,
-    className: 'MaskIcon MaskIconArrowLeft',
-    type: Div
-  }];
-};
-
-const getHeaderActionVirtualDom = item => {
-  return [{
-    childCount: 1,
-    className: IconButton,
-    name: item.name,
-    onClick: item.onClick,
-    title: item.title,
-    type: Button$1
-  }, {
-    childCount: 0,
-    className: item.icon,
-    type: Div
-  }];
-};
-
-const getChatHeaderActionsDom = () => {
-  const items = [{
-    icon: 'MaskIcon MaskIconDebugPause',
-    name: SessionDebug,
-    onClick: HandleClickSessionDebug,
-    title: debug()
-  }, {
-    icon: 'MaskIcon MaskIconAdd',
-    name: CreateSession,
-    onClick: HandleClickNew,
-    title: newChat()
-  }, {
-    icon: 'MaskIcon MaskIconSettingsGear',
-    name: Settings,
-    onClick: HandleClickSettings,
-    title: settings()
-  }, {
-    icon: 'MaskIcon MaskIconClose',
-    name: CloseChat,
-    onClick: HandleClickClose,
-    title: closeChat()
-  }];
-  return [{
-    childCount: items.length,
-    className: ChatActions,
-    type: Div
-  }, ...items.flatMap(getHeaderActionVirtualDom)];
-};
-
-const getChatHeaderDomDetailMode = selectedSessionTitle => {
-  return [{
-    childCount: 2,
-    className: ChatHeader,
-    type: Div
-  }, {
-    childCount: 2,
-    className: ChatName,
-    type: Div
-  }, ...getBackButtonVirtualDom(), {
-    childCount: 1,
-    className: Label,
-    type: Span
-  }, text(selectedSessionTitle), ...getChatHeaderActionsDom()];
-};
-
 const getInlineNodeDom = inlineNode => {
   if (inlineNode.type === 'text') {
     return [text(inlineNode.text)];
@@ -7447,8 +7958,12 @@ const getElementType = tagName => {
       return inlineTags.has(tagName) ? Span : Div;
   }
 };
+const isHttpUrl$1 = url => {
+  const normalized = url.trim().toLowerCase();
+  return normalized.startsWith('http://') || normalized.startsWith('https://');
+};
 const normalizeUrl = url => {
-  return url.toLowerCase().startsWith('javascript:') ? '#' : url;
+  return isHttpUrl$1(url) ? url : '#';
 };
 const getElementAttributes = node => {
   const attributes = {};
@@ -7593,6 +8108,13 @@ const markdownInlineRegex = /\[([^\]]+)\]\(([^)]+)\)|\*\*([^*]+)\*\*|\*([^*]+)\*
 const markdownTableSeparatorCellRegex = /^:?-{3,}:?$/;
 const fencedCodeBlockRegex = /^```/;
 const markdownHeadingRegex = /^\s*(#{1,6})\s+(.*)$/;
+const isHttpUrl = url => {
+  const normalized = url.trim().toLowerCase();
+  return normalized.startsWith('http://') || normalized.startsWith('https://');
+};
+const sanitizeUrl = url => {
+  return isHttpUrl(url) ? url : '#';
+};
 const normalizeEscapedNewlines = value => {
   if (value.includes('\\n')) {
     return value.replaceAll(/\\r\\n|\\n/g, '\n');
@@ -7662,7 +8184,7 @@ const parseInlineNodes = value => {
     }
     if (linkText && href) {
       nodes.push({
-        href,
+        href: sanitizeUrl(href),
         text: linkText,
         type: 'link'
       });
@@ -7870,6 +8392,204 @@ const getMessagesDom = (messages, openRouterApiKeyInput, openApiApiKeyInput = ''
   }, ...messages.flatMap(message => getChatMessageDom(message, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState))];
 };
 
+const getProjectSessionDom = (session, selectedSessionId) => {
+  const className = mergeClassNames(ProjectSessionItem, session.id === selectedSessionId ? ProjectSessionItemSelected : Empty);
+  return [{
+    childCount: 1,
+    className,
+    type: Div
+  }, {
+    childCount: 1,
+    className: ProjectSessionItemLabel,
+    name: getSessionInputName(session.id),
+    onClick: HandleClick,
+    tabIndex: 0,
+    type: Div
+  }, text(session.title)];
+};
+const getProjectGroupDom = (project, sessions, projectExpandedIds, selectedProjectId, selectedSessionId) => {
+  const expanded = projectExpandedIds.includes(project.id);
+  const projectClassName = mergeClassNames(ProjectListItem, project.id === selectedProjectId ? ProjectListItemSelected : Empty);
+  return [{
+    childCount: 1 + (expanded ? sessions.length : 0),
+    className: ProjectListGroup,
+    type: Div
+  }, {
+    childCount: 2,
+    className: projectClassName,
+    type: Div
+  }, {
+    childCount: 2,
+    className: ProjectListItemLabel,
+    name: getProjectInputName(project.id),
+    onClick: HandleClick,
+    tabIndex: 0,
+    type: Div
+  }, {
+    childCount: 1,
+    className: ProjectListChevron,
+    type: Span
+  }, text(expanded ? '▾' : '▸'), text(project.name), {
+    childCount: 1,
+    className: ProjectListItemActions,
+    type: Div
+  }, {
+    childCount: 1,
+    className: ProjectListItemAddChatButton,
+    name: getCreateSessionInProjectInputName(project.id),
+    onClick: HandleClick,
+    tabIndex: 0,
+    title: 'New chat in this project',
+    type: Button$1
+  }, text('+'), ...(expanded ? sessions.flatMap(session => getProjectSessionDom(session, selectedSessionId)) : [])];
+};
+const getProjectListDom = (projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop) => {
+  const blankProjectId = projects.find(project => project.name === '_blank')?.id || projects[0]?.id || '';
+  const projectGroups = projects.map(project => {
+    const projectSessions = sessions.filter(session => {
+      const sessionProjectId = session.projectId || blankProjectId;
+      return sessionProjectId === project.id;
+    });
+    return getProjectGroupDom(project, projectSessions, projectExpandedIds, selectedProjectId, selectedSessionId);
+  });
+  return [{
+    childCount: 2,
+    className: ProjectSidebar,
+    type: Div
+  }, {
+    childCount: projects.length,
+    className: ProjectList,
+    onScroll: HandleProjectListScroll,
+    scrollTop: projectListScrollTop,
+    type: Div
+  }, ...projectGroups.flat(), {
+    childCount: 1,
+    className: ProjectAddButton,
+    name: CreateProject,
+    onClick: HandleClick,
+    tabIndex: 0,
+    type: Button$1
+  }, text('+ Add Project')];
+};
+
+const getChatModeChatFocusVirtualDom = (sessions, selectedSessionId, composerValue, openRouterApiKeyInput, openApiApiKeyInput, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openRouterApiKeyState = 'idle', composerHeight = 28, composerFontSize = 13, composerFontFamily = 'system-ui', composerLineHeight = 20, messagesScrollTop = 0, composerDropActive = false, composerDropEnabled = true, projects = [], projectExpandedIds = [], selectedProjectId = '', projectListScrollTop = 0) => {
+  const selectedSession = sessions.find(session => session.id === selectedSessionId);
+  const selectedSessionTitle = selectedSession?.title || chatTitle();
+  const messages = selectedSession ? selectedSession.messages : [];
+  const isDropOverlayVisible = composerDropEnabled && composerDropActive;
+  return [{
+    childCount: 5,
+    className: mergeClassNames(Viewlet, Chat, 'ChatFocus'),
+    onDragEnter: HandleDragEnterChatView,
+    onDragOver: HandleDragOverChatView,
+    type: Div
+  }, {
+    childCount: 1,
+    className: ChatHeader,
+    type: Div
+  }, {
+    childCount: 1,
+    className: Label,
+    type: Span
+  }, {
+    text: selectedSessionTitle,
+    type: Text
+  }, ...getProjectListDom(projects, sessions, projectExpandedIds, selectedProjectId, selectedSessionId, projectListScrollTop), ...getMessagesDom(messages, openRouterApiKeyInput, openApiApiKeyInput, openRouterApiKeyState, messagesScrollTop), ...getChatSendAreaDom(composerValue, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, composerHeight, composerFontSize, composerFontFamily, composerLineHeight), {
+    childCount: 1,
+    className: mergeClassNames(ChatViewDropOverlay, isDropOverlayVisible ? ChatViewDropOverlayActive : Empty),
+    name: ComposerDropTarget,
+    onDragLeave: HandleDragLeave,
+    onDragOver: HandleDragOver,
+    onDrop: HandleDrop,
+    type: Div
+  }, {
+    text: attachImageAsContext(),
+    type: Text
+  }];
+};
+
+const getBackButtonVirtualDom = () => {
+  return [{
+    childCount: 1,
+    className: IconButton,
+    name: Back,
+    onClick: HandleClickBack,
+    role: Button$2,
+    title: backToChats(),
+    type: Button$1
+  }, {
+    childCount: 0,
+    className: 'MaskIcon MaskIconArrowLeft',
+    type: Div
+  }];
+};
+
+const getHeaderActionVirtualDom = item => {
+  return [{
+    childCount: 1,
+    className: IconButton,
+    name: item.name,
+    onClick: item.onClick,
+    title: item.title,
+    type: Button$1
+  }, {
+    childCount: 0,
+    className: item.icon,
+    type: Div
+  }];
+};
+
+const getChatHeaderActionsDom = viewMode => {
+  const toggleTitle = viewMode === 'chat-focus' ? normalChatMode() : chatFocusMode();
+  const items = [{
+    icon: 'MaskIcon MaskIconLayoutPanelLeft',
+    name: ToggleChatFocus,
+    onClick: HandleClick,
+    title: toggleTitle
+  }, {
+    icon: 'MaskIcon MaskIconDebugPause',
+    name: SessionDebug,
+    onClick: HandleClickSessionDebug,
+    title: debug()
+  }, {
+    icon: 'MaskIcon MaskIconAdd',
+    name: CreateSession,
+    onClick: HandleClickNew,
+    title: newChat()
+  }, {
+    icon: 'MaskIcon MaskIconSettingsGear',
+    name: Settings,
+    onClick: HandleClickSettings,
+    title: settings()
+  }, {
+    icon: 'MaskIcon MaskIconClose',
+    name: CloseChat,
+    onClick: HandleClickClose,
+    title: closeChat()
+  }];
+  return [{
+    childCount: items.length,
+    className: ChatActions,
+    type: Div
+  }, ...items.flatMap(getHeaderActionVirtualDom)];
+};
+
+const getChatHeaderDomDetailMode = selectedSessionTitle => {
+  return [{
+    childCount: 2,
+    className: ChatHeader,
+    type: Div
+  }, {
+    childCount: 2,
+    className: ChatName,
+    type: Div
+  }, ...getBackButtonVirtualDom(), {
+    childCount: 1,
+    className: Label,
+    type: Span
+  }, text(selectedSessionTitle), ...getChatHeaderActionsDom('detail')];
+};
+
 const getChatModeDetailVirtualDom = (sessions, selectedSessionId, composerValue, openRouterApiKeyInput, openApiApiKeyInput, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openRouterApiKeyState = 'idle', composerHeight = 28, composerFontSize = 13, composerFontFamily = 'system-ui', composerLineHeight = 20, messagesScrollTop = 0, composerDropActive = false, composerDropEnabled = true) => {
   const selectedSession = sessions.find(session => session.id === selectedSessionId);
   const selectedSessionTitle = selectedSession?.title || chatTitle();
@@ -7904,7 +8624,7 @@ const getChatHeaderListModeDom = () => {
     childCount: 1,
     className: Label,
     type: Span
-  }, text(chats()), ...getChatHeaderActionsDom()];
+  }, text(chats()), ...getChatHeaderActionsDom('list')];
 };
 
 const getEmptyChatSessionsDom = () => {
@@ -7991,8 +8711,10 @@ const getChatModeUnsupportedVirtualDom = () => {
   }, text(unknownViewMode())];
 };
 
-const getChatVirtualDom = (sessions, selectedSessionId, composerValue, openRouterApiKeyInput, viewMode, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openApiApiKeyInput, openRouterApiKeyState, composerHeight, composerFontSize, composerFontFamily, composerLineHeight, chatListScrollTop, messagesScrollTop, composerDropActive = false, composerDropEnabled = true) => {
+const getChatVirtualDom = (sessions, selectedSessionId, composerValue, openRouterApiKeyInput, viewMode, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openApiApiKeyInput, openRouterApiKeyState, composerHeight, composerFontSize, composerFontFamily, composerLineHeight, chatListScrollTop, messagesScrollTop, composerDropActive = false, composerDropEnabled = true, projects = [], projectExpandedIds = [], selectedProjectId = '', projectListScrollTop = 0) => {
   switch (viewMode) {
+    case 'chat-focus':
+      return getChatModeChatFocusVirtualDom(sessions, selectedSessionId, composerValue, openRouterApiKeyInput, openApiApiKeyInput, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openRouterApiKeyState, composerHeight, composerFontSize, composerFontFamily, composerLineHeight, messagesScrollTop, composerDropActive, composerDropEnabled, projects, projectExpandedIds, selectedProjectId, projectListScrollTop);
     case 'detail':
       return getChatModeDetailVirtualDom(sessions, selectedSessionId, composerValue, openRouterApiKeyInput, openApiApiKeyInput, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openRouterApiKeyState, composerHeight, composerFontSize, composerFontFamily, composerLineHeight, messagesScrollTop, composerDropActive, composerDropEnabled);
     case 'list':
@@ -8018,7 +8740,11 @@ const renderItems = (oldState, newState) => {
     openApiApiKeyInput,
     openRouterApiKeyInput,
     openRouterApiKeyState,
+    projectExpandedIds,
+    projectListScrollTop,
+    projects,
     selectedModelId,
+    selectedProjectId,
     selectedSessionId,
     sessions,
     tokensMax,
@@ -8030,7 +8756,7 @@ const renderItems = (oldState, newState) => {
   if (initial) {
     return [SetDom2, uid, []];
   }
-  const dom = getChatVirtualDom(sessions, selectedSessionId, composerValue, openRouterApiKeyInput, viewMode, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openApiApiKeyInput, openRouterApiKeyState, composerHeight, composerFontSize, composerFontFamily, composerLineHeight, chatListScrollTop, messagesScrollTop, composerDropActive, composerDropEnabled);
+  const dom = getChatVirtualDom(sessions, selectedSessionId, composerValue, openRouterApiKeyInput, viewMode, models, selectedModelId, usageOverviewEnabled, tokensUsed, tokensMax, openApiApiKeyInput, openRouterApiKeyState, composerHeight, composerFontSize, composerFontFamily, composerLineHeight, chatListScrollTop, messagesScrollTop, composerDropActive, composerDropEnabled, projects, projectExpandedIds, selectedProjectId, projectListScrollTop);
   return [SetDom2, uid, dom];
 };
 
@@ -8167,6 +8893,9 @@ const renderEventListeners = () => {
   }, {
     name: HandleMessagesScroll,
     params: ['handleMessagesScroll', 'event.target.scrollTop']
+  }, {
+    name: HandleProjectListScroll,
+    params: ['handleProjectListScroll', 'event.target.scrollTop']
   }, {
     name: HandleMessagesContextMenu,
     params: ['handleMessagesContextMenu'],
@@ -8214,20 +8943,30 @@ const saveState = state => {
   const {
     chatListScrollTop,
     composerValue,
+    lastNormalViewMode,
     messagesScrollTop,
     nextMessageId,
+    projectExpandedIds,
+    projectListScrollTop,
+    projects,
     renamingSessionId,
     selectedModelId,
+    selectedProjectId,
     selectedSessionId,
     viewMode
   } = state;
   return {
     chatListScrollTop,
     composerValue,
+    lastNormalViewMode,
     messagesScrollTop,
     nextMessageId,
+    projectExpandedIds,
+    projectListScrollTop,
+    projects,
     renamingSessionId,
     selectedModelId,
+    selectedProjectId,
     selectedSessionId,
     viewMode
   };
@@ -8326,6 +9065,7 @@ const commandMap = {
   'Chat.handleMessagesContextMenu': wrapCommand(handleMessagesContextMenu),
   'Chat.handleMessagesScroll': wrapCommand(handleMessagesScroll),
   'Chat.handleModelChange': wrapCommand(handleModelChange),
+  'Chat.handleProjectListScroll': wrapCommand(handleProjectListScroll),
   'Chat.handleSubmit': wrapCommand(handleSubmit),
   'Chat.initialize': initialize,
   'Chat.loadContent': wrapCommand(loadContent),

package/package.json

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