tpf/src/routes/prozess/index.tsx

import { createFileRoute } from "@tanstack/react-router";
import { ProcessStepper } from "@/features/prozess/components/process-stepper";
import { useKontaktStats, useNutzer } from "@/features/prozess/hooks";

export const Route = createFileRoute("/prozess/")({
	component: ProzessPage,
});

function ProzessPage() {
	const {
		data: nutzer,
		loading: nutzerLoading,
		refetch: refetchNutzer,
	} = useNutzer();
	const {
		data: stats,
		loading: statsLoading,
		refetch: refetchStats,
	} = useKontaktStats();

	if (nutzerLoading || statsLoading) return <p>Laden…</p>;
	if (!nutzer[0]) return <p>Bitte zuerst das Onboarding abschließen.</p>;

	const s = stats[0] ?? { gesamt: 0, absagen: 0 };

	return (
		<ProcessStepper
			aktuellerSchritt={nutzer[0].aktueller_schritt}
			kontaktGesamt={Number(s.gesamt)}
			absagen={Number(s.absagen)}
			onUpdate={() => {
				refetchNutzer();
				refetchStats();
			}}
		/>
	);
}