Hey friends, long time listener, first time caller I have encountered a quite confusing quirk that I'm not sure how to start reasoning about...
I have been running a trpc client call (all my trpc packages are currently v10.45.2) in a nextjs 14 (w/ app router) application. So the follow code has been working when the
selectedSession
selectedSession
updates in the context
export default function SessionExplorer({ id }: { id?: string }) { const { selectedSession } = useContext(SessionContext); if (!selectedSession) { return <EmptyState />; } const { data: m } = trpc.messages.getMessagesWithEntities.useQuery( { sessionId: selectedSession.id, }, { refetchOnMount: false, }, ); // doing some stuff with `m` ...}
export default function SessionExplorer({ id }: { id?: string }) { const { selectedSession } = useContext(SessionContext); if (!selectedSession) { return <EmptyState />; } const { data: m } = trpc.messages.getMessagesWithEntities.useQuery( { sessionId: selectedSession.id, }, { refetchOnMount: false, }, ); // doing some stuff with `m` ...}
oddly, it seems like it's now just jumping over my
useQuery
useQuery
call and returns
undefined
undefined
. I would expect this call to hit my server code, but I don't see any queries in my server logs. It doesn't seem to even be hitting my server code (though my server calls using trpc continue to work ). I tried to set breakpoints around the client side code, but all I see when I try to step into trpc or
useQuery
useQuery
, it doesn't show much and console logging
trpc
trpc
leads to
Proxy(Function) {length: 0, name: 'noop'}
Proxy(Function) {length: 0, name: 'noop'}
.
Given that server trpc calls appear to be working just fine, my thought was perhaps some misconfiguration with my client trpc code, though it's fairly vanilla:
import { createTRPCReact } from "@trpc/react-query";import { type AppRouter } from "@/lib/server/routers/_app";export const trpc = createTRPCReact<AppRouter>({});
import { createTRPCReact } from "@trpc/react-query";import { type AppRouter } from "@/lib/server/routers/_app";export const trpc = createTRPCReact<AppRouter>({});
Though I didn't explicitly change much in my trpc configuration, I did blow away my node_modules and reinstall, so I wonder whether that has contributed to these issues arising today.
Anyone have any suggestions for things that I could try to get further visibility into the issue?