🚸 feat: 优化每个角色的初始引导

close lobehub#76

.eslintrc.js

@@ -9,5 +9,6 @@ config.rules['unicorn/no-null'] = 0;
 config.rules['unicorn/no-typeof-undefined'] = 0;
 config.rules['unicorn/explicit-length-check'] = 0;
 config.rules['unicorn/prefer-code-point'] = 0;
+config.rules['no-extra-boolean-cast'] = 0;
 
 module.exports = config;

src/locales/default/common.ts

@@ -1,6 +1,10 @@
 export default {
   about: '关于',
   advanceSettings: '高级设置',
+  agentDefaultMessage:
+    '你好，我是你的自定义助手，你可以立即与我开始对话，也可以前往 [助手设置](/chat/{{id}}/setting) 完善我的信息。',
+  agentDefaultMessageWithSystemRole:
+    '你好，我是你的自定义助手，我的角色设定如下: \n\n --- \n\n {{systemRole}} \n\n --- \n\n 立即与我开始对话吧~',
   agentMaxToken: '会话最大长度',
   agentModel: '模型',
   agentProfile: '助手信息',
@@ -31,6 +35,7 @@ export default {
   },
   feedback: '反馈与建议',
   import: '导入配置',
+
   inbox: {
     defaultMessage:
       '你好，我是你的智能助手，你可以问我任何问题，我会尽力回答你。如果需要获得更加专业或定制的助手，可以点击「+」创建自定义助手',

src/pages/chat/features/Conversation/ChatList/index.tsx

@@ -1,11 +1,9 @@
 import { ChatList, RenderErrorMessage, RenderMessage } from '@lobehub/ui';
 import isEqual from 'fast-deep-equal';
-import { memo, useCallback, useMemo } from 'react';
+import { memo, useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
-import { DEFAULT_INBOX_AVATAR } from '@/const/meta';
-import { INBOX_SESSION_ID } from '@/const/session';
 import {
   agentSelectors,
   chatSelectors,
@@ -38,11 +36,10 @@ const List = () => {
   const init = useSessionHydrated();
   const { t } = useTranslation('common');
 
-  const data = useSessionStore(chatSelectors.currentChats, isEqual);
+  const data = useSessionStore(chatSelectors.currentChatsWithGuideMessage, isEqual);
 
-  const [isInbox, displayMode, chatLoadingId, deleteMessage, resendMessage, dispatchMessage] =
+  const [displayMode, chatLoadingId, deleteMessage, resendMessage, dispatchMessage] =
     useSessionStore((s) => [
-      s.activeId === INBOX_SESSION_ID,
       agentSelectors.currentAgentConfig(s).displayMode,
       s.chatLoadingId,
       s.deleteMessage,
@@ -81,28 +78,11 @@ const List = () => {
     [chatLoadingId],
   );
 
-  // 针对 inbox 添加初始化时的自定义消息
-  const displayDataSource = useMemo(() => {
-    const emptyGuideMessage = {
-      content: t('inbox.defaultMessage'),
-      createAt: Date.now(),
-      extra: {},
-      id: 'default',
-      meta: {
-        avatar: DEFAULT_INBOX_AVATAR,
-      },
-      role: 'assistant',
-      updateAt: Date.now(),
-    } as ChatMessage;
-
-    return isInbox && data.length === 0 ? [emptyGuideMessage] : data;
-  }, [data]);
-
   return !init ? (
     <SkeletonList />
   ) : (
     <ChatList
-      data={displayDataSource}
+      data={data}
       loadingId={chatLoadingId}
       onActionClick={(key, id) => {
         switch (key) {

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

@@ -1,11 +1,15 @@
-import { DEFAULT_USER_AVATAR } from '@/const/meta';
+import { t } from 'i18next';
+
+import { DEFAULT_INBOX_AVATAR, DEFAULT_USER_AVATAR } from '@/const/meta';
+import { INBOX_SESSION_ID } from '@/const/session';
 import { useGlobalStore } from '@/store/global';
 import { ChatMessage } from '@/types/chatMessage';
 
 import type { SessionStore } from '../../../store';
 import { agentSelectors } from '../../agentConfig';
 import { sessionSelectors } from '../../session/selectors';
 import { getSlicedMessagesWithConfig } from '../utils';
+import { currentTopics } from './topic';
 import { organizeChats } from './utils';
 
 export const getChatsById =
@@ -36,6 +40,37 @@ export const currentChats = (s: SessionStore): ChatMessage[] => {
   return getChatsById(s.activeId)(s);
 };
 
+// 针对新助手添加初始化时的自定义消息
+export const currentChatsWithGuideMessage = (s: SessionStore): ChatMessage[] => {
+  const data = currentChats(s);
+  const noTopic = currentTopics(s);
+
+  const isBrandNewChat = data.length === 0 && noTopic;
+
+  if (!isBrandNewChat) return data;
+
+  const [activeId, isInbox] = [s.activeId, s.activeId === INBOX_SESSION_ID];
+  const systemRole = agentSelectors.currentAgentSystemRole(s);
+
+  const emptyInboxGuideMessage = {
+    content: isInbox
+      ? t('inbox.defaultMessage')
+      : !!systemRole
+      ? t('agentDefaultMessageWithSystemRole', { systemRole })
+      : t('agentDefaultMessage', { id: activeId }),
+    createAt: Date.now(),
+    extra: {},
+    id: 'default',
+    meta: {
+      avatar: DEFAULT_INBOX_AVATAR,
+    },
+    role: 'assistant',
+    updateAt: Date.now(),
+  } as ChatMessage;
+
+  return [emptyInboxGuideMessage];
+};
+
 export const currentChatsWithHistoryConfig = (s: SessionStore): ChatMessage[] => {
   const chats = currentChats(s);
   const config = agentSelectors.currentAgentConfig(s);

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

@@ -1,10 +1,11 @@
-import { currentChats, getChatsById } from './chat';
+import { currentChats, currentChatsWithGuideMessage, getChatsById } from './chat';
 import { chatsTokenCount, systemRoleTokenCount, totalTokenCount } from './token';
 import { currentTopics, getTopicMessages } from './topic';
 
 export const chatSelectors = {
   chatsTokenCount,
   currentChats,
+  currentChatsWithGuideMessage,
   getChatsById,
   systemRoleTokenCount,
   totalTokenCount,