Invalidating Queries

Hey! Might be being thick here but I'm implementing in an optimistic update layer and fully expected this to work:

await queryClient.invalidateQueries({ queryKey: scheduleKey });

// I compute the query key in a reusable hook
function useScheduleQueryKey() {
  const api = useTRPC();
  const [weekStart] = useScheduleParams();

  return api.schedule.getWeek.queryKey({ weekStart });
}

await queryClient.invalidateQueries({ queryKey: scheduleKey });

// I compute the query key in a reusable hook
function useScheduleQueryKey() {
  const api = useTRPC();
  const [weekStart] = useScheduleParams();

  return api.schedule.getWeek.queryKey({ weekStart });
}

However that won't work. You can make it work by either removing the input - so

getWeek.queryKey()

getWeek.queryKey()

or by passing the key as the only arg;

queryClient.invalidateQueries(queryKey) // Have a feeling this only works becuase it seems to just invalidate any active query so this is likely a red herring

queryClient.invalidateQueries(queryKey) // Have a feeling this only works becuase it seems to just invalidate any active query so this is likely a red herring

Is there a way I can just invalidate the query based on input or am I thinking about this wrong?

The query key is correct as I can use

setQueryData

setQueryData

on it fine;

    queryClient.setQueryData(scheduleKey, onMutateResult.currentData);

    queryClient.setQueryData(scheduleKey, onMutateResult.currentData);

tRPC•4mo ago•

2 replies

him

Invalidating Queries

Hey! Might be being thick here but I'm implementing in an optimistic update layer and fully expected this to work:

await queryClient.invalidateQueries({ queryKey: scheduleKey });

// I compute the query key in a reusable hook
function useScheduleQueryKey() {
  const api = useTRPC();
  const [weekStart] = useScheduleParams();

  return api.schedule.getWeek.queryKey({ weekStart });
}

await queryClient.invalidateQueries({ queryKey: scheduleKey });

// I compute the query key in a reusable hook
function useScheduleQueryKey() {
  const api = useTRPC();
  const [weekStart] = useScheduleParams();

  return api.schedule.getWeek.queryKey({ weekStart });
}

However that won't work. You can make it work by either removing the input - so

getWeek.queryKey()

getWeek.queryKey()

or by passing the key as the only arg;

queryClient.invalidateQueries(queryKey) // Have a feeling this only works becuase it seems to just invalidate any active query so this is likely a red herring

queryClient.invalidateQueries(queryKey) // Have a feeling this only works becuase it seems to just invalidate any active query so this is likely a red herring

Is there a way I can just invalidate the query based on input or am I thinking about this wrong?

The query key is correct as I can use

setQueryData

setQueryData

on it fine;

    queryClient.setQueryData(scheduleKey, onMutateResult.currentData);

    queryClient.setQueryData(scheduleKey, onMutateResult.currentData);

Invalidating Queries

Similar Threads

Invalidating Queries

Similar Threads

Similar Threads

Similar Threads