Updating query data without access to complete query key

Assume the following scenario:
I have two screens:
Screen1: queries server for restaurants and displays them in a list( favorited restaurants have a heart icon displayed in the ui)
Screen2: displays a single restaurant where the user can toggle the favorite state

The query for the restaurants query looks like the following:

   const { isLoading, error, data } = useQuery(['restaurants', longitude, latitude], () =>
        // Fetching logic
     )
   )

   const { isLoading, error, data } = useQuery(['restaurants', longitude, latitude], () =>
        // Fetching logic
     )
   )

   const { isLoading, error, data } = useQuery(['restaurants', longitude, latitude], () =>
        // Fetching logic
     )
   )

   const { isLoading, error, data } = useQuery(['restaurants', longitude, latitude], () =>
        // Fetching logic
     )
   )

In the query, I add the

longitude

longitude

longitude

longitude and

latitude

latitude

latitude

latitude in the query key, sincy in my application these can change and I want to make sure the restaurants list is updated according to it.

My issue is that when a user favorites/unfavorites and I want to mutate the restaurant to reflect this change, but I do not have access to the

longitude

longitude

longitude

longitude and

latitude

latitude

latitude

latitude values because they are defined in Screen1.

Is there a way to update the restaurants without access to the complete list of query key? I know the query key starts with 'restaurants'.

Updating query data without access to complete query key

Similar Threads

Similar Threads

Similar Threads