feat: 对话国际化样式调整

src/components/chat/ChatComposer.tsx

@@ -1,6 +1,7 @@
 import { useRef } from 'react';
 import { SendHorizontal, Square, X, Paperclip, FileText, Film, Music, FileArchive, File, Loader2, AtSign } from 'lucide-react';
 import type { AttachedFileMeta } from '../../shared/chat-model';
+import { useI18n } from '../../i18n';
 
 type ChatComposerProps = {
   value: string;
@@ -28,10 +29,11 @@ export default function ChatComposer({
   onDismissError,
 }: ChatComposerProps) {
   const fileInputRef = useRef<HTMLInputElement | null>(null);
+  const { t } = useI18n();
 
   return (
-    <div className="border-t border-[#edf2f7] px-6 py-4 dark:border-[#2a2a2d]">
-      <div className="rounded-[18px] border border-[#dfeaf6] bg-white p-4 shadow-[0_10px_30px_rgba(15,23,42,0.04)] dark:border-[#2a2a2d] dark:bg-[#1f1f22]">
+    <div className="border-t border-[#edf2f7] p-4 dark:border-[#2a2a2d]">
+      <div className="rounded-xl border border-[#dfeaf6] bg-white p-4 shadow-[0_10px_30px_rgba(15,23,42,0.04)] dark:border-[#2a2a2d] dark:bg-[#1f1f22]">
         <div className="flex items-start gap-3">
           <div className="min-w-0 flex-1">
             {error ? (
@@ -39,14 +41,14 @@ export default function ChatComposer({
                 <span className="min-w-0 flex-1">{error}</span>
                 {onDismissError ? (
                   <button type="button" className="text-xs transition-colors hover:text-[#7f1d1d]" onClick={onDismissError}>
-                    关闭
+                    {t('conversation.composer.dismissError')}
                   </button>
                 ) : null}
               </div>
             ) : null}
             <textarea
-              className="min-h-[120px] w-full resize-none rounded-[14px] border border-[#BEDBFF] bg-[#f8fbff] px-4 py-3 text-sm text-[#171717] outline-none transition-colors placeholder:text-[#99A0AE] focus:border-[#2B7FFF] dark:border-[#2a2a2d] dark:bg-[#232327] dark:text-gray-100 dark:placeholder:text-gray-500"
-              placeholder="输入消息，按 Enter 发送，Shift + Enter 换行"
+              className="min-h-30 w-full resize-none text-sm text-[#171717] outline-none transition-colors placeholder:text-[#99A0AE] focus:border-[#2B7FFF] dark:border-[#2a2a2d] dark:bg-[#232327] dark:text-gray-100 dark:placeholder:text-gray-500"
+              placeholder={t('conversation.composer.placeholder')}
               value={value}
               onChange={(event) => onChange(event.target.value)}
               onKeyDown={(event) => {
@@ -61,13 +63,13 @@ export default function ChatComposer({
               }}
             />
             {attachments.length > 0 ? (
-              <div className="mt-3 flex flex-wrap gap-2">
+              <div className="w-full flex justify-between">
                 {attachments.map((attachment, index) => (
                   <div
                     key={attachment.filePath || `${attachment.fileName}-${index}`}
                     className="flex items-center gap-2 rounded-full border border-[#E5E8EE] bg-white px-3 py-1.5 text-xs text-[#525866] dark:border-[#2a2a2d] dark:bg-[#232327] dark:text-gray-300"
                   >
-                    <span className="max-w-[180px] truncate">{attachment.fileName}</span>
+                    <span className="max-w-45 truncate">{attachment.fileName}</span>
                     <button
                       type="button"
                       className="text-[#99A0AE] transition-colors hover:text-[#ef4444]"
@@ -79,7 +81,7 @@ export default function ChatComposer({
                 ))}
               </div>
             ) : null}
-            <div className="mt-3 flex flex-wrap gap-2">
+            <div className="w-full flex justify-between">
               <input
                 ref={fileInputRef}
                 hidden
@@ -95,14 +97,14 @@ export default function ChatComposer({
               />
               <button
                 type="button"
-                className="rounded-full border border-[#E5E8EE] px-3 py-1.5 text-xs text-[#525866] transition-colors hover:border-[#2B7FFF] hover:text-[#2B7FFF] dark:border-[#2a2a2d] dark:text-gray-300"
+                className="p-3 text-xs text-[#525866] transition-colors hover:border-[#2B7FFF] hover:text-[#2B7FFF] dark:border-[#2a2a2d] dark:text-gray-300"
                 onClick={() => fileInputRef.current?.click()}
               >
                 <Paperclip className="h-4 w-4" />
               </button>
               <button
                 type="button"
-                className="rounded-full border border-[#E5E8EE] px-3 py-1.5 text-xs text-[#525866] transition-colors hover:border-[#2B7FFF] hover:text-[#2B7FFF] dark:border-[#2a2a2d] dark:text-gray-300"
+                className="rounded-lg border border-[#E5E8EE] p-3 text-xs text-[#525866] transition-colors hover:border-[#2B7FFF] hover:text-[#2B7FFF] dark:border-[#2a2a2d] dark:text-gray-300"
                 onClick={isSending ? onStop : onSend}
               >
                 {isSending ? <Square className="h-4 w-4" /> : <SendHorizontal className="h-4 w-4" />}

src/i18n/messages.ts

@@ -39,6 +39,10 @@ export const messages: I18nMessages = {
     conversation: {
       newConversation: 'New conversation',
       emptyState: 'No messages yet',
+      composer: {
+        placeholder: 'Type a message, press Enter to send, Shift + Enter for a new line',
+        dismissError: 'Close',
+      },
     },
     sidebar: {
       home: 'Home',
@@ -519,6 +523,10 @@ export const messages: I18nMessages = {
     conversation: {
       newConversation: '新建对话',
       emptyState: '暂无消息',
+      composer: {
+        placeholder: '输入消息，按 Enter 发送，Shift + Enter 换行',
+        dismissError: '关闭',
+      },
     },
     sidebar: {
       home: '首页',
@@ -999,6 +1007,10 @@ export const messages: I18nMessages = {
     conversation: {
       newConversation: '新しい会話',
       emptyState: 'まだメッセージがありません',
+      composer: {
+        placeholder: 'メッセージを入力し、Enter で送信、Shift + Enter で改行',
+        dismissError: '閉じる',
+      },
     },
     sidebar: {
       home: 'ホーム',