Translation

app/learn/chinese/02/page.tsx

@@ -1,20 +1,18 @@
 "use client";
 
-import { PinyinPractice } from "@/components/pinyin/PinyinPractice";
-import { characters } from "./characters";
+import { TranslationPractice } from "@/components/translation/TranslationPractice";
 
-export const title = "漢字からピンイン";
+export const title = "翻訳";
 
-export default function ChinesePinyinPage() {
+export default function ChineseTranslationPage() {
   return (
     <div>
-      <h1 className="text-2xl font-bold text-zinc-800 dark:text-zinc-100">漢字からピンイン</h1>
+      <h1 className="text-2xl font-bold text-zinc-800 dark:text-zinc-100">翻訳</h1>
       <p className="mt-2 text-zinc-600 dark:text-zinc-400">
-        基本的な漢字を1字ずつ見て、ピンインを入力しましょう。四声は母音を入力した直後に
-        ↑／↓キーで選べます。
+        中国語⇔日本語の訳文を書き、AIに添削してもらいましょう。
       </p>
       <div className="mt-8">
-        <PinyinPractice characters={characters} />
+        <TranslationPractice languageSlug="chinese" languageLabel="中国語" />
       </div>
     </div>
   );

app/learn/chinese/03/page.tsx

@@ -0,0 +1,21 @@
+"use client";
+
+import { PinyinPractice } from "@/components/pinyin/PinyinPractice";
+import { characters } from "./characters";
+
+export const title = "漢字からピンイン";
+
+export default function ChinesePinyinPage() {
+  return (
+    <div>
+      <h1 className="text-2xl font-bold text-zinc-800 dark:text-zinc-100">漢字からピンイン</h1>
+      <p className="mt-2 text-zinc-600 dark:text-zinc-400">
+        基本的な漢字を1字ずつ見て、ピンインを入力しましょう。四声は母音を入力した直後に
+        ↑／↓キーで選べます。
+      </p>
+      <div className="mt-8">
+        <PinyinPractice characters={characters} />
+      </div>
+    </div>
+  );
+}

app/learn/french/02/page.tsx

@@ -1,18 +1,16 @@
 "use client";
 
-import { ConjugationPractice } from "@/components/verbs/ConjugationPractice";
-import { frenchConjugationConfig } from "@/lib/conjugation/fr/config";
-import { verbs } from "./verbs";
+import { TranslationPractice } from "@/components/translation/TranslationPractice";
 
-export const title = "動詞の活用";
+export const title = "翻訳";
 
-export default function FrenchVerbConjugationPage() {
+export default function FrenchTranslationPage() {
   return (
     <div>
-      <h1>動詞の活用</h1>
-      <p>動詞・時制・法を選んで、活用形を入力しながら覚えましょう。</p>
+      <h1>翻訳</h1>
+      <p>フランス語⇔日本語の訳文を書き、AIに添削してもらいましょう。</p>
       <div className="mt-8">
-        <ConjugationPractice verbs={verbs} language={frenchConjugationConfig} sectionSlug="02" />
+        <TranslationPractice languageSlug="french" languageLabel="フランス語" />
       </div>
     </div>
   );

app/learn/french/03/page.tsx

@@ -0,0 +1,19 @@
+"use client";
+
+import { ConjugationPractice } from "@/components/verbs/ConjugationPractice";
+import { frenchConjugationConfig } from "@/lib/conjugation/fr/config";
+import { verbs } from "./verbs";
+
+export const title = "動詞の活用";
+
+export default function FrenchVerbConjugationPage() {
+  return (
+    <div>
+      <h1>動詞の活用</h1>
+      <p>動詞・時制・法を選んで、活用形を入力しながら覚えましょう。</p>
+      <div className="mt-8">
+        <ConjugationPractice verbs={verbs} language={frenchConjugationConfig} sectionSlug="03" />
+      </div>
+    </div>
+  );
+}