tRPC

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

Join

tRPC

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

Join

tltl

1/27/2023

Does useSuspenseQuery trigger suspense on just initial load or whenever it's fetching data?

What I'm looking for: I'd like to show the suspense whenever it's fetching data.

Matt

1/26/2023

Audit logging middleware?

I’m required for regulatory reasons to log all actions that are taken in my application for auditing and if they were successful or not. Imagine - user successfully updated a resource, user viewed <x> resource. Is there a best practice to implementing such behaviour with tRPC? I was originally thinking about a middleware but it would need to know if the action was successful post request. Thanks all....

Red Max

1/25/2023

All vanilla client queries fail with 500. Setup problem?

I'm using NextJS but using the vanilla client to integrate trpc calls into my custom hooks. But, even when using the NextJS queries, they also fail with a 500. I am completely stuck with my project until I can get this resolved. Any help is greatly appreciated. The call requires no input so I have tried it two different ways. When the router's .input is omitted the request URL is /api/trpc/generateRandomWorker?batch=1&input={"0":{"json":null,"meta":{"values":["undefined"]}}} and returns a 500....

denik1981

1/25/2023

Is it ok to use a createCaller() router within ServerSideProps?

The official trpc docs shown an example of how to use the SSGHelper router within SSPs. The procedure I wanna use needs the session object within the context. This procedure is shared by the public API trpc router thus I wouldn't want to create a different procedure that will do the same but taking the session information from someplace else. I was able to create a server side only router with createCaller and tne innerContext as suggested and it is working perfectly inside SSPs. Is there any CAVEAT regarding using this type of reouter instead the SSG provided. I do understand that I won't be able to prefetch and hydrate the page, but apart from that, is there anything that I should be aware of. ...

Rhys

1/24/2023

tRPC Cors Authentication Error

Hey, I was mainly looking to enable CORS locally for calling my tRPC endpoints in localhost:3000 (NextJS) from localhost:6006 (Storybook) I followed this doc https://trpc.io/docs/cors and this section of the advanced usage to enable cors https://trpc.io/docs/api-handler#advanced-usage but I'm getting the following error CORS No Allow Credentials - Removing the credentials: include fixes this https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Credentials however then I'm unable to use authenticated endpoints What I'm looking to do is call my authed endpoints on localhost:3000 from localhost:6000, has anyone had experience with this?...

Jokcy

1/22/2023

Demo code `trpc.infinitePosts.add` on infinitedQuery not working

Doc here: https://trpc.io/docs/useInfiniteQuery#getinfinitedata, I created an my query like this: ``` infinitePosts: protectedProcedure .input( z.object({...

Captain

1/21/2023

NextJS + TRPC + NX

i have a nextjs application inside a NX monorepo. i have everything for @trpc/server inside a node library. i have moved the utils file inside the SRC folder in the next js project. this way, i have node lib which does all for routing an backend logic. i have another lib for ui. this lib exports dumb ui components. suppose i wanted to move the trpc utils file to one of my libraries so as to be able to fetch data inside the "dumb components", could i do this and is this correct? right now, im forced to prop drill because applications cant share code in NX. only libs can. anyone have a pattern for either creating smart components inside NX libs or a pattern for providing context?...

Ryan Gillie

1/18/2023

Transform Errors

I get really lazy with my prisma try / catch and was wondering the best place to handle those errors and make them more generic for the front end. I've looked at both https://trpc.io/docs/error-formatting and https://trpc.io/docs/error-handling, but not super sure which one it would be handled in. Basically I just want to check if it's a prisma error, change it to a generic error, and change the message so the users won't know a unique key lookup failed for example...

wleistra

1/18/2023

Global context or shared context.

We are using react query and trpc and we ran into a undesired effect I hope someone could help me with. We have a monorepo with 20+ frontend applications (all in react/ts). Some of those apps/utilities export components that are used in other apps. Each utility/app has its own trpc server middleware for providing data to our components. Every app is wrapped in a trpc.provider and query Provider. So if we want to use a component from utility A requesting data from server A in app B we wrap that c...

Nick

1/17/2023

Not sure how to troubleshoot `Failed to fetch at Function.from`

Am getting this on a trpc mutation in v.9 that is firing successfully then pushing me to the URL with the input params? Can add more details shortly. In Next + React

Captain

1/15/2023

the tRPC loop or cycle

what is the full sequesnce of execution of trpc? where does it start when a user requests something and where does it end? i would like to remove services from IoC after execution is complete.

MonkeyStruct

1/15/2023

tRPC context and NextJS

Guys quick question about using trpc and nextjs. I'm using context with trpc to create some queries that will be only accessible by logged in users. On nextjs side I'm using react context to manage it for now. So my thinking was to pass one of the ctx variable that will be user ID to trpc server when I use useQuery. Ex) trpc.user.getSecret.useQuery(undefined, {req.body}). But I'm honestly stuck on how I can send next request body. Code for trpc context is this. ``` export const createContext = async (opts: CreateNextContextOptions) => { // console.log(opts.req, "inside trpc context"); async function getUser() { ...

Stivo

1/13/2023

Is it possible to create a generic router to pass a type on?

Hi, I was wondering if it is possible to create a generic router to pass a type which is expected to return

lois

1/12/2023

Hardware IoT API

Maybe it's a wrong place to ask but out of curious: Does anyone have experience building API for hardware/IoT device to control and monitor them from frontend? How's the process? How long did it take? How's the investment come back?

tmy03

1/12/2023

Help to understand how and when to use tRPC in larger projects

Hi! I'm pretty sure the answer to my question is that tRPC is not suitable for this project, but anyway I would like a second though and perhaps also some inspiration to what kind of projects it is suitable for. I'm soon bootstrapping a project where I'll have multiple webapps (NextJS) and possibly iOS/Android (React Native) which consumes API(s) (Express/Fastify?) that talks to one or more databases (Prisma) and third party APIs. The API/functionality is fairly large, so it would make sense to not make a huge monolith but aim for something between microservice/macroservice architecture. The API also needs to be "public", so I've had a look at trpc-openapi....

wleistra

1/11/2023

Best practices on trpc and Sentry

We are currently migrating to trpc from Apollo server/graphql. We don't use next. What are the best practices for using error reporting tools like Sentry to get end to end (client to server) error handling or if that is challenging informative errors to sentry from trpc-server. Would love to hear your experiences. Thanks in advance.

Captain

1/11/2023

How to do dependecy injection?

My routes are grouped by using the router object. i'd like to be able to inject a service to each route group. is this possible and how can i do this?...

xeon06

1/10/2023

input needs to be an object when doing a batch call?

Hey folks, just setup tRPC and running into the above error when trying to run mutations. Queries, even with inputs, work fine. Am I doing something wrong? ```ts // Router export default router({...

arashi-dev

1/10/2023

dynamic query and mutation

Hello. I have an edit form component like this: ```tsx const router = useRouter() const { t } = useTranslation(["admin/common"])...

lois

1/9/2023

A lot of WHY

Great post from @cje on Twitter but also got a lot of questions 1. If the data flow starts from server/api/routers/examples.ts , why is the create-t3-app documentation starts from pages/api/trpc/[trpc].ts? Is there specific reason for that? Or is it just a big massive loop that has no starts and ends? 2. When you say Next.js hands the request to tRPC, shouldn't it be from pages/[somepage]/*.tsx -> page/api/[someapi] ->server/trpc.ts -> server/trpc/*.tsor some server/db/*.ts? ...

Previous Next