From 60c827733f09a6b792365d2ee64f09f55541bf8f Mon Sep 17 00:00:00 2001
From: root <root@ubuntu-16gb-webklar-v1.0.0>
Date: Thu, 6 Aug 2026 20:48:16 +0000
Subject: [PATCH] =?UTF-8?q?Hero:=20Projektz=C3=A4hler=20live=20statt=20har?=
 =?UTF-8?q?tkodierter=2010+?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Die Statistik-Zeile im Hero zeigte fest "10+ Projekte". Sie hängt jetzt
am selben /api/projects wie der Abschnitt "Projekte" (gleicher
react-query queryKey, also weiterhin nur ein Request) und zählt die
Repositories, die tatsächlich in Gitea liegen. Fallback bleibt 10,
falls die API nicht antwortet.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
---
 src/components/Hero.tsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/components/Hero.tsx b/src/components/Hero.tsx
index 9d7f87d..7ade1e5 100644
--- a/src/components/Hero.tsx
+++ b/src/components/Hero.tsx
@@ -2,9 +2,11 @@ import { useNavigate } from "react-router-dom";
 import { ArrowRight } from "lucide-react";
 import React, { useState, useEffect, useRef } from "react";
 import { useTheme } from "next-themes";
+import { useQuery } from "@tanstack/react-query";
 import Silk from "@/components/Silk";
 import CountUp from "@/components/CountUp";
 import { trackCtaClick } from "@/lib/analytics";
+import { fetchProjects } from "@/lib/projects";
 
 const SPARKLE_SVG = (
   <svg className="btn-svg" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" aria-hidden>
@@ -37,6 +39,17 @@ const Hero = () => {
   const [companyAge, setCompanyAge] = useState("");
   const secondBtnRef = useRef<HTMLButtonElement>(null);
 
+  // Projektzähler kommt live aus Gitea – gleicher queryKey wie im Abschnitt
+  // „Projekte", react-query teilt sich den einen Request.
+  const { data: projectsSnapshot } = useQuery({
+    queryKey: ["projects"],
+    queryFn: ({ signal }) => fetchProjects(signal),
+    staleTime: 5 * 60 * 1000,
+    refetchOnWindowFocus: false,
+    retry: 1,
+  });
+  const projectCount = projectsSnapshot?.total ?? 10;
+
   useEffect(() => {
     const calculateAge = () => {
       const now = new Date();
@@ -172,7 +185,7 @@ const Hero = () => {
             <div className="stat-number text-4xl md:text-5xl text-foreground mb-2">
               <CountUp
                 from={0}
-                to={10}
+                to={projectCount}
                 direction="up"
                 duration={1.2}
                 className="count-up-text"