feat(cms): add storage based website content management

components/Header.tsx

@@ -3,7 +3,8 @@
 import Image from "next/image";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
-import { useState } from "react";
+import { useEffect, useState } from "react";
+import type { SettingsContent } from "@/lib/content/types";
 
 const navigation = [
   ["Start", "/"],
@@ -14,17 +15,49 @@ const navigation = [
   ["Kontakt", "/kontakt"],
 ] as const;
 
+const fallbackSettings = {
+  siteName: "Funktechnik Schubert",
+  logoUrl: "/funktechnik_schubert_logo.jpg",
+  headerCta: { label: "Reparatur anfragen", href: "/reparatur" },
+};
+
 export default function Header() {
   const pathname = usePathname();
   const [menuOpen, setMenuOpen] = useState(false);
+  const [settings, setSettings] = useState(fallbackSettings);
+
+  useEffect(() => {
+    let active = true;
+
+    async function loadSettings() {
+      try {
+        const response = await fetch("/api/content/settings");
+        const result = await response.json() as { settings?: SettingsContent };
+        if (active && response.ok && result.settings) {
+          setSettings({
+            siteName: result.settings.siteName,
+            logoUrl: result.settings.logoUrl,
+            headerCta: result.settings.headerCta,
+          });
+        }
+      } catch {
+        if (active) setSettings(fallbackSettings);
+      }
+    }
+
+    void loadSettings();
+    return () => {
+      active = false;
+    };
+  }, []);
 
   return (
     <header className="site-header">
       <div className="container header-inner">
-        <Link href="/" className="brand" aria-label="Funktechnik Schubert Startseite" onClick={() => setMenuOpen(false)}>
+        <Link href="/" className="brand" aria-label={`${settings.siteName} Startseite`} onClick={() => setMenuOpen(false)}>
           <Image
-            src="/funktechnik_schubert_logo.jpg"
-            alt="Funktechnik Schubert"
+            src={settings.logoUrl}
+            alt={settings.siteName}
             width={1672}
             height={941}
             priority
@@ -47,7 +80,7 @@ export default function Header() {
             </Link>
           ))}
         </nav>
-        <Link className="header-cta" href="/reparatur">Reparatur anfragen</Link>
+        <Link className="header-cta" href={settings.headerCta.href}>{settings.headerCta.label}</Link>
       </div>
     </header>
   );