Skip to content

Commit aca5311

Browse files
AaaaashAaaaash
committed
fix: reduce font size in chat components and update MCP tools localization
1 parent 23e4557 commit aca5311

8 files changed

Lines changed: 93 additions & 92 deletions

File tree

‎packages/ai-native/src/browser/chat/chat.module.less‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
height: 100%;
55
border-radius: 12px;
66
overflow: hidden;
7-
font-size: 14px;
7+
font-size: 12px;
88
user-select: text;
99

1010
border-top-left-radius: 12px;
@@ -75,7 +75,7 @@
7575

7676
.header_container {
7777
height: 36px;
78-
padding: 8px 0 8px 16px;
78+
padding: 8px 8px 8px 16px;
7979
box-sizing: border-box;
8080
background-color: var(--editorGroupHeader-tabsBackground);
8181
user-select: none;

‎packages/ai-native/src/browser/chat/chat.view.tsx‎

Lines changed: 29 additions & 30 deletions
Original file line numberDiff line numberDiff line change
@@ -82,12 +82,9 @@ export const AIChatView = () => {
8282
const promptProvider = useInjectable<ChatAgentPromptProvider>(ChatAgentPromptProvider);
8383

8484
const layoutService = useInjectable<IMainLayoutService>(IMainLayoutService);
85-
const mcpServerProxyService = useInjectable<MCPServerProxyService>(TokenMCPServerProxyService);
8685
const msgHistoryManager = aiChatService.sessionModel.history;
8786
const containerRef = React.useRef<HTMLDivElement>(null);
8887
const chatInputRef = React.useRef<{ setInputValue: (v: string) => void } | null>(null);
89-
const dialogService = useInjectable<IDialogService>(IDialogService);
90-
const aiNativeConfigService = useInjectable<AINativeConfigService>(AINativeConfigService);
9188

9289
const [shortcutCommands, setShortcutCommands] = React.useState<ChatSlashCommandItemModel[]>([]);
9390

@@ -109,7 +106,6 @@ export const AIChatView = () => {
109106
const [defaultAgentId, setDefaultAgentId] = React.useState<string>('');
110107
const [command, setCommand] = React.useState('');
111108
const [theme, setTheme] = React.useState<string | null>(null);
112-
const [mcpToolsCount, setMcpToolsCount] = React.useState<number>(0);
113109

114110
React.useEffect(() => {
115111
const featureSlashCommands = chatFeatureRegistry.getAllShortcutSlashCommand();
@@ -661,25 +657,6 @@ export const AIChatView = () => {
661657
};
662658
}, [aiChatService.sessionModel]);
663659

664-
useEventEffect(
665-
mcpServerProxyService.onChangeMCPServers,
666-
() => {
667-
mcpServerProxyService.getAllMCPTools().then((tools) => {
668-
setMcpToolsCount(tools.length);
669-
});
670-
},
671-
[mcpServerProxyService],
672-
);
673-
674-
const handleShowMCPTools = React.useCallback(async () => {
675-
const tools = await mcpServerProxyService.getAllMCPTools();
676-
dialogService.open({
677-
message: <MCPToolsDialog tools={tools} />,
678-
type: MessageType.Empty,
679-
buttons: ['关闭'],
680-
});
681-
}, [mcpServerProxyService, dialogService]);
682-
683660
return (
684661
<div id={styles.ai_chat_view}>
685662
<div className={styles.header_container}>
@@ -712,13 +689,6 @@ export const AIChatView = () => {
712689
</Popover>
713690
))}
714691
</div>
715-
<div className={styles.header_operate_right}>
716-
{aiNativeConfigService.capabilities.supportsMCP && (
717-
<div className={styles.tag} onClick={handleShowMCPTools}>
718-
{`MCP Tools: ${mcpToolsCount}`}
719-
</div>
720-
)}
721-
</div>
722692
</div>
723693
<ChatInputWrapperRender
724694
onSend={(value, agentId, command) =>
@@ -757,6 +727,9 @@ export function DefaultChatViewHeader({
757727
handleClear: () => any;
758728
handleCloseChatView: () => any;
759729
}) {
730+
const dialogService = useInjectable<IDialogService>(IDialogService);
731+
const aiNativeConfigService = useInjectable<AINativeConfigService>(AINativeConfigService);
732+
const mcpServerProxyService = useInjectable<MCPServerProxyService>(TokenMCPServerProxyService);
760733
const aiChatService = useInjectable<ChatInternalService>(IChatInternalService);
761734
const [historyList, setHistoryList] = React.useState<IChatHistoryItem[]>([]);
762735
const [currentTitle, setCurrentTitle] = React.useState<string>('');
@@ -778,6 +751,15 @@ export function DefaultChatViewHeader({
778751
[aiChatService],
779752
);
780753

754+
const handleShowMCPTools = React.useCallback(async () => {
755+
const tools = await mcpServerProxyService.getAllMCPTools();
756+
dialogService.open({
757+
message: <MCPToolsDialog tools={tools} />,
758+
type: MessageType.Empty,
759+
buttons: ['关闭'],
760+
});
761+
}, [mcpServerProxyService, dialogService]);
762+
781763
React.useEffect(() => {
782764
const getHistoryList = () => {
783765
const currentMessages = aiChatService.sessionModel.history.getMessages();
@@ -857,6 +839,23 @@ export function DefaultChatViewHeader({
857839
ariaLabel={localize('aiNative.operate.clear.title')}
858840
/>
859841
</Popover>
842+
{aiNativeConfigService.capabilities.supportsMCP && (
843+
<Popover
844+
overlayClassName={styles.popover_icon}
845+
id={'ai-chat-header-tools'}
846+
position={PopoverPosition.left}
847+
title={localize('aiNative.operate.tools.title')}
848+
>
849+
<EnhanceIcon
850+
wrapperClassName={styles.action_btn}
851+
className={getIcon('menubar-tool')}
852+
onClick={handleShowMCPTools}
853+
tabIndex={0}
854+
role='button'
855+
ariaLabel={localize('aiNative.operate.tools.title')}
856+
/>
857+
</Popover>
858+
)}
860859
<Popover
861860
overlayClassName={styles.popover_icon}
862861
id={'ai-chat-header-close'}

‎packages/ai-native/src/browser/components/chat-history.css‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
.dm-chat-history-header-actions {
2626
display: flex;
2727
align-items: center;
28-
font-size: 14px;
28+
font-size: 12px;
2929

3030
.dm-chat-history-header-actions-history {
3131
cursor: pointer;

‎packages/ai-native/src/browser/components/components.module.less‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -35,7 +35,7 @@
3535
}
3636

3737
.thinking_text {
38-
font-size: 14px;
38+
font-size: 12px;
3939
}
4040

4141
.bottom_container {
@@ -480,7 +480,7 @@
480480
* welcome
481481
*/
482482
.chat_welcome_head {
483-
font-size: 14px;
483+
font-size: 12px;
484484
line-height: 22px;
485485
a {
486486
color: #3c8dff;

‎packages/ai-native/src/browser/layout/layout.module.less‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -23,7 +23,7 @@
2323
.rce-mbox-text {
2424
line-height: 18px;
2525
width: inherit;
26-
font-size: 14px;
26+
font-size: 12px;
2727
}
2828

2929
.rce-smsg {

‎packages/i18n/src/common/en-US.lang.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1484,6 +1484,7 @@ export const localizationBundle = {
14841484
'aiNative.operate.stop.title': 'Stop',
14851485
'aiNative.operate.close.title': 'Close',
14861486
'aiNative.operate.clear.title': 'Clear',
1487+
'aiNative.operate.tools.title': 'MCP Tools',
14871488
'aiNative.operate.newChat.title': 'New Chat',
14881489
'aiNative.operate.chatHistory.title': 'Chat History',
14891490
'aiNative.operate.chatHistory.searchPlaceholder': 'Search Chats...',

‎packages/i18n/src/common/zh-CN.lang.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1252,6 +1252,7 @@ export const localizationBundle = {
12521252
'aiNative.operate.stop.title': '停止',
12531253
'aiNative.operate.close.title': '关闭',
12541254
'aiNative.operate.clear.title': '清空',
1255+
'aiNative.operate.tools.title': 'MCP 工具',
12551256
'aiNative.operate.newChat.title': '新建聊天',
12561257
'aiNative.operate.chatHistory.title': '聊天历史',
12571258
'aiNative.operate.chatHistory.searchPlaceholder': '请搜索...',

‎packages/startup/entry/sample-modules/ai-native/ai-native.contribution.ts‎

Lines changed: 56 additions & 56 deletions
Original file line numberDiff line numberDiff line change
@@ -160,30 +160,30 @@ export class AINativeContribution implements AINativeCoreContribution {
160160
},
161161
);
162162

163-
registry.registerEditorInlineChat(
164-
{
165-
id: 'ai-explain',
166-
name: EInlineOperation.Explain,
167-
renderType: 'button',
168-
codeAction: {
169-
isPreferred: true,
170-
},
171-
},
172-
{
173-
execute: async (editor: ICodeEditor, selection: ISelection, token) => {
174-
const model = editor.getModel();
175-
if (!model) {
176-
return;
177-
}
178-
179-
const crossCode = editor.getModel()?.getValueInRange(Selection.liftSelection(selection));
180-
this.aiChatService.sendMessage({
181-
message: `Explain code: \`\`\`\n${crossCode}\n\`\`\``,
182-
prompt: `Help me, Explain code: \`\`\`\n${crossCode}\n\`\`\``,
183-
});
184-
},
185-
},
186-
);
163+
// registry.registerEditorInlineChat(
164+
// {
165+
// id: 'ai-explain',
166+
// name: EInlineOperation.Explain,
167+
// renderType: 'button',
168+
// codeAction: {
169+
// isPreferred: true,
170+
// },
171+
// },
172+
// {
173+
// execute: async (editor: ICodeEditor, selection: ISelection, token) => {
174+
// const model = editor.getModel();
175+
// if (!model) {
176+
// return;
177+
// }
178+
179+
// const crossCode = editor.getModel()?.getValueInRange(Selection.liftSelection(selection));
180+
// this.aiChatService.sendMessage({
181+
// message: `Explain code: \`\`\`\n${crossCode}\n\`\`\``,
182+
// prompt: `Help me, Explain code: \`\`\`\n${crossCode}\n\`\`\``,
183+
// });
184+
// },
185+
// },
186+
// );
187187

188188
registry.registerTerminalInlineChat(
189189
{
@@ -236,38 +236,38 @@ export class AINativeContribution implements AINativeCoreContribution {
236236
],
237237
);
238238

239-
registry.registerSlashCommand(
240-
{
241-
name: 'Explain',
242-
description: 'Explain',
243-
isShortcut: true,
244-
tooltip: 'Explain',
245-
},
246-
{
247-
providerRender: SlashCommand,
248-
providerInputPlaceholder(value, editor) {
249-
return 'Please enter or paste the code.';
250-
},
251-
providerPrompt(value, editor) {
252-
return `Explain code: \`\`\`\n${value}\n\`\`\``;
253-
},
254-
execute: (value: string, send: TChatSlashCommandSend, editor: ICodeEditor) => {
255-
send(value);
256-
},
257-
},
258-
);
259-
260-
registry.registerSlashCommand(
261-
{
262-
name: 'Test',
263-
description: 'Test',
264-
},
265-
{
266-
execute: (value: string, send: TChatSlashCommandSend, editor: ICodeEditor) => {
267-
send(value);
268-
},
269-
},
270-
);
239+
// registry.registerSlashCommand(
240+
// {
241+
// name: 'Explain',
242+
// description: 'Explain',
243+
// isShortcut: true,
244+
// tooltip: 'Explain',
245+
// },
246+
// {
247+
// providerRender: SlashCommand,
248+
// providerInputPlaceholder(value, editor) {
249+
// return 'Please enter or paste the code.';
250+
// },
251+
// providerPrompt(value, editor) {
252+
// return `Explain code: \`\`\`\n${value}\n\`\`\``;
253+
// },
254+
// execute: (value: string, send: TChatSlashCommandSend, editor: ICodeEditor) => {
255+
// send(value);
256+
// },
257+
// },
258+
// );
259+
260+
// registry.registerSlashCommand(
261+
// {
262+
// name: 'Test',
263+
// description: 'Test',
264+
// },
265+
// {
266+
// execute: (value: string, send: TChatSlashCommandSend, editor: ICodeEditor) => {
267+
// send(value);
268+
// },
269+
// },
270+
// );
271271
}
272272

273273
registerResolveConflictFeature(registry: IResolveConflictRegistry): void {

0 commit comments

Comments
 (0)