tRPC

T

tRPC

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

Join

TS7056: The inferred type of this node exceeds the maximum length the compiler will serialize.

I have tsc complaining about my root app router type being too large when using --declarations. There was a ticket from 2022 about this, but it seems to have been closed as solved. There are some Zod tickets about this too, but unfortunately they don't provide solutions that are viable (e.g. disabling --declaration is not viable for me.) It seems like this is caused by having a large app router, where "large" means it has a bunch of endpoints, and the total combination of those endpoints' input and output validators (using Zod schemas) go above a certain threshold. I can solve it by strategically adding explicit types to some of the query/mutation handler function definitions, but it's a bit odd....

useUtils changes at every render and causes useEffect to be called continuously

I have a context provider where I need to invalidate a query on unmount. So I wrote this piece of code: ```ts const utils = trpc.useUtils(); useEffect(() => ( () => utils.user.example.invalidate()...

tRPC context, NeonDB & WebSockets

Hi there! I'm currently working on a serverless app with the following tech stack: Cloudflare Workers, Hono, tRPC, DrizzleORM & NeonDB....

Can't access mutate utils by createTRPCQueryUtils

I can use any query utils by createTRPCQueryUtils but not mutate utils. Here is my code...
No description

gzip responses

Is it possible to have trpc gzip its responses? Or do I need to do this somewhere else, like an intermediate webserver?

All my mutations are failing due to an empty body after upgrading to 11.0.0-rc.362

TRPCError: JSON Parse error: Unexpected EOF\n at new TRPCError (/mnt/c/Users/Ángel/IdeaProjects/back/node_modules/.pnpm/@trpc+server@11.0.0-rc.362/node_modules/@trpc/server/dist/unstable-core-do-not-import/error/TRPCError.mjs:51:12)\n at <anonymous> (/mnt/c/Users/Ángel/IdeaProjects/back/node_modules/.pnpm/@trpc+server@11.0.0-rc.362/node_modules/@trpc/server/dist/unstable-core-do-not-import/http/contentType.mjs:23:30)\n at processTicksAndRejections (:12:39) I have tried debugging in http/contentType.mjs and I found the request body is coming empty even if it shows a body on the browser devtools. Originally happened after upgrading a lot of rc.xxx versions at once but I pinpointed it on rc.362. The mutation works fine on rc.361 even using rc.364 on the client....

How to get data type from onMutate function in useMutation

I'm doing optimistic updates using the technique which is documented here https://tanstack.com/query/latest/docs/framework/react/guides/optimistic-updates . I found that I'm using the same queries in multiple spots and want to extract the update code so that I don't have to copy and paste. I can't figure out the type of the data parameter in the onMutate function. ``` api.task.createTask.useMutation({ onMutate: async (data) => {}})...

How can I use multiple DBs with trpc in T3 app?

I'm cross posting to T3 Discord as well. Here's the Q: Hey all, I'm using T3 for a proof of concept at the startup I work at. I'm really really digging this stack and want to pitch it to our team to replace our current stack. I've chosen to work with Drizzle, can explain more why if necessary but will wave my hands at that for a moment....

How does tRPC work?

I have a few quesstions regarding tRPC How does tRPC achieve type-safety without code-gen? Can tRPC work purely over websockets?...

How to disable Next.js draftmode in tRPC?

Hi guys, is it possible to disable the Next.js draft mode using tRPC? I am tryin to achieve something such as this: ``` import { draftMode } from 'next/headers';...

Handle Multipart form data.

how to handle multipart form data using Trpc. I want to upload an image to a file storage service. using trpc procedure.

Running Websockets/Subscriptions with Fetch / Edge Runtimes Adapter

Hi, has anyone been able to use trpc websockets/subscriptions? I am having challenges setting up the ws server using Fetch / Edge Runtimes Adapter and running it either in dev or production mode. Tried to follow the docs but it does not highlight this bit. I am using Node 20> and pnpm. Here is my route handler...

TRPClientError: Unexpected character

Hello, I am working on an Expo app and I seemingly randomly get the error in the picture. I don't really know why because I send many requests and sometimes it happens and sometimes not. I can provide any code that could be helpful. This the project repo: https://github.com/lmnek/run-app (I use npm and these packages ├── @trpc/client@11.0.0-rc.359 ├── @trpc/react-query@11.0.0-rc.359...
Solution:
Usually a sign that something between the client and the server isn’t working in the infrastructure
No description

Change db url in ctx with an API call

I want to have a switch in my frontend to change from dev db to prod db. I'm using prisma. Have 2 prisma instances (one for prod and the other for dev). Is there any way to override the prisma instance in the ctx with an API call?

TRPC Docs Generation

Hey, I want to generate a swagger-like interface to document my TRPC api. However, I don't want to use trpc-openapi because I don't want to have to map the endpoints to be restful. I just want to directly generate docs for the rpc calls without converting it into openapi. I found a package that does exactly this, but now I can't find it again for the life of me. Would anyone know which package does this?

error: NEXT_REDIRECT

Hi I'm doing a server call in RSC, but it crash the app and show this kind of error where shows in the pic. So, how to make a redirect when user validation failed in a trpc middleware? this is minimally reproducible code https://github.com/Dieber/t3-test-redirect...
No description

Is there a way to use TRPC React Query Integration with Nanostores instead of the Context API?

Currently we use TRPC by wrapping out application in a TRPC context provider. However, in some use cases, such as an Astro App, we don't want to wrap our entire app in a React Context. A common solution is to share state between Astro islands using nanostores (https://docs.astro.build/en/recipes/sharing-state/). I wanted to know if there is any way to share the TRPCReact client between Astro components using nano stores, without needing to use a React Context Provider. We can already share the React Query client between components using nanostores by passing the client as a parameter to the useQuery function. However, I could not find an option to pass the trpc client in the same way. I would greatly appreciate any help on this....

What do you guys think about the approach of importing/exporting tRPC types to be used in separate B

Hello, I was looking for a way to share tRPC API between multiple electron apps, I thought first about using a Nx monorepo but it turned out it's almost impossible to make it work with electron app that use electron-vite. After more research I found this repo: https://github.com/mkosir/trpc-api-boilerplate...

How to add fallback link to tRPC link (Mirror API URL if main URL failed)

My API URL is not functioning in Iran, I'm using Vercel and Vercel has banned Iran, I want to provide a different URL as a mirror API URL in case the main URL fails, How can I do that using tRPC links?...

How can I show real-time post's replies/comments after a successful a reply mutation?

After submitting a successful reply mutation, I want to show a real-time UI update on my frontend?