"Over-engineered mess with a dash of useless caching"

lang: JavaScript·14 lines

//your_submission

TRPCTrash.js

import { createHydrationHelpers } from "@trpc/react-query/rsc";
import { cache } from "react";
import { createCallerFactory, createTRPCContext } from "./init";
import { makeQueryClient } from "./query-client";
import { appRouter } from "./routers/_app";

export const getQueryClient = cache(makeQueryClient);
export const caller = createCallerFactory(appRouter)(createTRPCContext);

export const { trpc, HydrateClient } = createHydrationHelpers<typeof appRouter>(
  caller,
  getQueryClient,
);

//detailed_analysis

Unnecessary Caching

You're caching the query client creation, but it's not like it's a heavy operation. Get rid of the unnecessary caching and simplify your code.

Over-Engineered Imports

Do you really need to import everything from every module? Simplify your imports and only bring in what you need.

Lack of Error Handling

What happens if the query client creation fails? You should add some error handling to make sure your app doesn't crash unexpectedly.

//suggested_fix

TRPCTrash_fixed.js

+import { createHydrationHelpers } from '@trpc/react-query/rsc';

+import { createCallerFactory, createTRPCContext } from './init';

+import { makeQueryClient } from './query-client';

+import { appRouter } from './routers/_app';

+const getQueryClient = () => makeQueryClient();

+const caller = createCallerFactory(appRouter)(createTRPCContext);

+const { trpc, HydrateClient } = createHydrationHelpers<typeof appRouter>(caller, getQueryClient);

+export { getQueryClient, caller, trpc, HydrateClient };