tRPC

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

tRPC

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

9/20/2023

Optimizing Data Refresh with trpc in React/Nextjs? Is there a more efficient way?

I'm working on a Nextjs project using trpc, and I've noticed that I'm repeating the same code for data refetching after mutations (add, update, delete) using trpc mutations. Is there a more efficient or DRY (Don't Repeat Yourself) approach to handle data refreshing after mutations with trpc in React? I'd appreciate any suggestions or best practices to optimize this process. ```ts const addTask = trpcClient.tasks.addTask.useMutation({ onSettled: () => {...

Fenix

9/20/2023

cors

Hi! Some problems with cors maybe you can help,

readingbee.se/:1 Access to fetch at 'https://server-z4fnqa7szq-oa.a.run.app/api/trpc/mySignIn' from origin 'https://readingbee.se' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

readingbee.se/:1 Access to fetch at 'https://server-z4fnqa7szq-oa.a.run.app/api/trpc/mySignIn' from origin 'https://readingbee.se' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

https://server-z4fnqa7szq-oa.a.run.app/api/trpc/mySignIn is a trpc callback that seems to work (https://cors-test.codehappy.dev/?url=https%3A%2F%2Fserver-z4fnqa7szq-oa.a.run.app%2Fapi%2Ftrpc%2FmySignIn+&origin=https%3A%2F%2Fcors-test.codehappy.dev%2F&method=get) But the client gives me Cors errors. (I am using nuxt and as you may gather from the url its on firebase)...

acronie

9/20/2023

Showing pending inside the request?

I am using trpc with nextjs but when I am using hooks they're just not returning anything? Like it makes the request but it goes as pending and just blocks everything

FakeTechExec

9/20/2023

Output properties missing on frontend results (Type Infer)

My trpc client is inferring the type without some properties from the object (See images for explenation). The weird part is that the backend infers all the properties correctly (same piece of code) while the frontend is missing quite a few properties (one of them is id). Any idea of what is going on? Here is a list of the things that I have tried so far: ...

AlanXtreme

9/19/2023

Avoid checking for TRPCClientError, and return the error in client query/mutate

What i'm trying to do, is avoid doing try/catch on every trpc call to backend, if ZOD validation fails.. I would like to get back the error in my response back from server. What have i done to archive something simillar? add a custom link:...

hachoter

9/19/2023

Property 'query' does not exist on type ...

I think this is an issue on my end here is how I am defining everything

export const t = initTRPC.create();

export const t = initTRPC.create();

```...

vildantursic

9/17/2023

useQueries passing ctx data to splitLink not working

When tRPC is implemented with splitLink using useQueries does not pass cxt parameters to splitLink. Current implementation: ``` const trpcClient = trpc.createClient({ links: [...

0xMazout

9/16/2023

Build and Publish on lambda from Github Actions

Trying to send my TRPC API on Lambda AWS + API Gateway. I have follow the documentation. But now how can i build and publish to lambda from my github ? I know it's not directly related to TRPC but i'm kinda lost on how to create a zip file on github actions and send it to Lambda AWS ....

Barton

9/16/2023

next-pwa with trpc and push notification

How can I build an app with next-pwa, trpc and push notification?

Coop

9/15/2023

Forced router input?

I have a user route which has routes like get, delete, create etc. Some of the routes I require extra data but in all of them, my input contains:

id: z.string()

id: z.string()

...

HoXsan

9/15/2023

Authentication with Expo application

Hi guys, I wan't to convert my current application stack to T3 stack. Current stack is: - NestJS...

njwags

9/14/2023

One router multiple adapters?

Hey all! This might be misguided question, but I'm working on building an api with tRPC that will be connected to via two clients. One is a Next app and one is a CLI built with node.js via yargs. The next app is hosted via vercel, and the api is running on the vercel instance with experimental_createTRPCNextAppDirServer and the fetchRequestHandler from the fetch adapter. The cli can connect and the web app works and all is well, but... I'm trying to write integration tests for the CLI and I was hoping to use the standalone adapter to run the api during tests. https://trpc.io/docs/server/adapters/standalone ...

sumatoken

9/14/2023

tRPC Express server with Next.js

As much as I hate this, I am required to use Express for back-end and Next.js for front-end. I have two Node.js projects, an Express server and a Next.js client. I did a minimal setup on the back-end side using the Express adapter and it is working fine when i try to hit an endpoint on the browser....

HoXsan

9/13/2023

is Nextjs enough as backend?

Hi guys, I'm new to tRPC and would like to rewrite my current project to use single monorepo instead. It has: Nestjs (API), Nextjs (Frontend), React-Native/Expo (Mobile). ...

Viridian

9/13/2023

TS(2742) error when trying to create client

NPM with Node v18.16.1. I get the following error when trying to create a client. I've imported all server-related things. AppRouter is: ```ts...

thomasplayschess

9/13/2023

Wrapping useQuery into a custom hook

I'm trying to wrap useQuery into a custom hook (as I have some legacy code that I need to run before). Example: ``` trpc.myendpoint.useQuery({ foo: 'bar' }); // instead of the code above, I want to write this:...

vildantursic

9/13/2023

Pass additional data from `useQuery` to context

For splitLink there is a way to pass context value through useQuery as second param { trpc: { context: { x: y } } }, but it doesn't propagate further from splitLink. Is there a similar way to pass some data to context (I want to update context data dynamicaly) after its initialization createContext? I have case where my app have route e.g. /[appName]/machine/[x] and I would like to pass appName to context so that I don't have to pass it each time with other params on useQuery. Is that possible and what would be the best way? I was trying this trpc.machine.useQuery({ id: x }, { trpc: { ctx: { app: "<appName>" } } }) and similar variations....

GamerZero

9/12/2023

Cannot set headers in procedures with fetch adapter

Am i right that with such a setup in nextjs app router route handler: ```ts const handler = async (request: NextRequest) => { const response = await fetchRequestHandler({... request ...}) return response...

Sanjib Sen

9/12/2023

Does anybody now how to fix cors policy error?

I am facing this error: Access to fetch at 'http://localhost:3002/trpc/getBotTag?batch=1&input=%7B%7D' from origin 'http://localhost:3000' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. But this is only happening on "use client" components....

Wojciech

9/12/2023

how to handle error from Zod in trpc?

I would like to return error instead throwing it away so i could show user nice feedback i found https://zod.dev/?id=safeparse but i dont know how to implement it ...

Previous Next