Skip to content

Commit 5c7e17a

Browse files
canisminor1990canisminor1990
authored
💄 style: Move model and provider icon components to @lobehub/icons (lobehub#3634)
* 💄 style: Move model and provider icon components to @lobehub/icons * 🐛 fix: Fix review problem * 🔧 chore: Update deps * 💄 style: Rm Google Avatar in Browser options
1 parent 64eb7c2 commit 5c7e17a

File tree

22 files changed

+95
-631
lines changed

22 files changed

+95
-631
lines changed

‎package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -119,7 +119,7 @@
119119
"@langchain/community": "^0.2.31",
120120
"@lobehub/chat-plugin-sdk": "^1.32.4",
121121
"@lobehub/chat-plugins-gateway": "^1.9.0",
122-
"@lobehub/icons": "^1.28.0",
122+
"@lobehub/icons": "^1.30.0",
123123
"@lobehub/tts": "^1.24.3",
124124
"@lobehub/ui": "^1.149.2",
125125
"@neondatabase/serverless": "^0.9.4",

‎src/app/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/Tags.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1+
import { ModelTag } from '@lobehub/icons';
12
import isEqual from 'fast-deep-equal';
23
import { memo } from 'react';
34
import { Flexbox } from 'react-layout-kit';
45

5-
import ModelTag from '@/components/ModelTag';
66
import ModelSwitchPanel from '@/features/ModelSwitchPanel';
77
import { useAgentStore } from '@/store/agent';
88
import { agentSelectors } from '@/store/agent/selectors';

‎src/app/(main)/chat/(workspace)/features/ShareButton/Preview.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,11 @@
1+
import { ModelTag } from '@lobehub/icons';
12
import { Avatar, ChatHeaderTitle, Markdown } from '@lobehub/ui';
23
import { LobeChat } from '@lobehub/ui/brand';
34
import { memo } from 'react';
45
import { useTranslation } from 'react-i18next';
56
import { Flexbox } from 'react-layout-kit';
67

78
import pkg from '@/../package.json';
8-
import ModelTag from '@/components/ModelTag';
99
import ChatList from '@/features/Conversation/components/ChatList';
1010
import { useAgentStore } from '@/store/agent';
1111
import { agentSelectors } from '@/store/agent/selectors';

‎src/app/(main)/chat/@session/features/SessionListContent/List/Item/index.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1+
import { ModelTag } from '@lobehub/icons';
12
import { memo, useMemo, useState } from 'react';
23
import { Flexbox } from 'react-layout-kit';
34
import { shallow } from 'zustand/shallow';
45

5-
import ModelTag from '@/components/ModelTag';
66
import { useAgentStore } from '@/store/agent';
77
import { agentSelectors } from '@/store/agent/selectors';
88
import { useChatStore } from '@/store/chat';

‎src/app/(main)/settings/llm/ProviderList/Azure/index.tsx‎

Lines changed: 1 addition & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,9 @@
11
'use client';
22

3-
import { Azure, OpenAI } from '@lobehub/icons';
43
import { Markdown } from '@lobehub/ui';
5-
import { AutoComplete, Divider, Input } from 'antd';
4+
import { AutoComplete, Input } from 'antd';
65
import { createStyles } from 'antd-style';
76
import { useTranslation } from 'react-i18next';
8-
import { Flexbox } from 'react-layout-kit';
97

108
import { AzureProviderCard } from '@/config/modelProviders';
119
import { ModelProvider } from '@/libs/agent-runtime';
@@ -29,16 +27,6 @@ const useStyles = createStyles(({ css, token }) => ({
2927

3028
const providerKey = ModelProvider.Azure;
3129

32-
const AzureOpenAIBrand = () => {
33-
return (
34-
<Flexbox align={'center'} gap={8} horizontal>
35-
<Azure.Combine size={22} type={'color'}></Azure.Combine>
36-
<Divider style={{ margin: '0 4px' }} type={'vertical'} />
37-
<OpenAI.Combine size={24}></OpenAI.Combine>
38-
</Flexbox>
39-
);
40-
};
41-
4230
export const useAzureProvider = (): ProviderItem => {
4331
const { t } = useTranslation('modelProvider');
4432
const { styles } = useStyles();
@@ -105,6 +93,5 @@ export const useAzureProvider = (): ProviderItem => {
10593
notFoundContent: t('azure.empty'),
10694
placeholder: t('azure.modelListPlaceholder'),
10795
},
108-
title: <AzureOpenAIBrand />,
10996
};
11097
};

‎src/app/(main)/settings/llm/ProviderList/Bedrock/index.tsx‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,7 @@
11
'use client';
22

3-
import { Aws, Bedrock } from '@lobehub/icons';
4-
import { Divider, Input, Select } from 'antd';
3+
import { Input, Select } from 'antd';
54
import { useTranslation } from 'react-i18next';
6-
import { Flexbox } from 'react-layout-kit';
75

86
import { BedrockProviderCard } from '@/config/modelProviders';
97
import { GlobalLLMProviderKey } from '@/types/user/settings';
@@ -57,12 +55,5 @@ export const useBedrockProvider = (): ProviderItem => {
5755
name: [KeyVaultsConfigKey, providerKey, 'region'],
5856
},
5957
],
60-
title: (
61-
<Flexbox align={'center'} gap={8} horizontal>
62-
<Aws.Color size={32} />
63-
<Divider style={{ margin: '0 4px' }} type={'vertical'} />
64-
<Bedrock.Combine size={26} type={'color'} />
65-
</Flexbox>
66-
),
6758
};
6859
};

