I have a doubt about handling API call errors using Axios. This is working for me but it seems I am using too much logic inside the Catch error Callback.
const onSubmit = async (data) => {
await axios
.post("http://localhost:3001/auth/verify-email", data, {
headers: {
"Content-Type": "application/json",
},
})
.then((res) =>
navigate("/", {
state: {
response: res.data.result,
verified: true,
message: "You have succesfully registered",
},
})
)
.catch((error) => {
if (error.response.data.errors[0].code === "InvalidToken") {
axios.get(`http://localhost:5001/auth/verify-email/${data.email}`);
alert("Check your email for the new Verification Code");
navigate("/authentication", {
state: { email: data.email },
});
}
});
};
In this case if one sort of error happens, then it calls an API to reset the token. It works fine but maybe it can be refactored.
Check axios doc on errors
If you want to extract the error code in a "cleaner" way, you can treat it this way : error.toJSON()
This way your logic to catch the error will be less "messy"