React Query: isLoading does not update on Axios error

[hisk]

I am using a React Query mutation to make a server side request, however, the isLoading property does not change when there is an axios error (500 server side error) and the isError property also stays false. For reference, I have the following setup.

Base HTTP client class:

export class HttpClient {
  static async post(url, data, options) {
    const response = await Axios.post(url, data, options);

    return response.data;
  }
}

Mutation:

export const useRegisterMutation = () => {
  const queryClient = useQueryClient();
  return useMutation((vars) => {
    return HttpClient.post(API_ENDPOINTS.REGISTER, vars);
  }, {
    onSuccess: () => {
      toast.success('Your account was successfully created!');
    },
    // Always refetch after error or success:
    onSettled: () => {
      queryClient.invalidateQueries(API_ENDPOINTS.REGISTER);
    },
    onError: (error) => {
      toast.error('There was a problem while creating your account. Please try again later!')
    }
  });
};

Usage:

const { mutate: registerUser, isLoading, isError } = useRegisterMutation();
async function onSubmit({ email, password }) {
    registerUser(
      {
        email,
        password,
      },
      {
        onSuccess: (data) => {
          // set login creds
        },
        onError: (error) => {
          // set form errors
        },
      }
    )
  }

Problem

With this setup, isLoading stays true and isError remains false even if Axios throws an error due to a server side 500 error.

Tried

I:

• Updated the library version.
• Checked whether the code is executed in the right place.
• Lost all hope.

Thank you so much for your assistance! 🙏

[hisk]

I would really appreciate if you could assist. Thank you so much for your time! 🙏

CC: @tannerlinsley @TkDodo @zorzysty @cherniavskii @DamianOsipiuk @arnaudbzn @Newbie012

[TkDodo]

Showing a codesanbox reproduction of your issue would likely get you further than tagging all maintainers...

[hisk]

I was unable to reproduce this in CodeSandbox. I also tried to recreate it from scratch in a new project, but was unable, which makes me believe that the issue is probably caused by the older setup. Thank you for your patience, I apologize for the wasting your time and for tagging all maintainers.

[hisk]

We can close this.