diff --git a/app/learn/french/SectionNav.tsx b/app/learn/french/SectionNav.tsx new file mode 100644 index 0000000..626d457 --- /dev/null +++ b/app/learn/french/SectionNav.tsx @@ -0,0 +1,45 @@ + + +"use client"; + +import Link from "next/link"; +import { usePathname } from "next/navigation"; +import type { SectionSummary } from "@/app/learn/content"; + +export default function SectionNav({ + sections, +}: { + sections: SectionSummary[]; +}) { + const pathname = usePathname(); + const currentSlug = pathname.split("/").pop(); + + const currentIndex = sections.findIndex( + (section) => section.sectionSlug === currentSlug + ); + + const prevSection = currentIndex > 0 ? sections[currentIndex - 1] : null; + const nextSection = + currentIndex >= 0 && currentIndex < sections.length - 1 + ? sections[currentIndex + 1] + : null; + + return ( +
+ {prevSection ? ( + + ← {prevSection.title} + + ) : ( + + )} + {nextSection ? ( + + {nextSection.title} → + + ) : ( + + )} +
+ ); +} \ No newline at end of file diff --git a/app/learn/french/layout.tsx b/app/learn/french/layout.tsx index 4467384..58c7d74 100644 --- a/app/learn/french/layout.tsx +++ b/app/learn/french/layout.tsx @@ -1,15 +1,20 @@ import { getLanguage } from "@/app/learn/languages"; +import { getSections } from "@/app/learn/content"; + +import SectionNav from "./SectionNav"; +// const language = getLanguage("french"); // フランス語セクション専用レイアウト // カード型コンテナで囲み、globals.css の .french-content で見出し・表・リストを装飾する // (他言語は components/SectionLayout.tsx の共通レイアウトのまま) -export default function FrenchSectionLayout({ +export default async function FrenchSectionLayout({ children, }: { children: React.ReactNode; }) { + const sections = await getSections("french"); return (

@@ -18,6 +23,7 @@ export default function FrenchSectionLayout({

{children}
+
); }