diff --git a/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.hbs b/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.hbs
index 705a46cf84..e9d645ca03 100644
--- a/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.hbs
+++ b/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.hbs
@@ -54,13 +54,38 @@
This is it.
+{{#if this.errorMessage}}
+
+ {{svg-jar "warning"}}
+ {{this.errorMessage}}
+
+{{/if}}
+
+{{#if this.emailErrorMessage}}
+
+ {{svg-jar "warning"}}
+
+ {{#if @publishOptions.willOnlyEmail}}
+ Your post has been created but the email failed to send.
+ {{else}}
+ Your post has been published but the email failed to send.
+ {{/if}}
+
+ Please verify your email settings if the error persists.
+
+ Email error: {{this.emailErrorMessage}}
+
+{{/if}}
+
\ No newline at end of file
diff --git a/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.js b/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.js
index f31fd234c5..66946e4487 100644
--- a/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.js
+++ b/ghost/admin/app/components/editor-labs/modals/publish-flow/confirm.js
@@ -1,10 +1,23 @@
import Component from '@glimmer/component';
import moment from 'moment';
+import {action} from '@ember/object';
+import {htmlSafe} from '@ember/template';
+import {isArray} from '@ember/array';
+import {isServerUnreachableError} from 'ghost-admin/services/ajax';
import {inject as service} from '@ember/service';
+import {task} from 'ember-concurrency';
+import {tracked} from '@glimmer/tracking';
+
+function isString(str) {
+ return toString.call(str) === '[object String]';
+}
export default class PublishFlowOptions extends Component {
@service settings;
+ @tracked errorMessage;
+ @tracked emailErrorMessage;
+
// store any derived state from PublishOptions on creation so the copy
// doesn't change whilst the post is saving
willEmail = this.args.publishOptions.willEmail;
@@ -32,4 +45,45 @@ export default class PublishFlowOptions extends Component {
return buttonText;
}
+
+ @task({drop: true})
+ *confirmTask() {
+ this.errorMessage = null;
+ this.emailErrorMessage = null;
+
+ try {
+ yield this.args.saveTask.perform();
+ } catch (e) {
+ if (e === undefined && this.publishOptions.post.errors.length !== 0) {
+ // validation error
+ const validationError = this.args.publishOptions.post.errors.messages[0];
+ this.errorMessage = `Validation failed: ${validationError}`;
+ return false;
+ }
+
+ if (e?.name === 'EmailFailedError') {
+ this.emailErrorMessage = e.message;
+ return false;
+ }
+
+ let errorMessage = '';
+
+ if (isServerUnreachableError(e)) {
+ errorMessage = 'Unable to connect, please check your connection and try again';
+ } else if (e && isString(e)) {
+ errorMessage = e;
+ } else if (e && isArray(e)) {
+ // This is here because validation errors are returned as an array
+ // TODO: remove this once validations are fixed
+ errorMessage = e[0];
+ } else if (e?.payload?.errors?.[0].message) {
+ errorMessage = e.payload.errors[0].message;
+ } else {
+ errorMessage = 'Unknown Error';
+ }
+
+ this.errorMessage = htmlSafe(errorMessage);
+ return false;
+ }
+ }
}