@lobehub/chat 0.160.6 → 0.160.8

package/CHANGELOG.md

@@ -2,6 +2,56 @@
 
 # Changelog
 
+### [Version 0.160.8](https://github.com/lobehub/lobe-chat/compare/v0.160.7...v0.160.8)
+
+<sup>Released on **2024-05-21**</sup>
+
+#### 💄 Styles
+
+- **misc**: `Tooltip` should not be selected & Model selector overlaps with reset button.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Styles
+
+- **misc**: `Tooltip` should not be selected & Model selector overlaps with reset button, closes [#2500](https://github.com/lobehub/lobe-chat/issues/2500) [#2511](https://github.com/lobehub/lobe-chat/issues/2511) [#2581](https://github.com/lobehub/lobe-chat/issues/2581) ([0c62fb7](https://github.com/lobehub/lobe-chat/commit/0c62fb7))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
+### [Version 0.160.7](https://github.com/lobehub/lobe-chat/compare/v0.160.6...v0.160.7)
+
+<sup>Released on **2024-05-21**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Fix duplicate model panel key.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Fix duplicate model panel key, closes [#2591](https://github.com/lobehub/lobe-chat/issues/2591) ([c733fcf](https://github.com/lobehub/lobe-chat/commit/c733fcf))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 0.160.6](https://github.com/lobehub/lobe-chat/compare/v0.160.5...v0.160.6)
 
 <sup>Released on **2024-05-21**</sup>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "0.160.6",
+  "version": "0.160.8",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",

package/src/app/(main)/settings/llm/components/ProviderModelList/ModelFetcher.tsx

@@ -55,6 +55,7 @@ const ModelFetcher = memo<ModelFetcherProps>(({ provider }) => {
       <Flexbox align={'center'} gap={0} horizontal justify={'space-between'}>
         <div>{t('llm.modelList.total', { count: totalModels })}</div>
         <Tooltip
+          overlayStyle={{ pointerEvents: 'none' }}
           title={
             latestFetchTime
               ? t('llm.fetcher.latestTime', {

package/src/app/(main)/settings/llm/components/ProviderModelList/index.tsx

@@ -16,6 +16,13 @@ import ModelFetcher from './ModelFetcher';
 import OptionRender from './Option';
 
 const styles = {
+  divStyle: css`
+    position: relative;
+
+    .ant-select-selector {
+      padding-inline-end: 50px !important;
+    }
+  `,
   popup: css`
     &.ant-select-dropdown {
       .ant-select-item-option-selected {
@@ -69,7 +76,7 @@ const ProviderModelListSelect = memo<CustomModelSelectProps>(
     return (
       <>
         <Flexbox gap={8}>
-          <div style={{ position: 'relative' }}>
+          <div className={cx(styles.divStyle)}>
             <div className={cx(styles.reset)}>
               {showReset && (
                 <ActionIcon

package/src/components/ModelSelect/index.tsx

@@ -79,14 +79,22 @@ export const ModelInfoTags = memo<ModelInfoTagsProps>(
     return (
       <Flexbox direction={directionReverse ? 'horizontal-reverse' : 'horizontal'} gap={4}>
         {model.files && (
-          <Tooltip placement={placement} title={t('ModelSelect.featureTag.file')}>
-            <div className={cx(styles.tag, styles.tagGreen)}>
+          <Tooltip 
+            overlayStyle={{ pointerEvents: 'none' }}
+            placement={placement} 
+            title={t('ModelSelect.featureTag.file')} 
+          >
+            <div className={cx(styles.tag, styles.tagGreen)} style={{ cursor: 'pointer' }} title="">
               <Icon icon={LucidePaperclip} />
             </div>
           </Tooltip>
         )}
         {model.vision && (
-          <Tooltip placement={placement} title={t('ModelSelect.featureTag.vision')}>
+          <Tooltip 
+            overlayStyle={{ pointerEvents: 'none' }}
+            placement={placement} 
+            title={t('ModelSelect.featureTag.vision')}
+          >
             <div className={cx(styles.tag, styles.tagGreen)} style={{ cursor: 'pointer' }} title="">
               <Icon icon={LucideEye} />
             </div>
@@ -94,7 +102,7 @@ export const ModelInfoTags = memo<ModelInfoTagsProps>(
         )}
         {model.functionCall && (
           <Tooltip
-            overlayStyle={{ maxWidth: 'unset' }}
+            overlayStyle={{ maxWidth: 'unset', pointerEvents: 'none' }}
             placement={placement}
             title={t('ModelSelect.featureTag.functionCall')}
           >
@@ -105,7 +113,7 @@ export const ModelInfoTags = memo<ModelInfoTagsProps>(
         )}
         {model.tokens !== undefined && (
           <Tooltip
-            overlayStyle={{ maxWidth: 'unset' }}
+            overlayStyle={{ maxWidth: 'unset', pointerEvents: 'none' }}
             placement={placement}
             title={t('ModelSelect.featureTag.tokens', {
               tokens: model.tokens === 0 ? '∞' : numeral(model.tokens).format('0,0'),

package/src/features/AgentSetting/AgentMeta/index.tsx

@@ -132,4 +132,4 @@ const AgentMeta = memo(() => {
   return <Form items={[metaData]} itemsType={'group'} variant={'pure'} {...FORM_STYLE} />;
 });
 
-export default AgentMeta;
+export default AgentMeta;

package/src/features/ModelSwitchPanel/index.tsx

@@ -38,11 +38,14 @@ const useStyles = createStyles(({ css, prefixCls }) => ({
   `,
 }));
 
+const menuKey = (provider: string, model: string) => `${provider}-${model}`;
+
 const ModelSwitchPanel = memo<PropsWithChildren>(({ children }) => {
   const { t } = useTranslation('components');
   const { styles, theme } = useStyles();
-  const [model, updateAgentConfig] = useAgentStore((s) => [
+  const [model, provider, updateAgentConfig] = useAgentStore((s) => [
     agentSelectors.currentAgentModel(s),
+    agentSelectors.currentAgentModelProvider(s),
     s.updateAgentConfig,
   ]);
 
@@ -52,7 +55,7 @@ const ModelSwitchPanel = memo<PropsWithChildren>(({ children }) => {
   const items = useMemo<ItemType[]>(() => {
     const getModelItems = (provider: ModelProviderCard) => {
       const items = provider.chatModels.map((model) => ({
-        key: model.id,
+        key: menuKey(provider.id, model.id),
         label: <ModelItemRender {...model} />,
         onClick: () => {
           updateAgentConfig({ model: model.id, provider: provider.id });
@@ -91,7 +94,7 @@ const ModelSwitchPanel = memo<PropsWithChildren>(({ children }) => {
   return (
     <Dropdown
       menu={{
-        activeKey: model,
+        activeKey: menuKey(provider, model),
         className: styles.menu,
         items,
         style: {

package/src/features/PluginStore/index.tsx

@@ -50,4 +50,4 @@ export const PluginStore = memo<PluginStoreProps>(({ setOpen, open }) => {
   );
 });
 
-export default PluginStore;
+export default PluginStore;

package/src/store/agent/slices/chat/selectors.test.ts

@@ -157,7 +157,7 @@ describe('agentSelectors', () => {
       expect(provider).toBe(mockSessionStore.agentConfig.provider);
     });
 
-    it('should return undefined if provider is not defined in the agent config', () => {
+    it('should fallback to openai if provider is not defined in the agent config', () => {
       const modifiedStore = {
         ...mockSessionStore,
         agentConfig: {
@@ -166,7 +166,7 @@ describe('agentSelectors', () => {
         },
       };
       const provider = agentSelectors.currentAgentModelProvider(modifiedStore);
-      expect(provider).toBeUndefined();
+      expect(provider).toEqual('openai');
     });
   });
 

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

@@ -28,7 +28,7 @@ const currentAgentModel = (s: AgentStore): string => {
 const currentAgentModelProvider = (s: AgentStore) => {
   const config = currentAgentConfig(s);
 
-  return config?.provider;
+  return config?.provider || 'openai';
 };
 
 const currentAgentPlugins = (s: AgentStore) => {