diff --git a/resources/js/app/components/dialog/dialog.vue b/resources/js/app/components/dialog/dialog.vue
index 4afc8d1fe..6843a9702 100644
--- a/resources/js/app/components/dialog/dialog.vue
+++ b/resources/js/app/components/dialog/dialog.vue
@@ -47,7 +47,7 @@
                     </i>
                 </header>
                 <div
-                    class="message mt-1 has-text-size-base"
+                    class="message mt-1"
                     v-html="message"
                     v-if="message"
                 />
diff --git a/resources/js/app/components/module/module-properties.vue b/resources/js/app/components/module/module-properties.vue
index 418033fd0..4ed4702a2 100644
--- a/resources/js/app/components/module/module-properties.vue
+++ b/resources/js/app/components/module/module-properties.vue
@@ -204,7 +204,7 @@ export default {
                     });
                 }, 2000);
             } catch (e) {
-                BEDITA.error(e);
+                this.$helpers.handleApiError(e);
             } finally {
                 this.loading = false;
             }
diff --git a/resources/js/app/components/module/module-setup.vue b/resources/js/app/components/module/module-setup.vue
index 9501a0404..c94402066 100644
--- a/resources/js/app/components/module/module-setup.vue
+++ b/resources/js/app/components/module/module-setup.vue
@@ -218,7 +218,7 @@ export default {
                     });
                 }, 2000);
             } catch (e) {
-                BEDITA.error(e);
+                this.$helpers.handleApiError(e);
             } finally {
                 this.loading = false;
             }
diff --git a/resources/js/app/components/object-captions/object-captions.vue b/resources/js/app/components/object-captions/object-captions.vue
index 681bc3c3b..c388d170d 100644
--- a/resources/js/app/components/object-captions/object-captions.vue
+++ b/resources/js/app/components/object-captions/object-captions.vue
@@ -603,13 +603,13 @@ export default {
                 const response = await fetch(`${BEDITA.base}/api/${this.objectType}/${this.objectId}`, options);
                 const responseJson = await response.json();
                 if (responseJson.error) {
-                    BEDITA.error(responseJson.error);
+                    this.$helpers.handleApiError(responseJson);
                 } else {
                     const captions = responseJson.data.attributes.captions || [];
                     this.reset(captions);
                 }
             } catch (error) {
-                BEDITA.error(error);
+                this.$helpers.handleApiError(error);
             } finally {
                 this.loading = false;
             }
diff --git a/resources/js/app/components/relation-view/relation-view.vue b/resources/js/app/components/relation-view/relation-view.vue
index 0f0a6c171..5b70fe3db 100644
--- a/resources/js/app/components/relation-view/relation-view.vue
+++ b/resources/js/app/components/relation-view/relation-view.vue
@@ -723,7 +723,7 @@ export default {
                         body: JSON.stringify({ data: toRemove }),
                     });
                     if (response?.error) {
-                        BEDITA.error(response.error?.title || response?.error);
+                        this.$helpers.handleApiError(response);
                     } else {
                         this.removedRelated = [];
                         this.prepareRelationsToRemove(this.removedRelated);
@@ -744,7 +744,7 @@ export default {
                     });
                     const json = await response.json();
                     if (json?.error) {
-                        BEDITA.error(json.error?.title);
+                        this.$helpers.handleApiError(json);
                     } else {
                         this.addedRelations = [];
                         this.modifiedRelations = [];
@@ -753,11 +753,7 @@ export default {
                 }
                 await this.reloadObjects();
             } catch (error) {
-                if (typeof error === 'string') {
-                    BEDITA.error(error);
-                } else {
-                    BEDITA.error(error?.title);
-                }
+                this.$helpers.handleApiError(error);
             } finally {
                 this.savingRelated = false;
             }
diff --git a/resources/js/app/components/relation-view/relations-add.js b/resources/js/app/components/relation-view/relations-add.js
index 62712cdfc..0c663382f 100644
--- a/resources/js/app/components/relation-view/relations-add.js
+++ b/resources/js/app/components/relation-view/relations-add.js
@@ -332,7 +332,7 @@ export default {
             try {
                 const response = await fetch(postUrl, options);
                 const responseJson = await response.json();
-                if (responseJson.error) {
+                if (responseJson?.error) {
                     throw new Error(responseJson.error);
                 }
 
diff --git a/resources/js/app/helpers/view.js b/resources/js/app/helpers/view.js
index 4ffc7797d..b0d978ad4 100644
--- a/resources/js/app/helpers/view.js
+++ b/resources/js/app/helpers/view.js
@@ -378,6 +378,25 @@ export default {
 
                 return response;
             },
+
+            handleApiError(response) {
+                let message = '';
+                let detail = false;
+                if (typeof response === 'string') {
+                    message = response;
+                } else if (response?.error && typeof response.error === 'string') {
+                    message = response.error;
+                } else if (response?.message && typeof response.message === 'string') {
+                    message = response.message;
+                } else {
+                    if (response?.error?.status) {
+                        message += `[${response.error.status}] `;
+                    }
+                    message += response?.error?.title || t`An error occurred`;
+                    detail = response?.error?.detail || false;
+                }
+                BEDITA.error(message, document.body, detail);
+            },
         }
     }
 };
diff --git a/resources/js/app/pages/admin/appearance.vue b/resources/js/app/pages/admin/appearance.vue
index da08b57d3..580ad5453 100644
--- a/resources/js/app/pages/admin/appearance.vue
+++ b/resources/js/app/pages/admin/appearance.vue
@@ -88,10 +88,10 @@ export default {
                 const response = await fetch(`${BEDITA.base}/admin/appearance/save`, options);
                 const responseJson = await response.json();
                 if (responseJson.error) {
-                    BEDITA.error(responseJson.error);
+                    this.$helpers.handleApiError(responseJson);
                 }
             } catch (error) {
-                BEDITA.error(error);
+                this.$helpers.handleApiError(error);
             } finally {
                 this.loading = false;
                 this.loadingKey = '';
diff --git a/resources/js/app/pages/modules/view.vue b/resources/js/app/pages/modules/view.vue
index a76daee3b..72dfdb3ef 100644
--- a/resources/js/app/pages/modules/view.vue
+++ b/resources/js/app/pages/modules/view.vue
@@ -105,7 +105,7 @@ export default {
                 }
                 if (json?.error) {
                     await this.showFlashMessages();
-                    BEDITA.error(json.error);
+                    this.$helpers.handleApiError(json);
                     throw new Error(json.error);
                 }
 
@@ -210,12 +210,21 @@ export default {
                     details = details + '\n' + e.details;
                 }
             }
-            const message = t`OOOPS! Something went wrong` + '. ' + this.errors[0].message;
+            const title = t`OOOPS! Something went wrong` + '. ' + this.errors[0].message;
+            let params = {
+                error: {
+                    title,
+                }
+            };
             if (this.userRoles.includes('admin')) {
-                BEDITA.error(message, document.body, details);
-            } else {
-                BEDITA.error(message);
+                params = {
+                    error: {
+                        title,
+                        details
+                    }
+                }
             }
+            this.$helpers.handleApiError(params);
             this.errors = [];
         },