Is there any information about caching in `@trpc/react-query`?
How does query caching work? I want to create library for Angular and I would like to understand React version first.
cache craziness?
can someone sanity check something for me? i'm using sst + trpc + drizzleorm + aws + rds + postgres on the server, and i guess trpc + tanstack-query on the client side... when i do mutations, to say delete something from a list and go optimistically update the client state, via useUtils setData etc... everything is fine... then a few seconds later the browser does a request (tanstack query?) and gets OLD data back from "disk cache" and updates the view to how it was before my mutation! then a...
tRPC over WebSocket with Next.js and NextAuth
Hi. I'm trying to set up Next 13 with tRPC over a WebSocket and NextAuth. I got it mostly working with:
```typescript
// route.ts
import { fetchRequestHandler } from '@trpc/server/adapters/fetch';
import { createContext } from '@/server/context';...
Solution:
My guess is that next-auth tries to use
but when you are not using Next, in the case of your ws server that import does nothing. You might want to take a look at examples-next-prisma-websocket-starter, if you are looking for a method to implement tRPC + Next + Next Auth + Websockets....
import { headers } from 'next/headers';
import { headers } from 'next/headers';
Project structure ?
I greatly appreciate for your insight on this, especially if you're an experienced fullstack dev:
Background:
I'm a junior dev (just a little over 1 yoe), started my job doing everything frontend related for multiple projects (since the "fullstack" devs in team prefer backend/infra/devops work, so naturally I'm the one to handle the frontend), and now, at this point of my career, I'm gradually assigned to the role of a fullstack dev.
The team's dynamic is pretty weird at this point, since all of my (should be) mentors/senior have all left because various reasons, so fwiw, I'm the only one who knows JS/TS for the upcoming project which means I'll be in full responsible for everything in its dev scope. ...
Access procedures with same names and same parameters, but in different routers, generically
My trpc structure looks something like this:
```
trpc
- router1...
Disable trpc route cahce?
```ts
import { protectedProcedure, router } from "@/lib/trpc/server/trpc";
import { TRPCError } from "@trpc/server";
export const clientRouter = router({...
How do you set headers or cookies in procedure ?
Having trouble figuring out how to set headers within a procedure in Next 13.
Why use unstable_httpBatchStreamLink in React server components?
When using create-t3-app I noticed that they were using
unstable_httpBatchStreamLink in their TRPCProxyClient when using RSC. I find this strange, since you already have access to the actual appRouter, doing an HTTP request to your own server adds a lot of overhead. Why use TRPCProxyClient with unstable_httpBatchStreamLink and why not just use createCaller?
I understand why it's done when rendering 'use client' components on the server, because you don't want server code bundled into the client code. But I fail to understand why they opted to also use this method when rendering server components....Unsafe return of an `any` typed
I am using TRPC with Prisma. I can't seem to get rid of the TypeScript ESlint error.
```
import { z } from "zod";
...
Vanilla Client Authentication
How to authenticate using the vanilla client? I want to consume this route as the authenticated user, but I couldn't find how to do this. Everything's working fine but this. Couldn't find anything on the docs
```
export const edgeClient = createTRPCProxyClient<AppRouter>({
links: [...
Generic Zod as Input Type
I'm not positive if this is a TRPC question, typescript in general, or failure to understand Zod in this usecase. Our API has a several endpoints that all work the same way just pass in different payloads. I'm trying to create a single function to assign to all my TRPC routes:
```
enum Endpoint {
"Person" = "/users/person",...
Incompatible Router Types
I am working on a trpc implementation for sveltekit.
I attached a screenshot of the createContext function, the fetchRequestHandlers, and the client. Everything works but I am getting a typescript error that is breaking auto-complete. I will comment the error below....
nextjs app router, "fs", "os", "zlib-sync" and trpc experimental edge Router
Environement: Turborepo + pnpm
What's wrong: when I tried to build nextjs, the error is like this warp block https://app.warp.dev/block/h9b0V2covbaCMv8boeSpvc
What I have: a package with discord.js and includes "fs" module, and imported via trpc/[trpc/route.ts in nextjs. ...
TS4111: Property 'error' comes from an index signature, so it must be accessed with ['error'].
I am trying to use trpc with AnalogJs, an Angular meta framework and Nx.
We use the @nx/vite builder to build our application.
While development works perfectly, I am running into the following errors when building the application:
```...
TypeError: Cannot read properties of null (reading '_def')
As the title says, I get the following:
TypeError: Cannot read properties of null (reading '_def')
at isRouter (/app/node_modules/@trpc/server/dist/config-3ab6b85e.js:52:42)
at recursiveGetPaths (/app/node_modules/@trpc/server/dist/config-3ab6b85e.js:84:21)...
I wanna add a localStorage persister, but I'm getting errors for hydration:
I wanna add a localStorage persister, but I'm getting errors for hydration:
```js
const persister = createSyncStoragePersister({
storage: window.localStorage,...
error route always getting 500 from trpc error? (next13/approuter)
I've got this condition for throwing in my trpc procedure: ```ts
if (!userClerkProfile) {
console.log("throwing"); // -> this is logging
throw new TRPCError({
code: "NOT_FOUND",...
force-cache planetscale error
trying to use the trpc API from RSCs fails and gives the following error
```log
result: {
data: {
secret: null,...
What is the pattern for unsubscribing from a subscription?
Hi there! I'd like to prevent unnecessary connections to a websocket server across multiple renders. What is the correct pattern to ensure this?
```ts
api.live.onNewIncident.useSubscription(undefined, {
onData: () => {...