From f1da72848229cb57693331dae78e2e3a50c75780 Mon Sep 17 00:00:00 2001
From: Danijel Martinek <danijel@fraqtal.xyz>
Date: Tue, 5 May 2026 09:02:50 +0200
Subject: [PATCH] feat(web-tanstack): consume marketingPages.siteSettings +
 navigation.header via tRPC client

---
 apps/web-tanstack/src/routes/index.tsx | 35 +++++++++++++++++++++++---
 1 file changed, 32 insertions(+), 3 deletions(-)

diff --git a/apps/web-tanstack/src/routes/index.tsx b/apps/web-tanstack/src/routes/index.tsx
index 2a07297..04e0a24 100644
--- a/apps/web-tanstack/src/routes/index.tsx
+++ b/apps/web-tanstack/src/routes/index.tsx
@@ -1,14 +1,43 @@
 import { createFileRoute } from "@tanstack/react-router";
+import { useQuery } from "@tanstack/react-query";
+import { useTRPC } from "@repo/core-trpc";
 
-export const Route = createFileRoute("/")({
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export const Route = createFileRoute("/" as any)({
   component: Home,
 });
 
 function Home() {
+  const trpc = useTRPC();
+  const siteSettings = useQuery(trpc.marketingPages.siteSettings.queryOptions());
+  const header = useQuery(trpc.navigation.header.queryOptions());
+
+  if (siteSettings.isPending || header.isPending) {
+    return <main>Loading…</main>;
+  }
+  if (siteSettings.error || header.error) {
+    return (
+      <main>
+        Failed to load: {siteSettings.error?.message ?? header.error?.message}
+      </main>
+    );
+  }
+
   return (
     <main>
-      <h1>Template — TanStack Start</h1>
-      <p>Clean Architecture Monorepo Template</p>
+      <header>
+        <h1>{siteSettings.data?.siteName} — TanStack edition</h1>
+        <nav>
+          <ul>
+            {header.data?.items.map((item) => (
+              <li key={item.href}>
+                <a href={item.href}>{item.label}</a>
+              </li>
+            ))}
+          </ul>
+        </nav>
+      </header>
+      <p>This page is rendered by TanStack Router and consumes the same feature packages as the Next.js app.</p>
     </main>
   );
 }