From e0eac6ab7e35c5c6863d00329fec6694ba8cefb7 Mon Sep 17 00:00:00 2001 From: karl Date: Mon, 14 Jul 2025 21:50:55 +0800 Subject: [PATCH] Fix/7973 (#8059) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit * fix: 7973 查看原始数据的按钮没有了 * refactor(MessageTools): replace PreviewBlock with CollapsedContent for improved preview rendering --------- Co-authored-by: suyao --- src/renderer/src/i18n/locales/en-us.json | 3 +- src/renderer/src/i18n/locales/ja-jp.json | 3 +- src/renderer/src/i18n/locales/ru-ru.json | 3 +- src/renderer/src/i18n/locales/zh-cn.json | 3 +- src/renderer/src/i18n/locales/zh-tw.json | 3 +- .../src/pages/home/Messages/MessageTools.tsx | 291 ++++++++++++------ 6 files changed, 215 insertions(+), 91 deletions(-) diff --git a/src/renderer/src/i18n/locales/en-us.json b/src/renderer/src/i18n/locales/en-us.json index 4f54b2ad34..eb49fbe793 100644 --- a/src/renderer/src/i18n/locales/en-us.json +++ b/src/renderer/src/i18n/locales/en-us.json @@ -764,7 +764,8 @@ "invoking": "Invoking", "pending": "Pending", "preview": "Preview", - "autoApproveEnabled": "Auto-approve enabled for this tool" + "autoApproveEnabled": "Auto-approve enabled for this tool", + "raw": "Raw" }, "topic.added": "New topic added", "upgrade.success.button": "Restart", diff --git a/src/renderer/src/i18n/locales/ja-jp.json b/src/renderer/src/i18n/locales/ja-jp.json index 8e468ab8e7..83db85c5d4 100644 --- a/src/renderer/src/i18n/locales/ja-jp.json +++ b/src/renderer/src/i18n/locales/ja-jp.json @@ -764,7 +764,8 @@ "invoking": "呼び出し中", "pending": "保留中", "preview": "プレビュー", - "autoApproveEnabled": "このツールは自動承認が有効になっています" + "autoApproveEnabled": "このツールは自動承認が有効になっています", + "raw": "生データ" }, "topic.added": "新しいトピックが追加されました", "upgrade.success.button": "再起動", diff --git a/src/renderer/src/i18n/locales/ru-ru.json b/src/renderer/src/i18n/locales/ru-ru.json index 43c6510987..f51ad78e88 100644 --- a/src/renderer/src/i18n/locales/ru-ru.json +++ b/src/renderer/src/i18n/locales/ru-ru.json @@ -764,7 +764,8 @@ "invoking": "Вызов", "pending": "Ожидание", "preview": "Предпросмотр", - "autoApproveEnabled": "Для этого инструмента включен автоматический одобрен" + "autoApproveEnabled": "Для этого инструмента включен автоматический одобрен", + "raw": "Исходный" }, "topic.added": "Новый топик добавлен", "upgrade.success.button": "Перезапустить", diff --git a/src/renderer/src/i18n/locales/zh-cn.json b/src/renderer/src/i18n/locales/zh-cn.json index 1ebd03ce64..7f01234f51 100644 --- a/src/renderer/src/i18n/locales/zh-cn.json +++ b/src/renderer/src/i18n/locales/zh-cn.json @@ -764,7 +764,8 @@ "invoking": "调用中", "pending": "等待中", "preview": "预览", - "autoApproveEnabled": "此工具已启用自动批准" + "autoApproveEnabled": "此工具已启用自动批准", + "raw": "原始" }, "topic.added": "话题添加成功", "upgrade.success.button": "重启", diff --git a/src/renderer/src/i18n/locales/zh-tw.json b/src/renderer/src/i18n/locales/zh-tw.json index 37626e7cea..d4bada9a36 100644 --- a/src/renderer/src/i18n/locales/zh-tw.json +++ b/src/renderer/src/i18n/locales/zh-tw.json @@ -764,7 +764,8 @@ "invoking": "調用中", "pending": "等待中", "preview": "預覽", - "autoApproveEnabled": "此工具已啟用自動批准" + "autoApproveEnabled": "此工具已啟用自動批准", + "raw": "原始碼" }, "topic.added": "新話題已新增", "upgrade.success.button": "重新啟動", diff --git a/src/renderer/src/pages/home/Messages/MessageTools.tsx b/src/renderer/src/pages/home/Messages/MessageTools.tsx index 2afc1fe201..feb713c362 100644 --- a/src/renderer/src/pages/home/Messages/MessageTools.tsx +++ b/src/renderer/src/pages/home/Messages/MessageTools.tsx @@ -1,11 +1,11 @@ -import { CheckOutlined, CloseOutlined, LoadingOutlined, WarningOutlined } from '@ant-design/icons' +import { CheckOutlined, CloseOutlined, ExpandOutlined, LoadingOutlined, WarningOutlined } from '@ant-design/icons' import { useCodeStyle } from '@renderer/context/CodeStyleProvider' import { useMCPServers } from '@renderer/hooks/useMCPServers' import { useSettings } from '@renderer/hooks/useSettings' import type { ToolMessageBlock } from '@renderer/types/newMessage' import { isToolAutoApproved } from '@renderer/utils/mcp-tools' import { cancelToolAction, confirmToolAction } from '@renderer/utils/userConfirmation' -import { Button, Collapse, ConfigProvider, Dropdown, Flex, message as antdMessage, Tooltip } from 'antd' +import { Button, Collapse, ConfigProvider, Dropdown, Flex, message as antdMessage, Modal, Tabs, Tooltip } from 'antd' import { message } from 'antd' import Logger from 'electron-log/renderer' import { ChevronDown, ChevronRight, CirclePlay, CircleX, PauseCircle, ShieldCheck } from 'lucide-react' @@ -26,6 +26,7 @@ const MessageTools: FC = ({ block }) => { const { t } = useTranslation() const { messageFont, fontSize } = useSettings() const { mcpServers, updateMCPServer } = useMCPServers() + const [expandedResponse, setExpandedResponse] = useState<{ content: string; title: string } | null>(null) const toolResponse = block.metadata?.rawMcpToolResponse @@ -221,6 +222,20 @@ const MessageTools: FC = ({ block }) => { {renderStatusIndicator(status, hasError)} + + { + e.stopPropagation() + setExpandedResponse({ + content: JSON.stringify(response, null, 2), + title: tool.name + }) + }} + aria-label={t('common.expand')}> + + + {!isPending && !isInvoking && ( = ({ block }) => { return items } - return ( - - - - ( - - )} - /> - {(isPending || isInvoking) && ( - - - {isPending ? t('settings.mcp.tools.autoApprove.tooltip.confirm') : t('message.tools.invoking')} - + const renderPreview = (content: string) => { + if (!content) return null - - {isPending && ( - - )} - {isInvoking && toolResponse?.id ? ( - - ) : ( - } - onClick={() => { - handleConfirmTool() - }} - menu={{ - items: [ - { - key: 'autoApprove', - label: t('settings.mcp.tools.autoApprove'), - onClick: () => { - handleAutoApprove() + try { + const parsedResult = JSON.parse(content) + switch (parsedResult.content[0]?.type) { + case 'text': + return ( + + ) + + default: + return + } + } catch (e) { + console.error('failed to render the preview of mcp results:', e) + return + } + } + + return ( + <> + + + + ( + + )} + /> + {(isPending || isInvoking) && ( + + + {isPending ? t('settings.mcp.tools.autoApprove.tooltip.confirm') : t('message.tools.invoking')} + + + + {isPending && ( + + )} + {isInvoking && toolResponse?.id ? ( + + ) : ( + } + onClick={() => { + handleConfirmTool() + }} + menu={{ + items: [ + { + key: 'autoApprove', + label: t('settings.mcp.tools.autoApprove'), + onClick: () => { + handleAutoApprove() + } } - } - ] - }}> - - - {t('settings.mcp.tools.run', 'Run')} ({countdown}s) - - - )} - - - )} - - - + ] + }}> + + + {t('settings.mcp.tools.run', 'Run')} ({countdown}s) + + + )} + + + )} + + + + setExpandedResponse(null)} + footer={null} + width="80%" + centered + transitionName="animation-move-down" + styles={{ body: { maxHeight: '80vh', overflow: 'auto' } }}> + {expandedResponse && ( + + { + navigator.clipboard.writeText( + typeof expandedResponse.content === 'string' + ? expandedResponse.content + : JSON.stringify(expandedResponse.content, null, 2) + ) + antdMessage.success({ content: t('message.copied'), key: 'copy-expanded' }) + }} + aria-label={t('common.copy')}> + + + } + items={[ + { + key: 'preview', + label: t('message.tools.preview'), + children: renderPreview(expandedResponse.content) + }, + { + key: 'raw', + label: t('message.tools.raw'), + children: ( + + ) + } + ]} + /> + + )} + + ) } @@ -563,4 +659,27 @@ const ToolResponseContainer = styled.div` position: relative; ` +const ExpandedResponseContainer = styled.div` + background: var(--color-bg-1); + border-radius: 8px; + padding: 16px; + position: relative; + + .copy-expanded-button { + position: absolute; + top: 10px; + right: 10px; + background-color: var(--color-bg-2); + border-radius: 4px; + z-index: 1; + } + + pre { + margin: 0; + white-space: pre-wrap; + word-break: break-word; + color: var(--color-text); + } +` + export default memo(MessageTools)