❓-help

Query keys

Zzeph1665

10/28/2022

Hi! I'm super new to TRPC and based on my understanding, TRPC has a thin wrapper around react query. So, I'm wondering how to include the query keys when using trpc. Thank you!

export const itineraryRouter = router({
  list: publicProcedure
    .input(
      z.object({
        userId: z.string().uuid(),
      })
    )
    .query(async ({ input }) => {
      const itineraries = await prisma.itinerary.findMany({
        where: {
          userId: input.userId,
        },
      })
      return itineraries
    })
})

// how I use it in my component
const { data, isLoading } = trpc.itinerary.list.useQuery(
      {
        userId: user?.id as string,
      },
   
    {
      enabled: !!user,
    }
  )

export const itineraryRouter = router({
  list: publicProcedure
    .input(
      z.object({
        userId: z.string().uuid(),
      })
    )
    .query(async ({ input }) => {
      const itineraries = await prisma.itinerary.findMany({
        where: {
          userId: input.userId,
        },
      })
      return itineraries
    })
})

// how I use it in my component
const { data, isLoading } = trpc.itinerary.list.useQuery(
      {
        userId: user?.id as string,
      },
   
    {
      enabled: !!user,
    }
  )

AKAlex / KATT 🐱

10/28/2022

we do the query keys for you the above becomes

[['itinerary', 'list'], { where: { userId: x } }]

[['itinerary', 'list'], { where: { userId: x } }]

UUUnknown User

10/28/2022

2 Messages Not Public

Eeyalll

10/28/2022

is not necessary, just add the params. The queryKey is made for you.

UUUnknown User

10/28/2022

Message Not Public

Zzeph1665

10/29/2022

Thank you! Just to clarify, if i wanted to invalidate the queries, I would do this?

queryClient.invalidateQueries(['itinerary', 'list', {where: {userId: x}}
])

queryClient.invalidateQueries(['itinerary', 'list', {where: {userId: x}}
])

AKAlex / KATT 🐱

10/30/2022

https://trpc.io/docs/v10/useContext#query-invalidation

Zzeph1665

10/30/2022

Oh.. totally missed this part of the docs! Thanks so much!

Looking for more? Join the community!

❓-help

❓-help

Recommended Posts

Possible to use tRPC proxy client inside Edge Runtime?Hi, im trying to fetch a route from trpc inside a Vercel Edge Runtime function. Therefore im tryin v10 migration using codemodSo I've been looking at the codemod that helps with transition towards v10 and I haven't been able t SSR and loading indicators - I don't get itGuess I'm missing something here, but unfortunately I'm having a hard time with the docs: in https:/Prefetch forEachHello, I'm trying to prefetch a list of procedures like this ```ts type QueryKeys = { // how to t NextJs middleware broken by tRPCHi, I have a NextJs middleware that is redirecting to the login page. Basically an Auth guard over m Cannot read properties of undefined (reading 'query')Hey folks, Updating from v9 to v10. I thought I'm done, no type errors. Launching the app in dev mod Updating from v9 to v10 - how to access react hooks?Hey folks, I'm updating to v10. I replaced @trpc/react@9.27.4 with @trpc/react-query@10.0.0-proxy-be How to infer the output of a mutation? The current methods appear to be depreciated.I am attempting to export the bellow utility function to use client side to infer an output type tha Trouble inferring the type of a very simple structure of nested routersA very simple router results in an inference error, causing the client to not be able to infer the r calling trpc endpoints from vanilla nextJs api routesI'm struggling to find what's the best way to call a trpc endpoint directly from the server. Basical Mutation type issueI'm trying to mutate something like this with tRPC and Prisma ```const updateColumn = trpc.project.u Can I redirect the user from inside my router?I have a query protectedProcedure, which returns an object from my prisma planetscale db What's the CORS in standalone serverHi, I'm trying to get CORS working in standalone server. Attempted this solution but unfortunately Queries break when in production on Vercel; work on localhostThe query is called like this: ```javascript const { data } = api.useQuery(["user.!getCount"], { Can't get client to workHi, I can't get my client to work I'm using Next.js but I have also tried the React method from the Request context inside middleware?Hi, Is it possible to get the request context inside a middleware somehow? I'm trying to migrate data becomes never[] when destructuring with a fallback valueCurrently it doesn't seem possible to set a fallback value on a destructured `data` property, for ex SyntaxError Unexpected token u in JSON at position 0 with mutationsI'm trying to use trpc client to await a mutation and just keep getting this error. everything works Losing the type between the client and serverHello everyone, I am new to tRPC and the magic of types in typescript so I am looking for ideas as t Mobile app with tRPCWhat's the suggested way of working with tRPC when it comes to mobile apps? How do you ensure that y