feat: add translate

src/components/ExportSidebar.tsx

@@ -5,6 +5,7 @@ import { convertMathmlToOmml, wrapOmmlForClipboard } from '../lib/ommlConverter'
 import { generateImageFromElement, copyImageToClipboard, downloadImage } from '../lib/imageGenerator';
 import { API_BASE_URL } from '../config/env';
 import { tokenManager } from '../lib/api';
+import { useLanguage } from '../contexts/LanguageContext';
 
 interface ExportSidebarProps {
   isOpen: boolean;
@@ -24,6 +25,7 @@ interface ExportOption {
 }
 
 export default function ExportSidebar({ isOpen, onClose, result }: ExportSidebarProps) {
+  const { t } = useLanguage();
   const [copiedId, setCopiedId] = useState<string | null>(null);
   const [exportingId, setExportingId] = useState<string | null>(null);
 
@@ -127,7 +129,7 @@ export default function ExportSidebar({ isOpen, onClose, result }: ExportSidebar
       }, 1000);
     } catch (err) {
       console.error('Export failed:', err);
-      alert('导出失败，请重试');
+      alert(t.export.failed);
     } finally {
       setExportingId(null);
     }
@@ -160,7 +162,7 @@ export default function ExportSidebar({ isOpen, onClose, result }: ExportSidebar
       }, 1000);
     } catch (err) {
       console.error('Failed to generate image:', err);
-      alert(`生成图片失败: ${err}`);
+      alert(`${t.export.imageFailed}: ${err}`);
     } finally {
       setExportingId(null);
     }
@@ -228,9 +230,9 @@ export default function ExportSidebar({ isOpen, onClose, result }: ExportSidebar
   };
 
   const categories: { id: ExportCategory; icon: LucideIcon; label: string }[] = [
-    { id: 'Code', icon: Code2, label: 'Code' },
-    { id: 'Image', icon: ImageIcon, label: 'Image' },
-    { id: 'File', icon: FileText, label: 'File' },
+    { id: 'Code', icon: Code2, label: t.export.categories.code },
+    { id: 'Image', icon: ImageIcon, label: t.export.categories.image },
+    { id: 'File', icon: FileText, label: t.export.categories.file },
   ];
 
   return (
@@ -251,7 +253,7 @@ export default function ExportSidebar({ isOpen, onClose, result }: ExportSidebar
         `}
       >
         <div className="flex items-center justify-between px-6 py-5 border-b border-gray-100 shrink-0">
-          <h2 className="text-lg font-bold text-gray-900">Export</h2>
+          <h2 className="text-lg font-bold text-gray-900">{t.export.title}</h2>
           <button onClick={onClose} className="p-2 hover:bg-gray-100 rounded-full transition-colors">
             <X size={20} className="text-gray-500" />
           </button>