refactor: improve error boundary messsage (#4987)

src/renderer/src/i18n/locales/en-us.json

@@ -328,7 +328,7 @@
       "no_api_key": "API key is not configured",
       "provider_disabled": "Model provider is not enabled",
       "render": {
-        "description": "Failed to render formula. Please check if the formula format is correct",
+        "description": "Failed to render message content. Please check if the message content format is correct",
         "title": "Render Error"
       },
       "user_message_not_found": "Cannot find original user message to resend",

src/renderer/src/i18n/locales/ja-jp.json

@@ -328,7 +328,7 @@
       "no_api_key": "APIキーが設定されていません",
       "provider_disabled": "モデルプロバイダーが有効になっていません",
       "render": {
-        "description": "数式のレンダリングに失敗しました。数式の形式が正しいか確認してください",
+        "description": "メッセージの内容のレンダリングに失敗しました。メッセージの内容の形式が正しいか確認してください",
         "title": "レンダリングエラー"
       },
       "user_message_not_found": "元のユーザーメッセージを見つけることができませんでした",

src/renderer/src/i18n/locales/ru-ru.json

@@ -328,7 +328,7 @@
       "no_api_key": "Ключ API не настроен",
       "provider_disabled": "Провайдер моделей не включен",
       "render": {
-        "description": "Не удалось рендерить формулу. Пожалуйста, проверьте, правильно ли формат формулы",
+        "description": "Не удалось рендерить содержимое сообщения. Пожалуйста, проверьте, правильно ли формат содержимого сообщения",
         "title": "Ошибка рендеринга"
       },
       "user_message_not_found": "Не удалось найти исходное сообщение пользователя",

src/renderer/src/i18n/locales/zh-cn.json

@@ -328,7 +328,7 @@
       "no_api_key": "API 密钥未配置",
       "provider_disabled": "模型提供商未启用",
       "render": {
-        "description": "渲染公式失败，请检查公式格式是否正确",
+        "description": "消息内容渲染失败，请检查消息内容格式是否正确",
         "title": "渲染错误"
       },
       "user_message_not_found": "无法找到原始用户消息",

src/renderer/src/i18n/locales/zh-tw.json

@@ -328,7 +328,7 @@
       "no_api_key": "API 金鑰未設定",
       "provider_disabled": "模型供應商未啟用",
       "render": {
-        "description": "渲染公式失敗，請檢查公式格式是否正確",
+        "description": "消息內容渲染失敗，請檢查消息內容格式是否正確",
         "title": "渲染錯誤"
       },
       "user_message_not_found": "無法找到原始用戶訊息",

src/renderer/src/pages/home/Messages/MessageErrorBoundary.tsx

@@ -9,15 +9,19 @@ interface Props {
 
 interface State {
   hasError: boolean
+  error?: Error
 }
 
-const ErrorFallback = ({ fallback }: { fallback?: React.ReactNode }) => {
+const ErrorFallback = ({ fallback, error }: { fallback?: React.ReactNode; error?: Error }) => {
   const { t } = useTranslation()
-  return (
+
-    fallback || (
+  // 如果有详细错误信息，添加到描述中
-      <Alert message={t('error.render.title')} description={t('error.render.description')} type="error" showIcon />
+  const errorDescription =
-    )
+    process.env.NODE_ENV !== 'production' && error
-  )
+      ? `${t('error.render.description')}: ${error.message}`
+      : t('error.render.description')
+
+  return fallback || <Alert message={t('error.render.title')} description={errorDescription} type="error" showIcon />
 }
 
 class MessageErrorBoundary extends React.Component<Props, State> {
@@ -26,13 +30,13 @@ class MessageErrorBoundary extends React.Component<Props, State> {
     this.state = { hasError: false }
   }
 
-  static getDerivedStateFromError() {
+  static getDerivedStateFromError(error: Error) {
-    return { hasError: true }
+    return { hasError: true, error }
   }
 
   render() {
     if (this.state.hasError) {
-      return <ErrorFallback fallback={this.props.fallback} />
+      return <ErrorFallback fallback={this.props.fallback} error={this.state.error} />
     }
     return this.props.children
   }