Modular Router Thoughts

Hello, I hope I can convey clearly what I hope to accomplish. To start, I have a monorepo, with a few frontends and lots of packages. some of those packages relate to external services. For instance @org/asana and @org/zoom I have another package, that is my big-ole-router that builds the trpc router and imports all those other packages, builds middlewares to add clients, builds procedures to scope each service.... This was great when I had the router mounted in a mega App I used to have, but now I am making smaller apps with more scoped features.... I don't really want to import the mega router into each app with lots of unneeded procedures. I also don't want to create trpc routers over and over with different combos of middlewares/procedures..... Is there a nice way to be able to piece-meal a router together with the service specific pieces? Should I attach scoped service routers to difference endpoints? I don't know the best way to go about solving this problem and I would love some guidance from the community. Thank you!
AK
Alex / KATT 🐱339d ago
one way would be to define the procedures without routers then you can compose them however you want you can have a flat namespace with a lot of very long proc names in an object and then router(_.pick(procs, ['getUser, 'createUser', ..]))
K
kevin.hill.fortunabmc339d ago
I was under the impression that you can only call initTrpc once to get your t and then export the aliases like t.middleware and t.procedure... so, with this example, instead of building the zoom stuff in the trpc monorepo package how would I build procedures without routers? When I tried to export t.procedure or the protectedProcedure I made with middleware, from my @org/api and use it in @org/zoom, I got an error about using something that is instantiating itself. (Sorry, I forget the exact error since I moved on from the other day when I was stuck)
K
kevin.hill.fortunabmc339d ago
But I can't stop thinking about how to make a click-together router where the services can bring their own procedures and middleware https://discord.com/channels/867764511159091230/1109939580389572728/1111427640394530887 Actually, if I am remembering right... I think I had a cycles issue where @org/api can't export protectedProcedure for @org/asana to use to create asanaProcedure because then I would have to import it back in @org/api. Unless that is what you meant with your reply.... 🤔 I want @org/api to provide the auth, so I can protect all procedures..... I'm trying to wrap my head around this all, so can @org/api init, and create protectedProcedure and export that. Then any service can import and keep building (no routers yet anywhere!) .... (no cycles yet) then in my actual NextJS app, import both the api and the service and build the router there??? Instead of trimming, I did like you suggested. I pulled all the scoped routers into their service specific package, then removed all the router() calls and export them as procedures.
K
kevin.hill.fortunabmc339d ago
They are easily exported from their package, and then turned into the router, in the app. I realize now... @org/api shouldn't have everything
K
kevin.hill.fortunabmc339d ago
It has some local procedures, and imported procedures
AK
Alex / KATT 🐱339d ago
looking pretty nice! what are you using trpc for btw? where do you work? 😄 (sorry, i've been in the matrix with RSC all day - looks like you figured out what you want to do though?)
K
kevin.hill.fortunabmc339d ago
I am using tRPC with to rapidly build internal apps for my team. We have lots of services we use, but no good birds-eye-view of all our users. I work for https://www.fortunabmc.com/ I use NextJS and tRPC and, for example, make a simple app that ties Azure and Asana together to be able to have a drop-down of users, populated by tRPC and Azure, and then it can create tasks in Asana using info from MsGraph or maybe we need something with Asana and Zoom, or Salesforce and Dropbox. tRPC has made it so easy to modularize the different clients into procedures, protect it all with Clerk and a middleware. It's so nice to be able to do all of that with type safety I think I am running into a new issue.... Since @org/api created t with initTRPC to make my auth middleware to make my protectedProcedure ok... I imported that into @org/asana to be able to make asanaProcedure and this appeared to work... But mutations are failing because a Date is going through "naked" and failing to parse as JSON. I know you are going to say superjson and I have it everywhere it should be.... I think since the app I am building also creates a t to use in the app, but now there are 2 ts, one from inside @org/api and then the other from the app? Is that what is causing it not to transform? That was it!!! I went ahead and exported t from @org/api so that I can use that instance inside the app to create the final router and it finally works!! You're a great sounding board 🤣
K
kevin.hill.fortunabmc339d ago
K
kevin.hill.fortunabmc339d ago
K
kevin.hill.fortunabmc333d ago
I continued on this path and now have slim, composable routers that can be defined per app with just what they need 🙂
K
kevin.hill.fortunabmc333d ago
AK
Alex / KATT 🐱333d ago
Looking great! You could do a blog article about this! ☺
More Posts
Issue with trpc fetch when trying to pass Clerk auth to contextI'm currently trying to add Clerk auth to my trpc context, but I just keep getting this error: `ErrBullMQ + TRPCCurious how to configure BullMQ with TRPC correctly. Currently I have the queue, queueevents, and thTrpc refetches all of the queries when i run a mutationIm running node 16.15.0 with Pnpm When i run a mutation for some reason all of the queries get refettRPC Client on NodeJS server keeps complaining that no fetcher has been configuredHey, I want to create a tRPC setup where I have one server (works fine) and then a client which is cBest Practice to Fetch a Query OnDemandWhat's the best practice to fetch a query on demand? I don't have the context for the query's inputOutput Response ShapeI'm wondering, is the output response shape locked in, or can we modify it in any way? For example: Need help```js import {initTRPC} from '@trpc/server'; import * as trpcNext from '@trpc/server/adapters/next';useQuery hook modify data on fetch.Hello is it possible to modify the data that is fetched with useQuery hook in tRPC basically im storAccepting a DecoratedProcedure with inputs and outputs that extend some given typesIs there any way to accept a DecoratedProcedure that extends { mutate: Resolver<TProcedure> } where useEffect and useMutation error about conditional rendering of hooksI am using t3 stack with tRPC, and I am trying to mark all emails as seen when the page loads by usiGuide to create an adapterIs there a guide on the docs that explains the basics to create an adapter?Does tRPC websocket client supports wss protocol?After changing the websocket client url from ws to wss, it fails to connect. Tested out the connectiGet the type of context after middlewareHow can I get the type of the context of `adminProcedure` from `export const adminProcedure = public[How To] Properly use trpc UseQuery based on currently selected itemI have a component with a video element and a flatlist. I want to utilize a trpc query to get the viData from useQuery is inferred as data: {} | undefinedMy server query returns data from database via ElectroDB. TypeScript can statically infer all properCannot access 't' before initializationHi, I'm migrating my app to a mono repo but I just can't get past this error for some reason `CannottRPC Middleware consuming memory limit on VercelHi all, I'm running into a weird error where my tRPC middleware to enforce that a user is authed, isUsing react-query parameters in tRPC for useQueryHello, the useQuery from react-query can take parameters such cacheTime, staleTime, refetchOnWindowFtRPC type error on turborepo```Types of property 'query' are incompatible. Type 'inferHandlerFn<{}>' is not assignable to tyStack for expo?Can someone recommend a stack for an expo project? I'm considering trpc + fastify + fly.io, but hav