adds the locale workflow to support multiple languages

mdx-components.tsx

@@ -5,6 +5,7 @@ import { MDXRemote, MDXRemoteProps } from 'next-mdx-remote/rsc';
 import { highlight } from 'sugar-high';
 import { CardProfile } from '@/components/CardProfile';
 import { CopyButton } from '@/components/copy-button';
+import { LocaleLink } from '@/components/LocaleLink';
 
 // Type definitions
 type HeadingProps = ComponentPropsWithoutRef<'h1'>;
@@ -72,23 +73,16 @@ function Table({ data }: { data: TableData }) {
   );
 }
 
-// Custom link component with support for internal/external links
+// Custom link: internal links get /[locale] prefix via LocaleLink; external stay <a>
 function CustomLink(props: React.AnchorHTMLAttributes<HTMLAnchorElement>) {
   const href = props.href;
-
-  if (href && href.startsWith('/')) {
-    return (
-      <Link href={href} {...props}>
-        {props.children}
-      </Link>
-    );
+  if (href && (href.startsWith('http') || href.startsWith('//'))) {
+    return <a target="_blank" rel="noopener noreferrer" {...props} />;
   }
-
   if (href && href.startsWith('#')) {
     return <a {...props} />;
   }
-
-  return <a target="_blank" rel="noopener noreferrer" {...props} />;
+  return <LocaleLink {...props} />;
 }
 
 // MDX Components for direct usage

package.json

@@ -38,13 +38,16 @@
     "@types/three": "^0.176.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
+    "i18next": "^25.8.0",
     "lucide-react": "^0.511.0",
     "next": ">=15.5.9",
+    "next-i18next": "^15.4.3",
     "next-mdx-remote": "^5.0.0",
     "next-themes": "^0.4.6",
     "postcss": "^8.5.4",
     "react": "^19.1.0",
     "react-dom": "^19.1.0",
+    "react-i18next": "^16.5.4",
     "react-icons": "^5.5.0",
     "sugar-high": "^0.9.3",
     "tailwind-merge": "^3.3.0",

src/app/[locale]/biomass/disc&data/content-de.mdx

@@ -0,0 +1,77 @@
+import { Button } from "@/components/ui/button"
+
+<div className="flex flex-wrap justify-center gap-4 my-6">
+# <WP number={1}> BIOMASS-PRODUKTE</WP>
+</div>
+<p></p>
+
+Die BIOMASS-Mission liefert eine Reihe <b>globaler, konsistenter Waldprodukte</b> aus P-Band-SAR-Beobachtungen. Zu den Kerndatenprodukten zählen <b>oberirdische Waldbiomasse</b>, <b>Waldhöhe</b> und <b>Waldschäden</b> und bieten neue Einblicke in Waldstruktur, Kohlenstoffvorräte und ihre Veränderung. Die Produkte werden als Level-2- und Level-3-Datensätze erzeugt und dienen der Langzeitbeobachtung, Klimaforschung und Erdsystemmodellierung.
+
+Zusätzlich erstellt BIOMASS <b>experimentelle und explorative Datensätze</b>, die die Besonderheiten von P-Band-SAR nutzen – für Forschung zu Walddynamik, Untersaatenstreuung und Ökosystemprozessen. Alle Produkte werden mit Unsicherheitsangaben geliefert und folgen Prinzipien offener Wissenschaft.
+
+<div className="overflow-x-auto">
+  <table className="w-full border text-left text-sm border border-gray-200">
+    <thead className="bg-[var(--accent-3)] font-bold ">
+      <tr>
+        <th>Level</th>
+        <th>Produkttyp</th>
+        <th>Beschreibung</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr>
+        <td>Level-1</td>
+        <td>SAR-Rückstreuung & interferometrische Daten</td>
+        <td>Kalibrierte P-Band-SAR-Messungen als Grundlage aller höheren Produkte.</td>
+      </tr>
+      <tr>
+        <td>Level-2</td>
+        <td>Waldbiophysikalische Produkte</td>
+        <td>Globale Karten zu oberirdischer Biomasse, Waldhöhe und Waldschäden inkl. Unsicherheiten.</td>
+      </tr>
+      <tr>
+        <td>Level-3</td>
+        <td>Raster- & Zeitreihenprodukte</td>
+        <td>Räumlich und zeitlich aggregierte Datensätze für Klimastudien, Kohlenstoffbilanzen und Langzeitmonitoring.</td>
+      </tr>
+      <tr>
+        <td>Experimental</td>
+        <td>Fortgeschrittene Forschungsprodukte</td>
+        <td>Explorative Datensätze zur Nutzung der P-Band-SAR-Möglichkeiten für Wald- und Ökosystemforschung.</td>
+      </tr>
+    </tbody>
+  </table>
+</div>
+
+## <p style={{ fontVariant: 'small-caps' }}>Open Access, Open Science und Beteiligung der Community</p>
+
+BIOMASS-Produkte, Algorithmen und Validierungswerkzeuge werden nach Prinzipien offener Wissenschaft und Open Source entwickelt. Die Prozessierungssoftware und Algorithmen sind im BIOMASS Product Algorithm Laboratory (<b>BioPAL</b>) verankert – für Transparenz, Reproduzierbarkeit und gemeinsame Weiterentwicklung. Offener Zugang zu Daten, Prozessierungsumgebungen und Auswertewerkzeugen wird über die Multi-mission Algorithm and Analysis Platform (<b>MAAP</b>) unterstützt.
+
+🔗 MAAP: <a target='blank' style={{color: "var(--accent-1)"}} href='https://maap-project.org'>https://maap-project.org</a>  
+🔗 BioPAL: <a target='blank' style={{color: "var(--accent-1)"}} href='https://github.com/BioPAL/BioPAL'>https://github.com/BioPAL/BioPAL</a>
+
+Am 12. Dezember 2025 veröffentlichte die ESA die ersten <b>BIOMASS-Open-Access-Datenprodukte</b>: <Button variant="secondary"><a href='https://earth.esa.int/eogateway/missions/biomass/biomass-data' target='_blank'> Daten abrufen → </a></Button>
+
+<hr className="border-t border-dotted border-[var(--accent-1)] my-4" />
+
+## <p style={{ fontVariant: 'small-caps' }}>BIOMASS Data Innovation and Science Cluster (DISC)</p>
+
+<p><WP number={1}>Kernaufgaben</WP></p>
+
+Der BIOMASS DISC sichert Qualität, Zuverlässigkeit und wissenschaftlichen Nutzen der BIOMASS-Produkte. Zu den Hauptaufgaben zählen:
+
+<p className="leading-tight">
+<b>Instrumenten- und Datenqualitätsüberwachung</b><br />
+Laufende Kalibrierung, Leistungsüberwachung und Qualitätssicherung für zuverlässige BIOMASS-SAR-Daten.
+
+<b>Prozessierung und Produktentwicklung</b><br />
+Pflege und Weiterentwicklung der Prozessierungsketten und Kerndaten, Einbindung neuer Erkenntnisse, Kalibrierung und Validierung.
+
+<b>Validierung und Neunprozessierung</b><br />
+Validierung der Waldprodukte anhand von Referenzdaten aus Boden- und Flugzeugmessungen sowie regelmäßige Neuprozessierungen für konsistente Langzeitdaten.
+
+<b>Wissenschaftliche Innovation und Nutzerunterstützung</b><br />
+Entwicklung experimenteller Produkte, Unterstützung der Nutzenden und Erweiterung der BIOMASS-Möglichkeiten.
+</p>
+
+Weitere Informationen: <a style={{color: "var(--accent-1)"}} href='https://biomass-disc.info/'>https://biomass-disc.info/</a>

src/app/biomass/disc&data/page.mdx → src/app/[locale]/biomass/disc&data/content-en.mdx

@@ -113,5 +113,3 @@ Validation of forest products against high-quality ground and airborne reference
 Development of experimental products, support to the user community, and extension of BIOMASS scientific capabilities.  
 </p>
 Further information: <a style={{color: "var(--accent-1)"}} href='https://biomass-disc.info/'>https://biomass-disc.info/</a>
-
-

src/app/[locale]/biomass/disc&data/page.tsx

@@ -0,0 +1,19 @@
+import { isValidLocale, defaultLocale, type Locale } from '@/config/i18n'
+import ContentEn from './content-en.mdx'
+import ContentDe from './content-de.mdx'
+
+const content = {
+  en: ContentEn,
+  de: ContentDe,
+} as const
+
+interface PageProps {
+  params: Promise<{ locale?: string }>
+}
+
+export default async function DiscDataPage({ params }: PageProps) {
+  const { locale: raw } = await params
+  const locale: Locale = raw && isValidLocale(raw) ? raw : defaultLocale
+  const Page = content[locale] ?? content.en
+  return <Page />
+}

src/app/blog/[slug]/page.tsx → src/app/[locale]/blog/[slug]/page.tsx

@@ -1,26 +1,29 @@
 // Adapted from https://github.com/vercel/examples/tree/main/solutions/blog MIT License
 import { notFound } from 'next/navigation'
 import { CustomMDX } from '@/../mdx-components'
-import { formatDate, getBlogPosts } from '@/utils/utilsBlog'
+import { formatDate, getBlogPosts, getAllBlogPosts } from '@/utils/utilsBlog'
 import { baseUrl } from '@/utils/sitemap'
 import Link from 'next/link'
-import Image from "next/image";
+import Image from "next/image"
+import { isValidLocale, defaultLocale, type Locale } from '@/config/i18n'
 
 export async function generateStaticParams() {
-  const posts = getBlogPosts()
-  return posts.map((post) => ({
-    slug: post.slug,
-  }))
+  const all = getAllBlogPosts()
+  return all.map((post) => {
+    const locale: Locale = post.slug.endsWith('_de') ? 'de' : 'en'
+    return { locale, slug: post.slug }
+  })
 }
 
 interface BlogParams {
-  params: Promise<{ slug: string }>;
+  params: Promise<{ locale: string; slug: string }>;
 }
 
 export default async function Blog({ params }: BlogParams) {
-  const { slug } = await params;
-  const posts = getBlogPosts();
-  const post = posts.find((post) => post.slug === slug);
+  const { slug, locale: raw } = await params
+  const locale: Locale = isValidLocale(raw) ? raw : defaultLocale
+  const posts = getBlogPosts(locale)
+  const post = posts.find((p) => p.slug === slug)
 
   if (!post) {
     notFound()
@@ -42,7 +45,7 @@ export default async function Blog({ params }: BlogParams) {
             image: post.metadata.image2
               ? `${baseUrl}${post.metadata.image2}`
               : `/og?title=${encodeURIComponent(post.metadata.title)}`,
-            url: `${baseUrl}/blog/${post.slug}`,
+            url: `${baseUrl}/${locale}/blog/${post.slug}`,
             author: {
               '@type': 'Person',
               name: 'My Portfolio',
@@ -51,7 +54,7 @@ export default async function Blog({ params }: BlogParams) {
         }}
       />
       <div className="flex items-center mb-2">
-        <Link href="/blog" className="text-neutral-600 dark:text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-200">
+        <Link href={`/${locale}/blog`} className="text-neutral-600 dark:text-neutral-400 hover:text-neutral-800 dark:hover:text-neutral-200">
           ← Back to Posts
         </Link>
       </div>
@@ -67,7 +70,7 @@ export default async function Blog({ params }: BlogParams) {
           </p>
         </div>
       </div>
-      <p></p>
+      <br/>
 
       {post.metadata.image2 && (
          <div className="relative -mx-10 h-[350px] mb-6 rounded-xl">

src/app/[locale]/blog/page.tsx

@@ -0,0 +1,23 @@
+import { BlogPosts } from '@/components/posts'
+import { isValidLocale, defaultLocale, type Locale } from '@/config/i18n'
+
+export const metadata = {
+  title: 'Posts',
+  description: 'Read my posts.',
+}
+
+interface PageProps {
+  params: Promise<{ locale?: string }>
+}
+
+export default async function Page({ params }: PageProps) {
+  const { locale: raw } = await params
+  const locale: Locale = raw && isValidLocale(raw) ? raw : defaultLocale
+  return (
+    <section>
+      <p></p>
+      <h1 className="max-w-6xl mx-auto px-6 mt-8 py-12 font-bold text-3xl text-center tracking-tighter text-[var(--accent-1)]">NEWS</h1>
+      <BlogPosts locale={locale} />
+    </section>
+  )
+}

src/app/decalval/team/page.mdx → src/app/[locale]/decalval/team/page.mdx

@@ -7,7 +7,7 @@ import TeamCardsGallery from '@/components/TeamCardsGallery'
 
 
 <TeamCardsGallery
-  path="decalval/team/cards"
+  path="[locale]/decalval/team/cards"
   title=""
   priorityCards={['Nuno', 'Nicole']}
 />

src/app/[locale]/landing-de.mdx

@@ -0,0 +1,121 @@
+import ContentSplitSection from '@/components/ContentSplitSection';
+import Image from 'next/image';
+import { Button } from "@/components/ui/button"
+import {
+  Card,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card"
+
+
+<div className="grid grid-cols-1 md:grid-cols-1  lg:grid-cols-2 gap-4 justify-center items-stretch max-w-5xl mx-auto">
+
+ <a href="/project/about" target='blank'> 
+  <Card className="w-[420px] h-[440px] hover:bg-[var(--accent)] transition-colors duration-200 flex flex-col justify-between border border-[var(--accent-1)]">
+    <CardHeader>
+     <CardTitle className="flex justify-center mb-4 font-bold"> Projektbüro BIOMASS </CardTitle><p></p>
+    <div className="flex justify-center mb-4">
+        <Image src="/image1.png" alt="eebiomass" width={400} height={200} />
+    </div> 
+      <CardDescription></CardDescription>
+    </CardHeader>
+  </Card>
+    </a>
+
+   <a href="/decalval/about" target='blank'> 
+  <Card className="w-[420px] h-[440px] hover:bg-[var(--accent)] transition-colors duration-200 flex flex-col justify-between border border-[var(--accent-1)]">
+    <CardHeader>
+   <CardTitle className="flex justify-center mb-4 font-bold"> Deutsche BIOMASS Cal/Val-Aktivitäten </CardTitle><p></p>
+    <div className="flex justify-center mb-4">
+        <Image src="/decalval_logo_small.png" alt="eebiomass" width={198} height={80} />
+    </div> 
+        </CardHeader>
+  </Card>
+  </a>
+</div>
+-----------------------
+<p></p>
+#### Aktuelles
+
+
+<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+
+  <Card className="w-full max-w-sm hover:bg-[var(--accent)] transition-colors duration-200">
+    <CardHeader>
+     <CardTitle className="flex justify-center mb-2">
+     <a style={{color: "var(--accent-1)"}} href='/blog'>Erste BIOMASS-Produkte verfügbar!</a>
+     </CardTitle>  
+
+    <div className="flex justify-center mb-4">
+        <a href='/blog'>
+        <Image src="/news/news24.png" alt="LPS2025" width={500} height={200} />
+        </a>
+    </div> 
+
+    </CardHeader>
+  </Card>
+
+  <Card className="w-full max-w-sm hover:bg-[var(--accent)] transition-colors duration-200">
+    <CardHeader>
+    <CardTitle className="flex justify-center mb-2"><a style={{color: "var(--accent-1)"}} href='https://www.esa.int/Applications/Observing_the_Earth/FutureEO/Biomass/Biomass_satellite_returns_striking_first_images_of_forests_and_more' target='_blank'>Erste BIOMASS-Bilder!</a></CardTitle>
+    <div className="flex justify-center mb-4">
+        <a href='https://www.esa.int/Applications/Observing_the_Earth/FutureEO/Biomass/Biomass_satellite_returns_striking_first_images_of_forests_and_more' target='_blank'>
+        <Image src="/first_image.png" alt="Erste BIOMASS-Bilder" width={400} height={200} />
+        </a>
+    </div> 
+    </CardHeader>
+
+  </Card>
+
+  <Card className="w-full max-w-sm hover:bg-[var(--accent)] transition-colors duration-200">
+    <CardHeader>
+     <CardTitle className="flex justify-center mb-2"><a style={{color: "var(--accent-1)"}} href='https://eo-college.org/resource/calibration-and-validation-cal-val-activities-in-earth-observation-missions-like-esa-biomass/' target='_blank'>BIOMASS Cal/Val-Aktivitäten</a></CardTitle>  
+    <div className="flex justify-center mb-4">
+         <a href='https://eo-college.org/resource/calibration-and-validation-cal-val-activities-in-earth-observation-missions-like-esa-biomass/' target='_blank'>
+         <Image src="/materials/commphase.png" alt="eebiomass" width={500} height={200} />
+         </a>
+    </div> 
+    </CardHeader>
+  </Card>
+
+</div>
+
+<div className="flex justify-end w-ful">
+  <Button className="bg-[var(--accent-1)] text-white hover:opacity-90">AKTUELLES → </Button>
+</div>
+
+------------------
+
+<br></br>
+
+Im April 2025 startete die ESA den Earth Explorer BIOMASS. Die Mission verbessert unser Verständnis der Rolle der Landbiosphäre im globalen Kohlenstoffkreislauf, mit klaren Implikationen im Kontext des Klimawandels. Mit Hilfe der Fernerkundung ist BIOMASS die erste Mission mit einem operationellen P-Band-SAR im Weltraum und erfasst den Zustand vor allem tropischer Wälder.
+
+Das <b><WP number={1}>Projektbüro BIOMASS</WP></b> ist eine Kooperation des Max-Planck-Instituts für Biogeochemie, der Friedrich-Schiller-Universität Jena, des Deutschen Zentrums für Luft- und Raumfahrt (DLR) und des Helmholtz-Zentrums für Umweltforschung (UFZ). Wir wollen
+ <ul className="list-disc list-inside ml-10 mt-2 space-y-0">
+-    relevante Informationen in der nationalen BIOMASS-Community zusammenführen, aufbereiten und verbreiten
+-    Lücken identifizieren
+-    Lösungen im Kontext der BIOMASS-Mission untersuchen
+-    den Dialog im weiteren Kontext der BIOMASS-Mission pflegen
+</ul>
+
+Der <b><WP number={1}>Koordinierte Deutsche Beitrag zu den BIOMASS Cal/Val-Aktivitäten</WP></b> ist eine Kooperation des Max-Planck-Instituts für Biogeochemie, des GFZ Helmholtz-Zentrums für Geowissenschaften, des DLR, des UFZ und der Technischen Universität Dresden (TUD), unterstützt von der University of Maryland und Wilderness International. Wir wollen
+ <ul className="list-disc list-inside ml-10 mt-2 space-y-0">
+-    umfangreiche Gelegenheitsdatenbanken sammeln und Referenzdaten aus Airborne-LiDAR, Drohnenbildern und Radartransekten harmonisieren
+-    Beobachtungskampagnen planen, die existierende Domänen und Dichtegradienten abdecken
+-    BIOMASS-Produkte für oberirdische Biomasse (AGBD), Waldhöhe (FH) und Waldveränderungen validieren
+-    prozessbasierte Modelle für die Dateninterpretation nutzen
+</ul>
+
+Für unsere Community bieten wir
+<ul className="list-disc list-inside ml-10 mt-2 space-y-0">
+-    Regelmäßige Webinare zu BIOMASS-Wissenschaft und Anwendungen <Button variant="secondary"><a href='/events/webinar' target='_blank'> Webinare → </a></Button>
+-    Sommerschulen zur BIOMASS-Mission <Button variant="secondary"><a href='/events/summerschool' target='_blank'>Sommerschulen → </a></Button>
+-    Tutorials und Hintergründe über das eo-college <Button variant="secondary"><a href='https://eo-college.org/' target='_blank'>eo college → </a></Button>
+-    Unterstützung für die DLR PolInSAR-Kurse <Button variant="secondary"><a href='/events/polinsar' target='_blank'>PolInSAR → </a></Button>  
+</ul>
+<p></p>
+
+<div className="flex justify-center mb-4">
+        <Image src="/BMWK-en.png" alt="Bundesministerium für Wirtschaft und Klimaschutz" width={200} height={200} />
+</div>