diff --git a/resources/js/components/dialogs/SMDialogChangePassword.vue b/resources/js/components/dialogs/SMDialogChangePassword.vue index 2f9c221..6f64835 100644 --- a/resources/js/components/dialogs/SMDialogChangePassword.vue +++ b/resources/js/components/dialogs/SMDialogChangePassword.vue @@ -77,7 +77,13 @@ const handleSubmit = async () => { }); closeDialog(false); } catch (error) { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { dialogLoading.value = false; } @@ -85,7 +91,6 @@ const handleSubmit = async () => { /** * Handle a keyboard event in this component. - * * @param {KeyboardEvent} event The keyboard event. * @returns {boolean} If the event was handled. */ diff --git a/resources/js/helpers/form.ts b/resources/js/helpers/form.ts index 17d6fad..5d74088 100644 --- a/resources/js/helpers/form.ts +++ b/resources/js/helpers/form.ts @@ -14,7 +14,10 @@ type FormObjectMessageFunction = ( icon?: string ) => void; type FormObjectErrorFunction = (message: string) => void; -type FormObjectApiErrorsFunction = (apiErrors: ApiResponse) => void; +type FormObjectApiErrorsFunction = ( + apiErrors: ApiResponse, + callback?: (error: string, status: number) => void +) => void; export interface FormObject { validate: FormObjectValidateFunction; @@ -78,7 +81,10 @@ const defaultFormObject: FormObject = { this.message(message, "error", "alert-circle-outline"); } }, - apiErrors: function (apiResponse: ApiResponse) { + apiErrors: function ( + apiResponse: ApiResponse, + callback?: (error: string, status: number) => void + ) { let foundKeys = false; if ( @@ -100,10 +106,15 @@ const defaultFormObject: FormObject = { } if (foundKeys == false) { - this.error( - apiResponse?.json?.message || - "An unknown server error occurred.\nPlease try again later." - ); + const errorMessage = + (apiResponse?.json?.message as string) || + "An unknown server error occurred.\nPlease try again later."; + + if (callback) { + callback(errorMessage, apiResponse.status); + } else { + this.error(errorMessage); + } } }, controls: {}, diff --git a/resources/js/views/EmailVerify.vue b/resources/js/views/EmailVerify.vue index c363a80..97bfff4 100644 --- a/resources/js/views/EmailVerify.vue +++ b/resources/js/views/EmailVerify.vue @@ -61,6 +61,7 @@ import SMInput from "../components/SMInput.vue"; import { api } from "../helpers/api"; import { Form, FormControl } from "../helpers/form"; import { And, Max, Min, Required } from "../helpers/validate"; +import { useToastStore } from "../store/ToastStore"; // const { executeRecaptcha, recaptchaLoaded } = useReCaptcha(); const formDone = ref(false); @@ -87,7 +88,13 @@ const handleSubmit = async () => { formDone.value = true; } catch (error) { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } diff --git a/resources/js/views/ForgotPassword.vue b/resources/js/views/ForgotPassword.vue index 4867ba2..e83b329 100644 --- a/resources/js/views/ForgotPassword.vue +++ b/resources/js/views/ForgotPassword.vue @@ -56,6 +56,7 @@ import SMInput from "../components/SMInput.vue"; import { api } from "../helpers/api"; import { Form, FormControl } from "../helpers/form"; import { And, Email, Required } from "../helpers/validate"; +import { useToastStore } from "../store/ToastStore"; // const { executeRecaptcha, recaptchaLoaded } = useReCaptcha(); const formDone = ref(false); @@ -85,7 +86,13 @@ const handleSubmit = async () => { if (error.status == 422) { formDone.value = true; } else { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } } finally { form.loading(false); diff --git a/resources/js/views/Login.vue b/resources/js/views/Login.vue index 3635e9d..27a5824 100644 --- a/resources/js/views/Login.vue +++ b/resources/js/views/Login.vue @@ -95,9 +95,15 @@ const handleSubmit = async () => { } else { router.push({ name: "dashboard" }); } - } catch (err) { + } catch (error) { form.controls.password.value = ""; - form.apiErrors(err); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } diff --git a/resources/js/views/Register.vue b/resources/js/views/Register.vue index 280bf9f..8cbe653 100644 --- a/resources/js/views/Register.vue +++ b/resources/js/views/Register.vue @@ -59,6 +59,7 @@ import { Required, } from "../helpers/validate"; import SMFormError from "../components/SMFormError.vue"; +import { useToastStore } from "../store/ToastStore"; let abortController: AbortController | null = null; @@ -116,8 +117,13 @@ const handleSubmit = async () => { userRegistered.value = true; } catch (error) { - console.log(error); - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } diff --git a/resources/js/views/ResendEmailVerify.vue b/resources/js/views/ResendEmailVerify.vue index abcb9db..529e4fe 100644 --- a/resources/js/views/ResendEmailVerify.vue +++ b/resources/js/views/ResendEmailVerify.vue @@ -66,6 +66,7 @@ import SMInput from "../components/SMInput.vue"; import { api } from "../helpers/api"; import { Form, FormControl } from "../helpers/form"; import { And, Email, Required } from "../helpers/validate"; +import { useToastStore } from "../store/ToastStore"; // const { executeRecaptcha, recaptchaLoaded } = useReCaptcha(); const formDone = ref(false); @@ -95,7 +96,13 @@ const handleSubmit = async () => { if (error.status == 422) { formDone.value = true; } else { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } } finally { form.loading(false); diff --git a/resources/js/views/ResetPassword.vue b/resources/js/views/ResetPassword.vue index 61b9064..c499dce 100644 --- a/resources/js/views/ResetPassword.vue +++ b/resources/js/views/ResetPassword.vue @@ -53,6 +53,7 @@ import SMInput from "../components/SMInput.vue"; import { api } from "../helpers/api"; import { Form, FormControl } from "../helpers/form"; import { And, Max, Min, Password, Required } from "../helpers/validate"; +import { useToastStore } from "../store/ToastStore"; // const { executeRecaptcha, recaptchaLoaded } = useReCaptcha(); const formDone = ref(false); @@ -90,7 +91,13 @@ const handleSubmit = async () => { formDone.value = true; } catch (error) { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } diff --git a/resources/js/views/dashboard/ArticleEdit.vue b/resources/js/views/dashboard/ArticleEdit.vue index 49f3449..0b77903 100644 --- a/resources/js/views/dashboard/ArticleEdit.vue +++ b/resources/js/views/dashboard/ArticleEdit.vue @@ -249,7 +249,13 @@ const handleSubmit = async () => { router.push({ name: "dashboard-article-list" }); } } catch (error) { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } }; @@ -325,7 +331,13 @@ const loadOptionsAuthors = async () => { } }) .catch((error) => { - form.apiErrors(error); + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); }); }; diff --git a/resources/js/views/dashboard/ShortlinkEdit.vue b/resources/js/views/dashboard/ShortlinkEdit.vue index 01ad030..580a85d 100644 --- a/resources/js/views/dashboard/ShortlinkEdit.vue +++ b/resources/js/views/dashboard/ShortlinkEdit.vue @@ -84,8 +84,14 @@ const loadData = async () => { form.controls.url.value = data.shortlink.url; used.value = data.shortlink.used; } - } catch (err) { - form.apiErrors(err); + } catch (error) { + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } @@ -161,8 +167,14 @@ const handleSubmit = async () => { } else { router.push({ name: "dashboard-shortlink-list" }); } - } catch (err) { - form.apiErrors(err); + } catch (error) { + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } diff --git a/resources/js/views/dashboard/UserEdit.vue b/resources/js/views/dashboard/UserEdit.vue index 99e52cd..2e42d47 100644 --- a/resources/js/views/dashboard/UserEdit.vue +++ b/resources/js/views/dashboard/UserEdit.vue @@ -158,8 +158,14 @@ const loadData = async () => { form.controls.phone.value = data.user.phone; form.controls.email.value = data.user.email; } - } catch (err) { - form.apiErrors(err); + } catch (error) { + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); } @@ -235,8 +241,14 @@ const handleSubmit = async () => { } else { router.push({ name: "dashboard-user-list" }); } - } catch (err) { - form.apiErrors(err); + } catch (error) { + form.apiErrors(error, (message) => { + useToastStore().addToast({ + title: "An error occurred", + content: message, + type: "danger", + }); + }); } finally { form.loading(false); }