@lobehub/chat 0.16.0 → 0.16.1

package/CHANGELOG.md

@@ -2,6 +2,39 @@
 
 # Changelog
 
+### [Version 0.16.1](https://github.com/lobehub/lobe-chat/compare/v0.16.0...v0.16.1)
+
+<sup>Released on **2023-07-24**</sup>
+
+#### ♻ Code Refactoring
+
+- **misc**: 重构优化 selectors 实现.
+
+#### 💄 Styles
+
+- **misc**: 优化 document title.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Code refactoring
+
+- **misc**: 重构优化 selectors 实现 ([97fe1cd](https://github.com/lobehub/lobe-chat/commit/97fe1cd))
+
+#### Styles
+
+- **misc**: 优化 document title ([c3cda00](https://github.com/lobehub/lobe-chat/commit/c3cda00))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ## [Version 0.16.0](https://github.com/lobehub/lobe-chat/compare/v0.15.1...v0.16.0)
 
 <sup>Released on **2023-07-24**</sup>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "0.16.0",
+  "version": "0.16.1",
   "description": "Lobe Chat is an open-source chatbot client using LangChain, Typescript and Next.js",
   "keywords": [
     "chatbot",

package/src/locales/default/setting.ts

@@ -17,6 +17,7 @@ export default {
   header: {
     global: '全局设置',
     session: '会话设置',
+    sessionWithName: '会话设置 · {{name}}',
   },
   settingAgent: {
     avatar: {

package/src/pages/chat/SessionList/List/SessionItem.tsx

@@ -6,7 +6,7 @@ import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 import { shallow } from 'zustand/shallow';
 
-import { chatSelectors, sessionSelectors, useSessionStore } from '@/store/session';
+import { agentSelectors, chatSelectors, sessionSelectors, useSessionStore } from '@/store/session';
 import { useSettings } from '@/store/settings';
 
 import { useStyles } from './style';
@@ -39,10 +39,10 @@ const SessionItem: FC<SessionItemProps> = memo(({ id, active = true, loading })
     const meta = session.meta;
     const systemRole = session.config.systemRole;
     return [
-      meta.title,
+      agentSelectors.getTitle(meta),
       meta.description,
       systemRole,
-      sessionSelectors.getAgentAvatar(meta),
+      agentSelectors.getAvatar(meta),
       meta.backgroundColor,
       session?.updateAt,
       session.config.model,
@@ -95,7 +95,7 @@ const SessionItem: FC<SessionItemProps> = memo(({ id, active = true, loading })
         }
         loading={loading}
         style={{ color: theme.colorText }}
-        title={title || t('defaultSession')}
+        title={title}
       />
       <Popconfirm
         arrow={false}

package/src/pages/chat/SessionList/List/index.tsx

@@ -8,7 +8,7 @@ import { sessionSelectors, useSessionStore } from '@/store/session';
 import SessionItem from './SessionItem';
 
 const SessionList = memo(() => {
-  const list = useSessionStore((s) => sessionSelectors.chatList(s), isEqual);
+  const list = useSessionStore((s) => sessionSelectors.sessionList(s), isEqual);
   const [activeId, loading] = useSessionStore(
     (s) => [s.activeId, s.autocompleteLoading.title],
     shallow,

package/src/pages/chat/[id]/edit/index.page.tsx

@@ -2,9 +2,11 @@ import Head from 'next/head';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
+import { shallow } from 'zustand/shallow';
 
 import HeaderSpacing from '@/components/HeaderSpacing';
 import { HEADER_HEIGHT } from '@/const/layoutTokens';
+import { agentSelectors, useSessionStore } from '@/store/session';
 import { genSiteHeadTitle } from '@/utils/genSiteHeadTitle';
 
 import ChatLayout from '../../layout';
@@ -17,7 +19,8 @@ import Header from './Header';
 const EditPage = memo(() => {
   const { t } = useTranslation('setting');
 
-  const pageTitle = genSiteHeadTitle(t('header.session'));
+  const title = useSessionStore(agentSelectors.currentAgentTitle, shallow);
+  const pageTitle = genSiteHeadTitle(t('header.sessionWithName', { name: title }));
 
   return (
     <>

package/src/pages/chat/index.page.tsx

@@ -6,14 +6,14 @@ import { sessionSelectors, useSessionStore } from '@/store/session';
 import Chat from './[id]/index.page';
 
 export default () => {
-  // 支持用户在进到首页时，自动激活第一个列表中的角色
+  // 支持用户在进到首页时，自动激活列表中的第一个角色
   useEffect(() => {
     const hasRehydrated = useSessionStore.persist.hasHydrated();
     // 只有当水合完毕后，才往下走
     if (!hasRehydrated) return;
 
     // 如果当前有会话，那么就激活第一个会话
-    const list = sessionSelectors.chatList(useSessionStore.getState());
+    const list = sessionSelectors.sessionList(useSessionStore.getState());
     if (list.length > 0) {
       const sessionId = list[0].id;
       Router.push(`/chat/${sessionId}`);

package/src/store/session/slices/agentConfig/selectors.ts

@@ -1,3 +1,5 @@
+import { t } from 'i18next';
+
 import { DEFAULT_AVATAR, DEFAULT_BACKGROUND_COLOR } from '@/const/meta';
 import { SessionStore } from '@/store/session';
 import { LanguageModel } from '@/types/llm';
@@ -13,7 +15,7 @@ const currentAgentMeta = (s: SessionStore): MetaData => {
   return { avatar: DEFAULT_AVATAR, backgroundColor: DEFAULT_BACKGROUND_COLOR, ...session?.meta };
 };
 
-const currentAgentTitle = (s: SessionStore) => currentAgentMeta(s)?.title;
+const currentAgentTitle = (s: SessionStore) => currentAgentMeta(s)?.title || t('defaultSession');
 
 const currentAgentBackgroundColor = (s: SessionStore) => {
   const session = sessionSelectors.currentSession(s);
@@ -51,6 +53,10 @@ const hasSystemRole = (s: SessionStore) => {
 
   return !!config.systemRole;
 };
+
+export const getAvatar = (s: MetaData) => s.avatar || DEFAULT_AVATAR;
+export const getTitle = (s: MetaData) => s.title || t('defaultSession');
+
 export const agentSelectors = {
   currentAgentAvatar,
   currentAgentBackgroundColor,
@@ -60,5 +66,7 @@ export const agentSelectors = {
   currentAgentModel,
   currentAgentSystemRole,
   currentAgentTitle,
+  getAvatar,
+  getTitle,
   hasSystemRole,
 };

package/src/store/session/slices/session/selectors/index.ts

@@ -1,20 +1,15 @@
-import { getAgentAvatar } from './chat';
 import {
-  chatListSel,
   currentSessionSafe,
   currentSessionSel,
   getSessionById,
   getSessionMetaById,
+  sessionList,
 } from './list';
 
 export const sessionSelectors = {
-  chatList: chatListSel,
   currentSession: currentSessionSel,
   currentSessionSafe,
-
-  getAgentAvatar,
-
   getSessionById,
-  // sessionTree: sessionTreeSel,
   getSessionMetaById,
+  sessionList,
 };

package/src/store/session/slices/session/selectors/list.ts

@@ -14,7 +14,7 @@ export const currentSessionSafe = (s: SessionStore): LobeAgentSession => {
   return currentSessionSel(s) || initLobeSession;
 };
 
-export const chatListSel = (s: SessionStore) => {
+export const sessionList = (s: SessionStore) => {
   const filterChats = filterWithKeywords(s.sessions, s.searchKeywords, (item) => [
     Object.values(item.chats)
       .map((c) => c.content)

package/src/utils/genSiteHeadTitle.ts

@@ -1 +1 @@
-export const genSiteHeadTitle = (title?: string) => (title ? `${title} - LobeChat` : 'LobeChat');
+export const genSiteHeadTitle = (title?: string) => (title ? `${title} · LobeChat` : 'LobeChat');

package/src/store/session/slices/session/selectors/chat.ts

@@ -1,4 +0,0 @@
-import { DEFAULT_AVATAR } from '@/const/meta';
-import { MetaData } from '@/types/meta';
-
-export const getAgentAvatar = (s: MetaData) => s.avatar || DEFAULT_AVATAR;