From db114c35b5145a66d06c8fc36e6f0d28ca0b1b6a Mon Sep 17 00:00:00 2001
From: Marc Mintel <marc@mintel.me>
Date: Thu, 14 May 2026 21:27:14 +0200
Subject: [PATCH] fix(ui): correct md heading styling and unify map components
 data

---
 app/[locale]/[slug]/page.tsx | 30 ++++++++++++++++++++++++++++--
 content/de/ueber-uns.mdx     |  6 +++---
 content/en/ueber-uns.mdx     |  6 +++---
 3 files changed, 34 insertions(+), 8 deletions(-)

diff --git a/app/[locale]/[slug]/page.tsx b/app/[locale]/[slug]/page.tsx
index e30e8c478..a32818234 100644
--- a/app/[locale]/[slug]/page.tsx
+++ b/app/[locale]/[slug]/page.tsx
@@ -8,6 +8,8 @@ import { MDXRemote } from 'next-mdx-remote/rsc';
 import { SITE_URL } from '@/lib/schema';
 import TrackedLink from '@/components/analytics/TrackedLink';
 import { getButtonClasses, ButtonOverlay } from '@/components/ui/Button';
+import { getAllReferences } from '@/lib/references';
+import { defaultLocations } from '@/lib/map-data';
 
 // Import components used in MDX
 import { HeroVideo as HomeHero } from '@/components/blocks/HeroVideo';
@@ -135,6 +137,30 @@ export default async function Page(props: { params: Promise<{ locale: string; sl
   // Determine layout type
   const isFullBleed = pageData.frontmatter.layout === 'fullBleed';
 
+  // Fetch references to enrich the map if it's used
+  const references = await getAllReferences(locale);
+  const enrichedLocations = defaultLocations.map(loc => {
+    if (loc.type === 'project') {
+      const ref = references.find(r => r.slug === loc.id);
+      if (ref) {
+        return {
+          ...loc,
+          featuredImage: ref.frontmatter.featuredImage,
+          details: [
+            ref.frontmatter.client || 'Kunde',
+            ref.frontmatter.dateString || new Date(ref.frontmatter.date).getFullYear().toString(),
+          ],
+        };
+      }
+    }
+    return loc;
+  });
+
+  const pageMdxComponents = {
+    ...mdxComponents,
+    InteractiveGermanyMap: (props: any) => <InteractiveGermanyMap locations={enrichedLocations} {...props} />,
+  };
+
   return (
     <div className={`flex flex-col min-h-screen ${isFullBleed ? '' : 'bg-white'}`}>
       {/* Generic Hero Section (only for standard pages) */}
@@ -159,7 +185,7 @@ export default async function Page(props: { params: Promise<{ locale: string; sl
       {/* Main Content Area */}
       {isFullBleed ? (
         <div className="w-full">
-          <MDXRemote source={pageData.content} components={mdxComponents} />
+          <MDXRemote source={pageData.content} components={pageMdxComponents} />
         </div>
       ) : (
         <Container className="py-16 md:py-24">
@@ -175,7 +201,7 @@ export default async function Page(props: { params: Promise<{ locale: string; sl
           {/* Main content */}
           <div className="max-w-4xl mx-auto">
             <div className="prose prose-lg md:prose-xl prose-neutral max-w-none prose-headings:font-heading prose-headings:font-bold prose-headings:tracking-tight prose-h1:text-4xl prose-h2:text-3xl prose-h2:mt-12 prose-h2:border-b prose-h2:border-neutral-200 prose-h2:pb-4 prose-h3:text-2xl prose-p:text-text-secondary prose-p:leading-relaxed prose-a:text-primary prose-a:font-medium prose-a:underline prose-a:underline-offset-4 prose-a:decoration-primary/30 hover:prose-a:decoration-primary prose-strong:text-text-primary prose-strong:font-semibold prose-li:text-text-secondary prose-ul:list-disc prose-ol:list-decimal">
-              <MDXRemote source={pageData.content} components={mdxComponents} />
+              <MDXRemote source={pageData.content} components={pageMdxComponents} />
             </div>
           </div>
         </Container>
diff --git a/content/de/ueber-uns.mdx b/content/de/ueber-uns.mdx
index 2c773e596..53f54773e 100644
--- a/content/de/ueber-uns.mdx
+++ b/content/de/ueber-uns.mdx
@@ -20,10 +20,10 @@ layout: "fullBleed"
   <div className="container max-w-6xl mx-auto px-4">
     <div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
       <div>
-        <h2 className="text-primary font-bold tracking-wider uppercase text-sm mb-4">Unsere Mission</h2>
-        <h3 className="font-heading text-4xl md:text-5xl font-extrabold text-neutral-dark mb-8 leading-tight">
+        <div className="text-primary font-bold tracking-wider uppercase text-sm mb-4">Unsere Mission</div>
+        <div className="font-heading text-4xl md:text-5xl font-extrabold text-neutral-dark mb-8 leading-tight">
           Infrastruktur für die Energie von morgen
-        </h3>
+        </div>
         <div className="w-20 h-2 bg-primary mb-8"></div>
         <div>
           Seit unserer Gründung im Jahr 2015 in Guben haben wir es uns zur Aufgabe gemacht, den Ausbau der kritischen Infrastruktur in Deutschland aktiv mitzugestalten.
diff --git a/content/en/ueber-uns.mdx b/content/en/ueber-uns.mdx
index 9490ed26f..35578d2ce 100644
--- a/content/en/ueber-uns.mdx
+++ b/content/en/ueber-uns.mdx
@@ -20,10 +20,10 @@ layout: "fullBleed"
   <div className="container max-w-6xl mx-auto px-4">
     <div className="grid grid-cols-1 lg:grid-cols-2 gap-16 items-center">
       <div>
-        <h2 className="text-primary font-bold tracking-wider uppercase text-sm mb-4">Our Mission</h2>
-        <h3 className="font-heading text-4xl md:text-5xl font-extrabold text-neutral-dark mb-8 leading-tight">
+        <div className="text-primary font-bold tracking-wider uppercase text-sm mb-4">Our Mission</div>
+        <div className="font-heading text-4xl md:text-5xl font-extrabold text-neutral-dark mb-8 leading-tight">
           Infrastructure for the Energy of Tomorrow
-        </h3>
+        </div>
         <div className="w-20 h-2 bg-primary mb-8"></div>
         <div>
           Since our foundation in 2015 in Guben, we have made it our mission to actively shape the expansion of critical infrastructure.