refactor(core-trpc): break the core-api package cycle

core-trpc imported AppRouter (type-only) from core-api, which depends
on the features, which depend on core-trpc — a cycle that killed every
turbo graph walk (lint/build/CI) and an illegal core -> core-composition
boundary edge. The tRPC context is now router-agnostic (AnyTRPCRouter);
useTRPC takes the router type as a generic and each feature exports a
type-only app-slice (e.g. BlogAppSlice) mirroring its mount key, so UI
hooks keep full procedure typing without touching the composition layer.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>

packages/blog/src/integrations/api/router.ts

@@ -43,3 +43,13 @@ export const blogRouter = router({
 });
 
 export type BlogRouter = typeof blogRouter;
+
+/**
+ * This feature's slice as it is mounted in the app router (the `blog` key
+ * in @repo/core-api). UI hooks pass it to `useTRPC<BlogAppSlice>()` so
+ * they stay fully typed without core-trpc (or this feature's client code)
+ * depending on the composition layer. Type-only: erased at compile time.
+ */
+export type BlogAppSlice = ReturnType<
+  typeof router<{ blog: typeof blogRouter }>
+>;

packages/blog/src/ui/hooks/use-article-by-slug.ts

@@ -2,10 +2,11 @@
 
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { useTRPC } from "@repo/core-trpc";
+import type { BlogAppSlice } from "../../integrations/api/router";
 import type { Article } from "../../entities/models/article";
 
 export function useArticleBySlug(slug: string) {
-  const trpc = useTRPC();
+  const trpc = useTRPC<BlogAppSlice>();
   return useSuspenseQuery(trpc.blog.articleBySlug.queryOptions({ slug })) as {
     data: Article | null;
   };

packages/blog/src/ui/hooks/use-article-list.ts

@@ -2,13 +2,14 @@
 
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { useTRPC } from "@repo/core-trpc";
+import type { BlogAppSlice } from "../../integrations/api/router";
 import type { Article } from "../../entities/models/article";
 
 export function useArticleList(options?: {
   status?: "draft" | "published";
   limit?: number;
 }) {
-  const trpc = useTRPC();
+  const trpc = useTRPC<BlogAppSlice>();
   return useSuspenseQuery(
     trpc.blog.listArticles.queryOptions({
       status: options?.status ?? "published",

packages/core-trpc/package.json

@@ -15,7 +15,6 @@
     "test": "vitest run --passWithNoTests"
   },
   "dependencies": {
-    "@repo/core-api": "workspace:*",
     "@tanstack/react-query": "^5.66.0",
     "@trpc/client": "^11.17.0",
     "@trpc/react-query": "^11.17.0",

packages/core-trpc/src/client.ts

@@ -1,6 +1,20 @@
 "use client";
 
 import { createTRPCContext } from "@trpc/tanstack-react-query";
-import type { AppRouter } from "@repo/core-api";
+import type { TRPCOptionsProxy } from "@trpc/tanstack-react-query";
+import type { AnyTRPCRouter } from "@trpc/server";
 
-export const { TRPCProvider, useTRPC } = createTRPCContext<AppRouter>();
+// core-trpc must not depend on @repo/core-api (core → core-composition is an
+// illegal boundary edge and creates a package cycle through the features).
+// The runtime context is router-agnostic; consumers inject their router type
+// as a generic: features pass their app-slice type (e.g. `BlogAppSlice`),
+// apps may pass the full AppRouter.
+const context = createTRPCContext<AnyTRPCRouter>();
+
+export const TRPCProvider = context.TRPCProvider;
+
+export function useTRPC<
+  TRouter extends AnyTRPCRouter = AnyTRPCRouter,
+>(): TRPCOptionsProxy<TRouter> {
+  return context.useTRPC() as unknown as TRPCOptionsProxy<TRouter>;
+}

packages/core-trpc/src/index.ts

@@ -1,3 +1,2 @@
 export { useTRPC, TRPCProvider } from "./client";
 export { getQueryClient } from "./query-client";
-export type { AppRouter } from "@repo/core-api";

packages/core-trpc/src/providers/next-provider.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { QueryClientProvider } from "@tanstack/react-query";
 import { createTRPCClient, httpBatchLink } from "@trpc/client";
 import superjson from "superjson";
-import type { AppRouter } from "@repo/core-api";
+import type { AnyTRPCRouter } from "@trpc/server";
 import { TRPCProvider } from "../client";
 import { getQueryClient } from "../query-client";
 
@@ -22,7 +22,9 @@ export function NextTrpcProvider({
 }) {
   const [queryClient] = useState(() => getQueryClient());
   const [trpcClient] = useState(() =>
-    createTRPCClient<AppRouter>({
+    // Router-agnostic on purpose: procedure typing comes from useTRPC<TRouter>
+    // at the call sites, not from the wire-level client.
+    createTRPCClient<AnyTRPCRouter>({
       links: [
         httpBatchLink({
           url: `${getBaseUrl()}${trpcUrl}`,

packages/core-trpc/src/providers/tanstack-provider.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { QueryClientProvider } from "@tanstack/react-query";
 import { createTRPCClient, httpBatchLink } from "@trpc/client";
 import superjson from "superjson";
-import type { AppRouter } from "@repo/core-api";
+import type { AnyTRPCRouter } from "@trpc/server";
 import { TRPCProvider } from "../client";
 import { getQueryClient } from "../query-client";
 
@@ -17,7 +17,9 @@ export function TanstackTrpcProvider({
 }) {
   const [queryClient] = useState(() => getQueryClient());
   const [trpcClient] = useState(() =>
-    createTRPCClient<AppRouter>({
+    // Router-agnostic on purpose: procedure typing comes from useTRPC<TRouter>
+    // at the call sites, not from the wire-level client.
+    createTRPCClient<AnyTRPCRouter>({
       links: [httpBatchLink({ url: trpcUrl, transformer: superjson })],
     }),
   );

packages/marketing-pages/src/integrations/api/router.ts

@@ -32,3 +32,13 @@ export const marketingPagesRouter = router({
 });
 
 export type MarketingPagesRouter = typeof marketingPagesRouter;
+
+/**
+ * This feature's slice as it is mounted in the app router (the `marketingPages` key
+ * in @repo/core-api). UI hooks pass it to `useTRPC<MarketingPagesAppSlice>()` so
+ * they stay fully typed without core-trpc (or this feature's client code)
+ * depending on the composition layer. Type-only: erased at compile time.
+ */
+export type MarketingPagesAppSlice = ReturnType<
+  typeof router<{ marketingPages: typeof marketingPagesRouter }>
+>;

packages/marketing-pages/src/ui/hooks/use-page-by-slug.ts

@@ -2,10 +2,11 @@
 
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { useTRPC } from "@repo/core-trpc";
+import type { MarketingPagesAppSlice } from "../../integrations/api/router";
 import type { Page } from "../../entities/models/page";
 
 export function usePageBySlug(slug: string) {
-  const trpc = useTRPC();
+  const trpc = useTRPC<MarketingPagesAppSlice>();
   // A missing slug now rejects with NOT_FOUND (PageNotFoundError), so a
   // resolved query always carries a Page.
   return useSuspenseQuery(

packages/marketing-pages/src/ui/hooks/use-site-settings.ts

@@ -2,10 +2,11 @@
 
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { useTRPC } from "@repo/core-trpc";
+import type { MarketingPagesAppSlice } from "../../integrations/api/router";
 import type { SiteSettings } from "../../entities/models/site-settings";
 
 export function useSiteSettings() {
-  const trpc = useTRPC();
+  const trpc = useTRPC<MarketingPagesAppSlice>();
   return useSuspenseQuery(
     trpc.marketingPages.siteSettings.queryOptions({}),
   ) as { data: SiteSettings };

packages/navigation/src/integrations/api/router.ts

@@ -9,14 +9,22 @@ import type { IGetHeaderController } from "../../interface-adapters/controllers/
 import { navigationProcedure } from "./procedures";
 
 export const navigationRouter = router({
-  header: navigationProcedure
-    .input(getHeaderInputSchema)
-    .query(({ input }) => {
-      const ctrl = navigationContainer.get<IGetHeaderController>(
-        NAVIGATION_SYMBOLS.IGetHeaderController,
-      );
-      return ctrl(input);
-    }),
+  header: navigationProcedure.input(getHeaderInputSchema).query(({ input }) => {
+    const ctrl = navigationContainer.get<IGetHeaderController>(
+      NAVIGATION_SYMBOLS.IGetHeaderController,
+    );
+    return ctrl(input);
+  }),
 });
 
 export type NavigationRouter = typeof navigationRouter;
+
+/**
+ * This feature's slice as it is mounted in the app router (the `navigation` key
+ * in @repo/core-api). UI hooks pass it to `useTRPC<NavigationAppSlice>()` so
+ * they stay fully typed without core-trpc (or this feature's client code)
+ * depending on the composition layer. Type-only: erased at compile time.
+ */
+export type NavigationAppSlice = ReturnType<
+  typeof router<{ navigation: typeof navigationRouter }>
+>;

packages/navigation/src/ui/hooks/use-header.ts

@@ -2,10 +2,11 @@
 
 import { useSuspenseQuery } from "@tanstack/react-query";
 import { useTRPC } from "@repo/core-trpc";
+import type { NavigationAppSlice } from "../../integrations/api/router";
 
 // eslint-disable-next-line @typescript-eslint/explicit-function-return-type
 export function useHeader() {
-  const trpc = useTRPC();
+  const trpc = useTRPC<NavigationAppSlice>();
   return useSuspenseQuery(trpc.navigation.header.queryOptions({})) as {
     data: {
       items: { label: string; href: string; external: boolean }[];