‎src/app/(main)/settings/llm/ProviderList/Ollama/index.tsx‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
'use client';
22

3-
import { Ollama } from '@lobehub/icons';
43
import { useTranslation } from 'react-i18next';
54

65
import { OllamaProviderCard } from '@/config/modelProviders';
@@ -24,6 +23,5 @@ export const useOllamaProvider = (): ProviderItem => {
2423
placeholder: 'http://127.0.0.1:11434',
2524
title: t('ollama.endpoint.title'),
2625
},
27-
title: <Ollama.Combine size={28} />,
2826
};
2927
};

‎src/app/(main)/settings/llm/ProviderList/OpenAI/index.tsx‎

Lines changed: 0 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,5 @@
11
'use client';
22

3-
import { OpenAI } from '@lobehub/icons';
4-
53
import { OpenAIProviderCard } from '@/config/modelProviders';
64
import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
75

@@ -15,6 +13,5 @@ export const useOpenAIProvider = (): ProviderItem => {
1513
placeholder: 'https://api.openai.com/v1',
1614
},
1715
showApiKey: showOpenAIApiKey,
18-
title: <OpenAI.Combine size={24} />,
1916
};
2017
};

‎src/app/(main)/settings/llm/ProviderList/providers.tsx‎

Lines changed: 28 additions & 174 deletions
Original file line numberDiff line numberDiff line change
@@ -1,31 +1,4 @@
1-
import {
2-
Ai360,
3-
AiMass,
4-
Anthropic,
5-
Baichuan,
6-
Claude,
7-
DeepSeek,
8-
Gemini,
9-
Google,
10-
Groq,
11-
Minimax,
12-
Mistral,
13-
Moonshot,
14-
Novita,
15-
OpenRouter,
16-
Perplexity,
17-
SiliconCloud,
18-
Stepfun,
19-
Together,
20-
Tongyi,
21-
ZeroOne,
22-
Zhipu,
23-
} from '@lobehub/icons';
24-
import { Divider } from 'antd';
25-
import { useTheme } from 'antd-style';
261
import { useMemo } from 'react';
27-
import { Flexbox } from 'react-layout-kit';
28-
import urlJoin from 'url-join';
292

