v10 to v11 - resolveHTTPRequest replacement resolveRequest doesn't exist
resolveRequest doesn't seem to exist
original code in v10:-
import { resolveHTTPResponse } from "@trpc/server/http";
const result = await resolveHTTPResponse({...
Next-auth session error
I have already setup tRPC v11.0.0-rc.666 with next auth v5.0.0-beta.25 but when i use the
await auth() in tRPC context got error Error [TRPCClientError]: headers was called outside a request scope.
```typescript
import { PrismaClient } from "@prisma/client";...How can i check if an error is a TRPC Error in the browser?
error.message // NOT_FOUND (throwing this intentionally - i'd like to build a react error boundary that has specific handling for TRPC Errors like NOT_FOUND)
Object.getPrototypeOf(error) // default "Error" object/class
error instanceof TRPCClientError // false. this would have been my best bet.
error.message // NOT_FOUND (throwing this intentionally - i'd like to build a react error boundary that has specific handling for TRPC Errors like NOT_FOUND)
Object.getPrototypeOf(error) // default "Error" object/class
error instanceof TRPCClientError // false. this would have been my best bet.
Has anyone got Tanstack Start with tRPC working?
I have used the example project in /examples on tRPC Github. Unfortunately when I try to fetch the posts I receive the following error:
Error in renderToPipeableStream: TRPCClientError: Invalid response or stream interrupted
Replacing unstable_httpBatchStreamLink with httpBatchLink did not help....
issue with compiling/building websocket server
how to compile/build a separate websocket server , facing above issues , even tried to use some code from this https://github.com/trpc/examples-next-prisma-websockets-starter/blob/main/tsconfig.server.json
but it compiles the entire src code which is not needed ig
my tsconfig.json
```{...
trpc useError hook?
Hey, I have a hook which i use for fetching some data using trpc and I'm wondering if there is some sort of
useError so i can catch all of the errors for each query, in one variable?
or is the best way using the error property on each of the useQuery invocations?
Currently, if I want to display an error I'd have to make 3 separate variables and parse each of those in the if statement if error at the bottom.
```ts...What is the substitution for queryKey in useQuery?
In vanilla @tanstack/react-query, queryKey works as dependencies referrence so the query refetches automatically as it changes. Just like useEffect's dependency array.
It's not present in tRPC flavoured useQuery, looks like it is handled automatically.
So what to do instead? How to attach such dependencies to query?...
How can we get the query key on the server?
I have prefetched a query on the server, but I also want to use the value on the server
When I log the cache, I can see the result of the prefetch is there, I just can't find the key to access it by
The
getQueryKey function doesn't seem to work with the server API provided by createHydrationHelpers...How to make prefetching/RSC suspense work with auth?
Hi 👋
I'm using the rsc-rq-prefetch pattern in my project. It worked quite well - up until I added auth to my tRPC procedures.
During SSR a server error gets thrown because the useSuspenseQuery request fails (there's no auth because SSR does not use the request's context/headers https://github.com/vercel/next.js/discussions/60640)....
Route not found when using Fastify adapter
I'm currently running into the following error when attempting to issue a request to my server which is leveraging Fastify:
```
[19:04:02.888] INFO (57024): Route POST:/associateSocialMediaAccount not found
reqId: "req-1"
[19:04:02.892] INFO (57024): request completed...
Solution:
The client side
url was missing the /trpc prefix set in the server.Modifying input in a middleware
Is it possible to modify input somewhere so that I can do something like this
```ts
const signIn = deskOrAdminProcedure
.input(
z.object({...
Solution:
How do *you* structure the tRPC router when dealing with isolated components?
Hi 👋
I'm wondering how other people handle their tRPC router for cases where a component deep in the Next.js file tree (e.g.
/[locale]/(dashboard)/categories/posts/comments/list-component/my-procedure.ts ) has a procedure.
Everything inside the folder /[locale]/(dashboard)/categories/posts/comments/list-component is a single react component (tree). I.e. I don't share this component anywhere else. But it still has a query procedure to fetch the data we need for it. ...Can we bundle WS TRPC Server?
I'm trying to bundle just the file using esbuild, I just want to make a docker image that weights less through build and using an alpine image.
The problem is that the output image of just installing and using ts-node fileserver is quite big....
Solution:
Nevermind, this is an stupid question, of course you can
How to handle consistency for client-side only APIs?
Hi, we are using tRPC as a BFF (Backend for Frontend) which act as a proxy between ou UI and our dozen of backend services.
What's the recommended approach to handle direct client-side API calls when they cannot be implemented with tRPC due to legacy limitations?
Should we use React Query directly, or is there a way to extend tRPC's router in the client-side to maintain consistent API handling?
PS: For better understanding, we'd like to add client-side procedures because we need to calls APIs that can only be called in a browser...
Solution:
```ts
export function buildTrpcClientFromRouter<AppRouter extends AnyRouter>(router: AppRouter) {
function mockLink<TRouter extends AnyRouter>(): TRPCLink<TRouter> {
return () => {...
Does server side helper's fetch also fill the cache like prefetch?
It wasn't clear in the docs (https://trpc.io/docs/client/nextjs/server-side-helpers#helpers-usage) , but does
fetch also add the query to the cache, which I then dehydrate and send to the client?
I need to access data both server side and client side...SSR with NextJs app directory
Hey all, wondering if anyone has gotten SSR to work with TRPC/nextjs app directory. I'm using the trpcreactprovider.
Cannot read __untypedClient from undefined error when try to update to latest 11.rc### versions
We are using TRPC with react and we got everything running with the latest versions from tanstack/react-query, but every time I try to update our trpc packages:
"@trpc/client": "11.0.0-rc.660",
"@trpc/react-query": "11.0.0-rc.660",
"@trpc/server": "11.0.0-rc.660",
To their latest builds we get an uncaught exception on the trpc.Provider component that it cannot read __untypedClient from undefined. I have tried to Google and check GitHub issues if someone faced the same or not, but to no avail. Is there someone out there who could point me some things to fix, check or otherwise to get me unstuck from the 660 builds?...