fix: improved error handling with fetch

This commit is contained in:
bsourisse 2023-03-14 00:17:48 +01:00
parent 351337f654
commit 19082b3263
7 changed files with 245 additions and 147 deletions

View file

@ -49,7 +49,11 @@ export default function AppriseAlertSettings() {
setChecked((await response.json()).appriseAlert);
setCheckIsLoading(false);
} catch (error) {
console.log('Fetching Apprise alert setting failed.');
setError(
'Fetching apprise alert setting failed. Contact your administrator.'
);
console.log('Fetching apprise alert setting failed.');
setCheckIsLoading(false);
}
};
getAppriseAlert();
@ -62,30 +66,45 @@ export default function AppriseAlertSettings() {
setError();
//Disabled button
setDisabled(true);
const response = await fetch('/api/account/updateAppriseAlert', {
await fetch('/api/account/updateAppriseAlert', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
setError(result.message);
setTimeout(() => {
setError();
setDisabled(false);
}, 4000);
} else {
if (data.appriseAlert) {
setChecked(!checked);
toast.success('Apprise notifications enabled.', toastOptions);
} else {
setChecked(!checked);
toast.success('Apprise notifications disabled.', toastOptions);
}
}
})
.then((response) => {
console.log(response);
if (response.ok) {
if (data.appriseAlert) {
setChecked(!checked);
toast.success(
'Apprise notifications enabled.',
toastOptions
);
} else {
setChecked(!checked);
toast.success(
'Apprise notifications disabled.',
toastOptions
);
}
} else {
setError('Update apprise alert setting failed.');
setTimeout(() => {
setError();
setDisabled(false);
}, 4000);
}
})
.catch((error) => {
console.log(error);
setError('Update Apprise failed. Contact your administrator.');
setTimeout(() => {
setError();
setDisabled(false);
}, 4000);
});
};
//Send Apprise test notification to services
@ -94,23 +113,31 @@ export default function AppriseAlertSettings() {
setTestIsLoading(true);
//Remove old error
setError();
const response = await fetch('/api/account/sendTestApprise', {
method: 'POST',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify({ sendTestApprise: true }),
});
const result = await response.json();
if (!response.ok) {
try {
const response = await fetch('/api/account/sendTestApprise', {
method: 'POST',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify({ sendTestApprise: true }),
});
const result = await response.json();
if (!response.ok) {
setTestIsLoading(false);
setError(result.message);
} else {
setTestIsLoading(false);
setInfo(true);
setTimeout(() => {
setInfo(false);
}, 4000);
}
} catch (error) {
setTestIsLoading(false);
setError(result.message);
} else {
setTestIsLoading(false);
setInfo(true);
console.log(error);
setError('Send notification failed. Contact your administrator.');
setTimeout(() => {
setInfo(false);
setError();
}, 4000);
}
};

View file

@ -58,23 +58,31 @@ export default function AppriseMode() {
//Loading button on submit to avoid multiple send.
setFormIsLoading(true);
//POST API to update Apprise Mode
const response = await fetch('/api/account/updateAppriseMode', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
try {
const response = await fetch('/api/account/updateAppriseMode', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
if (!response.ok) {
setFormIsLoading(false);
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
setFormIsLoading(false);
setModeFormIsSaved(true);
setTimeout(() => setModeFormIsSaved(false), 3000);
}
} catch (error) {
setFormIsLoading(false);
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
setFormIsLoading(false);
setModeFormIsSaved(true);
setTimeout(() => setModeFormIsSaved(false), 3000);
setError('Change mode failed. Contact your administrator.');
setTimeout(() => {
setError();
}, 4000);
}
};

View file

@ -61,23 +61,33 @@ export default function AppriseURLs() {
//Loading button on submit to avoid multiple send.
setFormIsLoading(true);
//POST API to update Apprise Services
const response = await fetch('/api/account/updateAppriseServices', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
try {
const response = await fetch('/api/account/updateAppriseServices', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
if (!response.ok) {
setFormIsLoading(false);
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
setFormIsLoading(false);
setUrlsFormIsSaved(true);
setTimeout(() => setUrlsFormIsSaved(false), 3000);
}
} catch (error) {
setFormIsLoading(false);
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
setFormIsLoading(false);
setUrlsFormIsSaved(true);
setTimeout(() => setUrlsFormIsSaved(false), 3000);
setError(
'Failed to update your services. Contact your administrator.'
);
setTimeout(() => {
setError();
}, 4000);
}
};

View file

@ -46,64 +46,96 @@ export default function EmailAlertSettings() {
setChecked((await response.json()).emailAlert);
setIsLoading(false);
} catch (error) {
setError(
'Fetching email alert setting failed. Contact your administrator.'
);
console.log('Fetching email alert setting failed.');
setIsLoading(false);
}
};
dataFetch();
}, []);
////Functions
//Switch to enable/disable Email notifications
const onChangeSwitchHandler = async (data) => {
//Remove old error
setError();
//Disabled button
setDisabled(true);
const response = await fetch('/api/account/updateEmailAlert', {
await fetch('/api/account/updateEmailAlert', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
setError(result.message);
setTimeout(() => {
setError();
setDisabled(false);
}, 4000);
} else {
if (data.emailAlert) {
setChecked(!checked);
toast.success('Email notification enabled !', toastOptions);
} else {
setChecked(!checked);
toast.success('Email notification disabled !', toastOptions);
}
}
})
.then((response) => {
console.log(response);
if (response.ok) {
if (data.emailAlert) {
setChecked(!checked);
toast.success(
'Email notification enabled !',
toastOptions
);
} else {
setChecked(!checked);
toast.success(
'Email notification disabled !',
toastOptions
);
}
} else {
setError('Update email alert setting failed.');
setTimeout(() => {
setError();
setDisabled(false);
}, 4000);
}
})
.catch((error) => {
console.log(error);
setError('Update failed. Contact your administrator.');
setTimeout(() => {
setError();
setDisabled(false);
}, 4000);
});
};
//Send a test notification by email
const onSendTestMailHandler = async () => {
//Loading
setTestIsLoading(true);
//Remove old error
setError();
const response = await fetch('/api/account/sendTestEmail', {
await fetch('/api/account/sendTestEmail', {
method: 'POST',
});
const result = await response.json();
if (!response.ok) {
setTestIsLoading(false);
setError(result.message);
} else {
setTestIsLoading(false);
setInfo(true);
setTimeout(() => {
setInfo(false);
}, 4000);
}
})
.then((response) => {
if (!response.ok) {
setTestIsLoading(false);
setError('Failed to send the notification.');
setTimeout(() => {
setError();
}, 4000);
} else {
setTestIsLoading(false);
setInfo(true);
setTimeout(() => {
setInfo(false);
}, 4000);
}
})
.catch((error) => {
setTestIsLoading(false);
console.log(error);
setError('Send email failed. Contact your administrator.');
setTimeout(() => {
setError();
}, 4000);
});
};
return (

View file

@ -41,26 +41,33 @@ export default function EmailSettings(props) {
setError();
//Loading button on submit to avoid multiple send.
setIsLoading(true);
//POST API to send the new and old password
const response = await fetch('/api/account/updateEmail', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
//POST API to send the new mail address
try {
const response = await fetch('/api/account/updateEmail', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
setIsLoading(false);
if (!response.ok) {
setIsLoading(false);
reset();
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
reset();
setIsLoading(false);
setInfo(true);
toast.success('Email edited !', toastOptions);
}
} catch (error) {
reset();
setError(result.message);
setIsLoading(false);
setError("Can't update your email. Contact your administrator.");
setTimeout(() => setError(), 4000);
} else {
reset();
setIsLoading(false);
setInfo(true);
toast.success('Email edited !', toastOptions);
}
};
return (

View file

@ -42,24 +42,31 @@ export default function PasswordSettings(props) {
//Loading button on submit to avoid multiple send.
setIsLoading(true);
//POST API to send the new and old password
const response = await fetch('/api/account/updatePassword', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
try {
const response = await fetch('/api/account/updatePassword', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
setIsLoading(false);
if (!response.ok) {
setIsLoading(false);
reset();
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
reset();
setIsLoading(false);
toast.success('🔑 Password edited !', toastOptions);
}
} catch (error) {
reset();
setError(result.message);
setIsLoading(false);
setError("Can't update your password. Contact your administrator.");
setTimeout(() => setError(), 4000);
} else {
reset();
setIsLoading(false);
toast.success('🔑 Password edited !', toastOptions);
}
};
return (

View file

@ -41,26 +41,33 @@ export default function UsernameSettings(props) {
setError();
//Loading button on submit to avoid multiple send.
setIsLoading(true);
//POST API to send the new and old password
const response = await fetch('/api/account/updateUsername', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
//POST API to update the username
try {
const response = await fetch('/api/account/updateUsername', {
method: 'PUT',
headers: {
'Content-type': 'application/json',
},
body: JSON.stringify(data),
});
const result = await response.json();
if (!response.ok) {
setIsLoading(false);
if (!response.ok) {
setIsLoading(false);
reset();
setError(result.message);
setTimeout(() => setError(), 4000);
} else {
reset();
setIsLoading(false);
setInfo(true);
toast.success('Username edited !', toastOptions);
}
} catch (error) {
reset();
setError(result.message);
setIsLoading(false);
setError("Can't update your username. Contact your administrator.");
setTimeout(() => setError(), 4000);
} else {
reset();
setIsLoading(false);
setInfo(true);
toast.success('Username edited !', toastOptions);
}
};
return (