T
TanStack•3y ago
xenial-black

global onError handling

With v4, we had this global handling of an inactive session. Basically when a refresh token expired, we would use this: 
const queryClient = useQueryClient();

  useEffect(() => {
    queryClient.setDefaultOptions({
      queries: {
        ...queryClient.getDefaultOptions().queries,
        onError: async (error) => {
          if (isTokenError(error)) {
            queryClient.cancelQueries();

            await modal.open(<ModalInactive />, {
              canClose: false,
              hasBlurredBackground: true,
            });
          }
        },
        retry(failureCount, error) {
          if (isTokenError(error)) {
            return false;
          }

          return (failureCount || 0) < 1;
        },
      },
    });
  }, [i18n, modal, queryClient]);
const queryClient = useQueryClient();

  useEffect(() => {
    queryClient.setDefaultOptions({
      queries: {
        ...queryClient.getDefaultOptions().queries,
        onError: async (error) => {
          if (isTokenError(error)) {
            queryClient.cancelQueries();

            await modal.open(<ModalInactive />, {
              canClose: false,
              hasBlurredBackground: true,
            });
          }
        },
        retry(failureCount, error) {
          if (isTokenError(error)) {
            return false;
          }

          return (failureCount || 0) < 1;
        },
      },
    });
  }, [i18n, modal, queryClient]);
I could do the same thing in v5 with QueryCache, but that needs to be set in the initating of queryClient, meaning I can't use the queryClient context inside the modal. What would be the best way to implement this?
2 Replies
deep-jade
deep-jade•2y ago
@r Were you able to find a solution for this? I'm facing a similar situation.
passive-yellow
passive-yellow•2y ago
https://tkdodo.eu/blog/breaking-react-querys-api-on-purpose Maybe you'll find some ideas here. Including the comments section
Breaking React Query's API on purpose
Why good API design matters, even if it means breaking existing APIs in the face of resistance.

Did you find this page helpful?