Merge pull request #94 from MarioJames/feature/langModel

fix: 修复切换对话候语言模型配置使用错误问题

src/features/Actions/ModelSelect.tsx

@@ -5,7 +5,8 @@ import { memo } from 'react';
 import ModelIcon from '@/components/ModelIcon';
 import ModelTag from '@/components/ModelTag';
 import { OPENAI_MODEL_LIST } from '@/constants/openai';
-import { agentSelectors, useAgentStore } from '@/store/agent';
+import useSessionContext from '@/hooks/useSessionContext';
+import { useAgentStore } from '@/store/agent';
 
 const useStyles = createStyles(({ css, prefixCls }) => ({
   menu: css`
@@ -34,7 +35,7 @@ const ModelSelect = memo(() => {
 
   const { updateChatModel } = useAgentStore();
 
-  const { model } = agentSelectors.currentAgentChatModel(useAgentStore.getState()) || {};
+  const model = useSessionContext()?.sessionAgent?.chatModel?.model;
 
   const items = OPENAI_MODEL_LIST.map((item) => {
     return {

src/features/Actions/Token.tsx

@@ -2,15 +2,15 @@ import { TokenTag } from '@lobehub/ui';
 
 import { OPENAI_MODEL_LIST } from '@/constants/openai';
 import { useCalculateToken } from '@/hooks/useCalculateToken';
-import { agentSelectors, useAgentStore } from '@/store/agent';
+import useSessionContext from '@/hooks/useSessionContext';
 
 const Token = () => {
-  const chatModel = agentSelectors.currentAgentChatModel(useAgentStore.getState());
+  const model = useSessionContext()?.sessionAgent?.chatModel?.model;
   const usedTokens = useCalculateToken();
 
   return (
     <TokenTag
-      maxValue={OPENAI_MODEL_LIST.find((item) => item.id === chatModel?.model)?.tokens || 4096}
+      maxValue={OPENAI_MODEL_LIST.find((item) => item.id === model)?.tokens || 4096}
       value={usedTokens}
       text={{ overload: 'Token 超出', remained: 'Token 剩余', used: 'Token 已使用' }}
     />

src/features/Actions/TokenMini.tsx

@@ -2,12 +2,13 @@ import { Tooltip, Typography } from 'antd';
 
 import { OPENAI_MODEL_LIST } from '@/constants/openai';
 import { useCalculateToken } from '@/hooks/useCalculateToken';
-import { agentSelectors, useAgentStore } from '@/store/agent';
+import useSessionContext from '@/hooks/useSessionContext';
 
 const TokenMini = () => {
-  const chatModel = agentSelectors.currentAgentChatModel(useAgentStore.getState());
+  const model = useSessionContext()?.sessionAgent?.chatModel?.model;
+
   const usedTokens = useCalculateToken();
-  const maxValue = OPENAI_MODEL_LIST.find((item) => item.id === chatModel?.model)?.tokens || 4096;
+  const maxValue = OPENAI_MODEL_LIST.find((item) => item.id === model)?.tokens || 4096;
 
   return (
     <Tooltip title={`消耗 Token 数量计算，包括消息，角色设定与上下文：${usedTokens} / ${maxValue}`}>

src/features/SessionList/Elsa/index.tsx

@@ -2,21 +2,19 @@ import { Space, Tag } from 'antd';
 import { memo } from 'react';
 
 import { LOBE_VIDOL_DEFAULT_AGENT_ID } from '@/constants/agent';
+import useSessionContext from '@/hooks/useSessionContext';
 import { useAgentStore } from '@/store/agent';
-import { useSessionStore } from '@/store/session';
 
 import ListItem from '../ListItem';
 
 const Elsa = memo(() => {
-  const [activeId, switchSession] = useSessionStore((s) => [s.activeId, s.switchSession]);
   const defaultAgent = useAgentStore((s) => s.defaultAgent);
+  const { activeSessionId, switchSession } = useSessionContext();
 
   return (
     <ListItem
-      onClick={() => {
-        switchSession(LOBE_VIDOL_DEFAULT_AGENT_ID);
-      }}
-      active={activeId === LOBE_VIDOL_DEFAULT_AGENT_ID}
+      onClick={() => switchSession(LOBE_VIDOL_DEFAULT_AGENT_ID)}
+      active={activeSessionId === LOBE_VIDOL_DEFAULT_AGENT_ID}
       avatar={defaultAgent.meta.avatar}
       title={
         <Space align={'center'}>

src/features/SessionList/List/Item/index.tsx

@@ -1,6 +1,6 @@
 import { memo, useMemo, useState } from 'react';
 
-import { sessionSelectors, useSessionStore } from '@/store/session';
+import useSessionContext from '@/hooks/useSessionContext';
 
 import ListItem from '../../ListItem';
 import Actions from './Actions';
@@ -12,19 +12,19 @@ interface SessionItemProps {
 
 const SessionItem = memo<SessionItemProps>(({ id, onClick }) => {
   const [open, setOpen] = useState(false);
-  const [active] = useSessionStore((s) => [s.activeId === id]);
-  const agent = useSessionStore((s) => sessionSelectors.getAgentById(s)(id));
+  const { activeSessionId, getAgentById } = useSessionContext();
 
-  const { name, avatar } = agent?.meta || {};
+  const { greeting, meta: { name = '', avatar = '', description = '' } = {} } =
+    getAgentById(id) || {};
 
   const actions = useMemo(() => <Actions id={id} setOpen={setOpen} />, [id]);
 
   return (
     <ListItem
       actions={actions}
-      active={active}
+      active={activeSessionId === id}
       avatar={avatar || ''}
-      description={agent?.greeting || agent?.meta.description || ''}
+      description={greeting || description || ''}
       onClick={onClick}
       showAction={open}
       title={name}

src/features/SessionList/List/index.tsx

@@ -3,6 +3,7 @@ import { isEqual } from 'lodash-es';
 import { memo } from 'react';
 import LazyLoad from 'react-lazy-load';
 
+import useSessionContext from '@/hooks/useSessionContext';
 import { useSessionStore } from '@/store/session';
 import { sessionSelectors } from '@/store/session/selectors';
 
@@ -23,17 +24,13 @@ const SessionList = memo<SessionListProps>(({ filter }) => {
     (s) => sessionSelectors.filterSessionListIds(s, filter),
     isEqual,
   );
-  const [switchSession] = useSessionStore((s) => [s.switchSession]);
   const { styles } = useStyles();
 
+  const { switchSession } = useSessionContext();
+
   return sessionListIds.map((id) => (
     <LazyLoad className={styles} key={id}>
-      <SessionItem
-        id={id}
-        onClick={() => {
-          switchSession(id);
-        }}
-      />
+      <SessionItem id={id} onClick={() => switchSession(id)} />
     </LazyLoad>
   ));
 });

src/hooks/useSessionContext.ts

@@ -0,0 +1,17 @@
+import { sessionSelectors, useSessionStore } from '@/store/session';
+
+const useSessionContext = () => {
+  const [activeSessionId, switchSession] = useSessionStore((s) => [s.activeId, s.switchSession]);
+
+  const getAgentById = sessionSelectors.getAgentById(useSessionStore.getState());
+  const sessionAgent = getAgentById(activeSessionId);
+
+  return {
+    activeSessionId,
+    sessionAgent,
+    switchSession,
+    getAgentById,
+  };
+};
+
+export default useSessionContext;