T
tRPC

❓-help

Trpc calls being uncessarily made

KKay12/14/2023
Hi friends, i am relevatively new to TRPC so this could be somethign super basic. I have a component that is making a bunch of useQuery statements
export default function RegistryItem(props: IRegistryItemProps) {
const { data: session } = useSession();
const updateTeamRegistryById = TrpcClient.updateTeamRegistryById.useMutation({
onSettled: () => {
teamItems.refetch();
registryData.refetch();
},
});
console.log("item", props.item, "teamITem", props.teamItem);
const userId = session?.user?.id;
const teamId = session?.user.teamId;
const registryData = TrpcClient.getRegistryById.useQuery({ id: props.item.id });
const registry = registryData.data;
const teamItems = TrpcClient.getTeamRegistry.useQuery({ registryId: props.item.id, teamId: teamId as string });
const teamItem = teamItems.data;
const count = registry?.team_registry.filter((f) => f.enabled === true)?.length || 0;
...
export default function RegistryItem(props: IRegistryItemProps) {
const { data: session } = useSession();
const updateTeamRegistryById = TrpcClient.updateTeamRegistryById.useMutation({
onSettled: () => {
teamItems.refetch();
registryData.refetch();
},
});
console.log("item", props.item, "teamITem", props.teamItem);
const userId = session?.user?.id;
const teamId = session?.user.teamId;
const registryData = TrpcClient.getRegistryById.useQuery({ id: props.item.id });
const registry = registryData.data;
const teamItems = TrpcClient.getTeamRegistry.useQuery({ registryId: props.item.id, teamId: teamId as string });
const teamItem = teamItems.data;
const count = registry?.team_registry.filter((f) => f.enabled === true)?.length || 0;
...
Everytime i click on an empty space in the window, it refetches, happens also when switching tabs. This is causing a lot of unnecessary request. Why is this occuring?
KKay12/14/2023
So i think this might havebeen because of "refetchOnWindowFocus" i wonde what other quirks like this exists im still experiecin a refetch whenever i swap tabs and tab back in
Nnlucas12/14/2023
React query does a lot of smart fetching like you say, recommend you check their docs The clicking and refetching may be because you’re inadvertently causing some component to remount, but playing with the cache/stale times might alleviate this, you can set them high like 30 seconds

Looking for more? Join the community!

Recommended Posts
Get Name of All Query Routes or Mutation RoutesTypescript is pretty unhappy with my methods of doing this manually, so wondering if there are any oLosing Types in VSCodeI'm encountering a curious issue with type inference in my project and wondering if anyone else has useUtils vs useQueryClientI'm trying to use the `useUtils` hook but I'm unsure if I'm doing it correctly? It doesn't seem to wErrors serializationAre the errors now using the transformer serialize? or the errors simply go through errorsTransformeBuild error with trpc-panelHi. I'm having a trouble building my tRPC api with trpc-panel. I'm using yarn workspaces and tryingTransferring huge bufferI'm using tRPC with superjson serializer in an Electron app. I have a router querry that loads an pnReport progress of mutationI'm using tRPC in a electron app and am running a nodeWorker from main thread. Is there a way to repDiscriminated output based on discrimiated inputI have this function which works correctly by itself, but when i put it on trpc, the output doesn't How to create a React Component that fetch API based on a router from props ?I want to pass in my React component props the name of the router to use, here is my current implemeHow to pass through authentication header when using createTRPCProxyClient and RSC?Hi - we are having a great time with tRPC, and have it working well in a Next14 + React Server CompoIntegrating tRPC with Clerk Authentication in an Existing Next.js "Turborepo" ProjectHello, I am currently working on a Next.js application within a Turborepo setup and am looking to inHelp understanding how to deploy tRPC in monorepo.Hi All, I read in the FAQ that most benefits come from using tRPC in a monorepo. So if i want to buibest way to delete trpc?I want to delete TRPC from a Nextjs project. What is the most appropiate way to take it out? ThanksQuery string paramsHi , new to tRPC, is there a way to send query string params with tRPC when making a request ?