303
import {
314
Ai360ProviderCard,
@@ -55,157 +28,38 @@ import { useBedrockProvider } from './Bedrock';
5528
import { useOllamaProvider } from './Ollama';
5629
import { useOpenAIProvider } from './OpenAI';
5730

58-
const BASE_DOC_URL = 'https://lobehub.com/docs/usage/providers';
59-
60-
const AnthropicBrand = () => {
61-
const { isDarkMode } = useTheme();
62-
return <Anthropic.Text color={isDarkMode ? undefined : Claude.colorPrimary} size={15} />;
63-
};
64-
65-
const MoonshotBrand = () => {
66-
const theme = useTheme();
67-
return (
68-
<Moonshot.Combine
69-
color={theme.isDarkMode ? theme.colorText : Moonshot.colorPrimary}
70-
size={22}
71-
/>
72-
);
73-
};
74-
75-
const GroqBrand = () => {
76-
const theme = useTheme();
77-
78-
return <Groq.Text color={theme.isDarkMode ? theme.colorText : Groq.colorPrimary} size={20} />;
79-
};
80-
81-
const GoogleBrand = () => (
82-
<Flexbox align={'center'} gap={8} horizontal>
83-
<Google.BrandColor size={22} />
84-
<Divider style={{ margin: '0 4px' }} type={'vertical'} />
85-
<Gemini.Combine size={22} type={'color'} />
86-
</Flexbox>
87-
);
88-
8931
export const useProviderList = (): ProviderItem[] => {
90-
const azureProvider = useAzureProvider();
91-
const ollamaProvider = useOllamaProvider();
92-
const openAIProvider = useOpenAIProvider();
93-
const bedrockProvider = useBedrockProvider();
32+
const AzureProvider = useAzureProvider();
33+
const OllamaProvider = useOllamaProvider();
34+
const OpenAIProvider = useOpenAIProvider();
35+
const BedrockProvider = useBedrockProvider();
9436

9537
return useMemo(
9638
() => [
97-
{
98-
...openAIProvider,
99-
docUrl: urlJoin(BASE_DOC_URL, 'openai'),
100-
},
101-
{
102-
...ollamaProvider,
103-
docUrl: urlJoin(BASE_DOC_URL, 'ollama'),
104-
},
105-
{
106-
...azureProvider,
107-
docUrl: urlJoin(BASE_DOC_URL, 'azure'),
108-
},
109-
{
110-
...GoogleProviderCard,
111-
docUrl: urlJoin(BASE_DOC_URL, 'gemini'),
112-
title: <GoogleBrand />,
113-
},
114-
{
115-
...AnthropicProviderCard,
116-
docUrl: urlJoin(BASE_DOC_URL, 'anthropic'),
117-
title: <AnthropicBrand />,
118-
},
119-
{
120-
...bedrockProvider,
121-
docUrl: urlJoin(BASE_DOC_URL, 'bedrock'),
122-
},
123-
{
124-
...GroqProviderCard,
125-
docUrl: urlJoin(BASE_DOC_URL, 'groq'),
126-
title: <GroqBrand />,
127-
},
128-
{
129-
...OpenRouterProviderCard,
130-
docUrl: urlJoin(BASE_DOC_URL, 'openrouter'),
131-
title: <OpenRouter.Combine iconProps={{ color: OpenRouter.colorPrimary }} size={20} />,
132-
},
133-
{
134-
...NovitaProviderCard,
135-
docUrl: urlJoin(BASE_DOC_URL, 'novita'),
136-
title: <Novita.Combine size={20} type={'color'} />,
137-
},
138-
{
139-
...TogetherAIProviderCard,
140-
docUrl: urlJoin(BASE_DOC_URL, 'togetherai'),
141-
title: <Together.Combine size={26} type={'color'} />,
142-
},
143-
{
144-
...QwenProviderCard,
145-
docUrl: urlJoin(BASE_DOC_URL, 'qwen'),
146-
title: <Tongyi.Combine extra={'千问'} size={26} type={'color'} />,
147-
},
148-
{
149-
...DeepSeekProviderCard,
150-
docUrl: urlJoin(BASE_DOC_URL, 'deepseek'),
151-
title: <DeepSeek.Combine size={28} type={'color'} />,
152-
},
153-
{
154-
...MinimaxProviderCard,
155-
docUrl: urlJoin(BASE_DOC_URL, 'minimax'),
156-
title: <Minimax.Combine size={32} type={'color'} />,
157-
},
158-
{
159-
...MistralProviderCard,
160-
docUrl: urlJoin(BASE_DOC_URL, 'mistral'),
161-
title: <Mistral.Combine size={26} type={'color'} />,
162-
},
163-
{
164-
...MoonshotProviderCard,
165-
docUrl: urlJoin(BASE_DOC_URL, 'moonshot'),
166-
title: <MoonshotBrand />,
167-
},
168-
{
169-
...PerplexityProviderCard,
170-
docUrl: urlJoin(BASE_DOC_URL, 'perplexity'),
171-
title: <Perplexity.Combine size={24} type={'color'} />,
172-
},
173-
{
174-
...ZhiPuProviderCard,
175-
docUrl: urlJoin(BASE_DOC_URL, 'zhipu'),
176-
title: <Zhipu.Combine size={32} type={'color'} />,
177-
},
178-
{
179-
...ZeroOneProviderCard,
180-
docUrl: urlJoin(BASE_DOC_URL, '01ai'),
181-
title: <ZeroOne.Text size={20} />,
182-
},
183-
{
184-
...StepfunProviderCard,
185-
docUrl: urlJoin(BASE_DOC_URL, 'stepfun'),
186-
title: <Stepfun.Combine size={20} type={'color'} />,
187-
},
188-
{
189-
...BaichuanProviderCard,
190-
docUrl: urlJoin(BASE_DOC_URL, 'baichuan'),
191-
title: <Baichuan.Combine size={20} type={'color'} />,
192-
},
193-
{
194-
...TaichuProviderCard,
195-
docUrl: urlJoin(BASE_DOC_URL, 'taichu'),
196-
title: <AiMass.Combine size={28} type={'color'} />,
197-
},
198-
{
199-
...Ai360ProviderCard,
200-
docUrl: urlJoin(BASE_DOC_URL, 'ai360'),
201-
title: <Ai360.Combine size={ 20 } type={ 'color' } />,
202-
},
203-
{
204-
...SiliconCloudProviderCard,
205-
docUrl: urlJoin(BASE_DOC_URL, 'siliconcloud'),
206-
title: <SiliconCloud.Combine size={20} type={'color'} />,
207-
},
39+
OpenAIProvider,
40+
OllamaProvider,
41+
AzureProvider,
42+
GoogleProviderCard,
43+
AnthropicProviderCard,
44+
BedrockProvider,
45+
GroqProviderCard,
46+
OpenRouterProviderCard,
47+
NovitaProviderCard,
48+
TogetherAIProviderCard,
49+
QwenProviderCard,
50+
DeepSeekProviderCard,
51+
MinimaxProviderCard,
52+
MistralProviderCard,
53+
MoonshotProviderCard,
54+
PerplexityProviderCard,
55+
ZhiPuProviderCard,
56+
ZeroOneProviderCard,
57+
StepfunProviderCard,
58+
BaichuanProviderCard,
59+
TaichuProviderCard,
60+
Ai360ProviderCard,
61+
SiliconCloudProviderCard,
20862
],
209-
[azureProvider, ollamaProvider, ollamaProvider, bedrockProvider],
63+
[AzureProvider, OllamaProvider, OpenAIProvider, BedrockProvider],
21064
);
21165
};

0 commit comments

Comments
 (0)