fix(i18n): add missing translation keys for editor, visualization, theme toggle

- LessonCodePanel: replace hardcoded Korean "에디터" with t('lesson.editor')
- ThemeToggle: use i18n keys instead of hardcoded Korean theme labels
- Add lesson.editor, lesson.visualization keys to EN/ZH/KO
- Add theme.soft/dark/minimal/change keys to EN/ZH/KO

Author: jammy0903

packages/frontend/src/components/ThemeToggle.tsx

@@ -4,13 +4,16 @@
  * 클릭할 때마다 테마 순환: soft → dark → minimal → soft
  */
 
+import { useTranslation } from 'react-i18next';
 import { Palette } from 'lucide-react';
 import { useThemeStore } from '@/stores/themeStore';
-import { themeLabels } from '@/config/themes';
 
 export function ThemeToggle() {
+  const { t } = useTranslation();
   const { theme, cycleTheme } = useThemeStore();
 
+  const labelKey = `theme.${theme}` as const;
+
   return (
     <button
       onClick={cycleTheme}
@@ -20,10 +23,10 @@ export function ThemeToggle() {
         color: theme === 'dark' ? '#e5e7eb' : '#4b5563',
         border: `1px solid ${theme === 'dark' ? '#4b5563' : '#d1d5db'}`,
       }}
-      title="테마 변경"
+      title={t('theme.change')}
     >
       <Palette size={14} />
-      <span>{themeLabels[theme]}</span>
+      <span>{t(labelKey)}</span>
     </button>
   );
 }

packages/frontend/src/features/courses/components/LessonCodePanel.tsx

@@ -7,6 +7,7 @@
  */
 
 import { useState, useRef, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
 import { Code2 } from 'lucide-react';
 
 import { CodeMirrorEditor, type CodeSelection } from '@/features/visualizers/shared/components/CodeMirrorEditor';
@@ -37,6 +38,7 @@ export function LessonCodePanel({
   className,
   style,
 }: LessonCodePanelProps) {
+  const { t } = useTranslation();
   const [codeRatio, setCodeRatio] = useState(defaultRatio);
   const isDragging = useRef(false);
   const containerRef = useRef<HTMLDivElement>(null);
@@ -97,7 +99,7 @@ export function LessonCodePanel({
             }}
           >
             <Code2 className="w-3 h-3 mr-1.5" />
-            에디터
+            {t('lesson.editor')}
           </div>
         )}
         <div className="flex-1 overflow-y-auto" style={{ minHeight: 0 }}>

packages/frontend/src/locales/en/translation.json

@@ -160,6 +160,8 @@
     "no_explanation": "No explanation available",
     "expand": "Show more",
     "collapse": "Show less",
+    "editor": "Editor",
+    "visualization": "Visualization",
     "c_code": "C Code",
     "python_code": "Python Code",
     "java_code": "Java Code",
@@ -435,5 +437,12 @@
     "send": "Send",
     "success": "Sent successfully! Thank you.",
     "error": "Failed to send. Please try again later."
+  },
+
+  "theme": {
+    "change": "Change theme",
+    "soft": "Soft",
+    "dark": "Dark",
+    "minimal": "Minimal"
   }
 }

packages/frontend/src/locales/ko/translation.json

@@ -160,6 +160,8 @@
     "no_explanation": "설명이 없습니다",
     "expand": "더보기",
     "collapse": "접기",
+    "editor": "에디터",
+    "visualization": "시각화",
     "c_code": "C 코드",
     "python_code": "Python 코드",
     "java_code": "Java 코드",
@@ -435,5 +437,12 @@
     "send": "전송",
     "success": "전송 완료! 감사합니다.",
     "error": "전송 실패. 잠시 후 다시 시도해주세요."
+  },
+
+  "theme": {
+    "change": "테마 변경",
+    "soft": "소프트",
+    "dark": "다크",
+    "minimal": "미니멀"
   }
 }

packages/frontend/src/locales/zh/translation.json

@@ -160,6 +160,8 @@
     "no_explanation": "暂无讲解",
     "expand": "展开",
     "collapse": "收起",
+    "editor": "编辑器",
+    "visualization": "可视化",
     "c_code": "C 代码",
     "python_code": "Python 代码",
     "java_code": "Java 代码",
@@ -432,5 +434,12 @@
     "col_problem": "题目",
     "col_result": "结果",
     "col_submitted_at": "提交时间"
+  },
+
+  "theme": {
+    "change": "切换主题",
+    "soft": "柔和",
+    "dark": "暗黑",
+    "minimal": "简约"
   }
 }