tRPC

T

tRPC

Move Fast & Break Nothing. End-to-end typesafe APIs made easy.

Join

how does batching work?

My understanding is that batching basically combines multiple requests in a single network request, does this require any setup on my end? How does trpc know to wait for another request to batch it together?

Links vs Middlewares

What is the difference between a middleware and a link? These two seems to behave the same?

Setting up tRPC with Supabase and Drizzle

Hi! 😄 Is there someone that has any recommendations on how I should setup tRPC with Supabase Auth and Drizzle as ORM? I'm looking to Replace Clerk with Supabase in this repo but not sure if there's anything specific I should think about? ...

Cannot read properties of undefined (reading 'trpc')

I keep getting that when trying to make an api request with my next.js page. I am using the latest Next.js version with app router enabled.

Does SSG / ServerSideHelpers allow for mutations in getServerSideProps Nextjs ?

Hi, I have a use case where I send the user to a payment portal, and the payment portal can send the user back to my app by either a success URL or a cancel URL. I add different params to each URL to tell my app to do stuff about it. I had the idea to use getServerSideProps to retrieve the params and do the stuff, and afterwards redirect the user to the same page but without the params (such that the whole thing appears as default). I've set up the ssg helper but then I don't see my routes that have mutations. Only the query routes appear available. Is this as intended? Thanks for any help!...

Can someone explain MiddlewareFunction?

I am trying to create a custommiddleware.ts file and I would like some explanation on what goes into the type MiddlewareFunction. I don't quiet understand what the types TParams extends ProcedureParams<AnyRootConfig,unknown,unknown,unknown,unknown,unknown,unknown> and TParamsAfter extends ProcedureParams<AnyRootConfig,unknown,unknown,unknown,unknown,unknown,unknown> . Basically, what do I need to pass into MiddlewareFunction<?,?>. Thank you

How do I get the queries and mutations list in v10?

Hello, In tRPC v9 I can do: ``` const queries = Object.keys(appRouter._def.queries);...

Issues with subrouters being treated as any on client

I have 3 sub routers, all with a hello query just returning an object with world. I'm using nextjs with version 10.32.0 on both client and server (server is in separate express application) and the inferred types aren't working - it's treating the subrouter as an "any" type in the client, but the result works correctly when logged to the browser. We've setup everything we believe correctly with a nextjs frontend and an express backend. We're using pnpm workspaces, has anyone seen an issue like t...

Strange trpc types

Hello, I just installed a fresh trpc project with prisma and next. I have a prisma schema such as: ```prisma model Example { id String @id @default(cuid())...

Is there a version of tRPC v10 that works with Next 12?

Hi, is there a version of tRPC that works with Next 12 and React 17? We want to incrementally adopt Next 13 and React 18 and also introduce tRPC. But we sadly have to start with Next 12 and React 17 to get there eventually. ---...

Running TRPC on Vercel with custom serialization fails

Hi all, I'm having some difficulties with the serialization of my objects when I run on vercel. I'm running nextjs 13.4.4 with trpc/server,client,next 10.28.1 and the next page routing. I'm using a custom type "ts-money" which is returned in a trpc response like: ```...

How to prefetch data on the client into the cache?

To simplify a bit, lets say I'm making an app that allows users to view a project. I have a top level UI route with a summary of the project and then sub-routes that display more details, some of which require more fetches. Is there a way that I can make it so that when the top-level route loads, the trpc cache automatically prefetches the data needed for the sub-routes? Whenever I search the site for 'prefetch', I find the SSR stuff, but I'm actually trying to prefetch on the client. Thanks....

It's possible to upload a zip file through trpc?

I'm doing a screen where I need to upload a zip with pdfs files, it is possible with trpc? or I need to create a rest endpoint?

route needs jwt but it doesn't

hi i do have a public route but when i i call it on the front end it requires a jwt token SERVER import { publicProcedure, router } from '../../routes/trpc-init-route'; import { createUserSchema } from './users.schema';...

call socket.io events from inside trpc endpoints?

how do i implement notifications when someone likes a post with socket.io? will every user have his own socket.io room and then when someone likes their post that someone joins their room to send websocket? and what if user is offline i dont want any websocket event also how do i have my server broadcast a websocket inside the trpc route itself instead of having the frontend send both a fetch and emitting a socket event? ...

Prefetch on useContext() is not being picked up by react-query.

I need to prefetch one of my procedures to pre-load data for a page that the user can navigate to. This is all happening within a Client Component in Next 13's app directory Inspecting the Network tab in Chrome's devtools, I can see that the prefetch calls are being made, and I can inspect the data inside the response, which is correct. However, when I look at React Query's devtools, the query is not being picked up, and is therefore not being cached. When the user navigates to the page that should have prefetched data, trpc makes a fresh query and doesn't use the prefetch. I am using code that looks like this:...

how do you consume trpc endpoints from postman?

I'm currently trying to set up testing for a full stack project while using trpc. but im unsure how i can test if the trpc endpoints are working without having to write FE code. This could be useful during QA etc. has anyone tried this before?
Solution:
Some 3rd party libraries: trpc-panel: https://github.com/iway1/trpc-panel trpc-playground: https://github.com/sachinraja/trpc-playground Using postman is a bit awkward due to the RPC specification shape, there was a postman script which makes it easier to test using postman, search around on this discord server or through the issues on the main trpc repo, you'll find something....

tRPC 10 Mutations Firing Twice in Deployed Releases Only

We have a newly-upgraded tRPC 10 / ReactQuery 4 app and on two pages on which we have a lot of mutations, the mutations are firing twice on click. This is not happening on other pages of our app. This is not a case of double-click, we are already disabling the buttons on mutation commencement This does not happen in local development; this only happens on Vercel preview deployments / prod deployments....

useQuery with query params

Hi, I'm wondering how to correctly handle query params as a useQuery input using Nextjs. ``` const RecipeDetailPage: NextPageWithLayout = () => { const router = useRouter();...