Uncaught (in promise) {email: "email already exists"} - reactjs

Question

So i am trying to implement asyncValidation in my redux-form (v7.3.0) input field. The check_email function on the backend returns true if the email already exists and i am using fetch api to call the backend. The api call is successful and returns true or false depending on the email entered but the instead of showing message in form with the input field the there is uncaught error in the console.
The asyncValidate.js file
import { BASE_URL } from "../../config/apiConfig";
const asyncValidate = (values, dispatch, props) => {
let opts = {
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'client': localStorage.getItem('client'),
'uid': localStorage.getItem('uid'),
'access-token': localStorage.getItem('access-token')
}
};
return fetch(`${BASE_URL}admin/users/check_email?email=${values.email}`, opts)
.then((res) => {
if(!res.ok){
throw { email: "Something went wrong. Please Type Email again!" }
}
else{
res.json().then((jsonRes) => {
if (jsonRes) {
throw { email: "Email already taken!" };
}
});
}
})
.catch(error => {
throw error
});
};
export default asyncValidate;
As given on the docs the demo validation works and the error message is shown with the input field when the validation fails but the above given validation throws uncaught error in the console.

Answer 1

The problem was with the then method within the else block. The throw statement was inside 2 promises and the redux-form expected it be inside a single promise. So i change it to async/await syntax.
The final code looks like this.
import { BASE_URL } from "../../config/apiConfig";
const asyncValidate = (values, dispatch, props) => {
let opts = {
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'client': localStorage.getItem('client'),
'uid': localStorage.getItem('uid'),
'access-token': localStorage.getItem('access-token')
}
};
return fetch(`${BASE_URL}admin/users/check_email?email=${values.email}`, opts)
.then(async (res) => {
if(!res.ok){
throw { email: "Something went wrong. Please Type Email again!" }
}
else{
const jsonRes = await res.json();
if(jsonRes) {
throw { email: "Email already taken!" };
}
}
});
};
export default asyncValidate;