fix: Welcome email copy changes and canned response API error handling [cw-1290] (#6905)

* fix: Welcome email copy changes and canned response API error handling

* Review fixes

* Uses mixin for alerts in canned page

* Typo fixes

* Copy changes

* Fixes broken tests

* Fixes review comments

* Fixes typo errors with mail template

* Removes unwanted case

* Fixes repetitive texts

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>

app/javascript/dashboard/routes/dashboard/settings/canned/AddCanned.vue

@@ -5,7 +5,7 @@
         :header-title="$t('CANNED_MGMT.ADD.TITLE')"
         :header-content="$t('CANNED_MGMT.ADD.DESC')"
       />
-      <form class="row" @submit.prevent="addAgent()">
+      <form class="row" @submit.prevent="addCannedResponse()">
         <div class="medium-12 columns">
           <label :class="{ error: $v.shortCode.$error }">
             {{ $t('CANNED_MGMT.ADD.FORM.SHORT_CODE.LABEL') }}
@@ -107,7 +107,7 @@ export default {
       this.$v.shortCode.$reset();
       this.$v.content.$reset();
     },
-    addAgent() {
+    addCannedResponse() {
       // Show loading on button
       this.addCanned.showLoading = true;
       // Make API Calls
@@ -123,9 +123,11 @@ export default {
           this.resetForm();
           this.onClose();
         })
-        .catch(() => {
+        .catch(error => {
           this.addCanned.showLoading = false;
-          this.showAlert(this.$t('CANNED_MGMT.ADD.API.ERROR_MESSAGE'));
+          const errorMessage =
+            error?.message || this.$t('CANNED_MGMT.ADD.API.ERROR_MESSAGE');
+          this.showAlert(errorMessage);
         });
     },
   },

app/javascript/dashboard/routes/dashboard/settings/canned/EditCanned.vue

@@ -57,6 +57,7 @@
 import { required, minLength } from 'vuelidate/lib/validators';
 import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor';
 import WootSubmitButton from '../../../../components/buttons/FormSubmitButton';
+import alertMixin from 'shared/mixins/alertMixin';
 import Modal from '../../../../components/Modal';
 
 export default {
@@ -65,6 +66,7 @@ export default {
     Modal,
     WootMessageEditor,
   },
+  mixins: [alertMixin],
   props: {
     id: { type: Number, default: null },
     edcontent: { type: String, default: '' },
@@ -76,7 +78,6 @@ export default {
       editCanned: {
         showAlert: false,
         showLoading: false,
-        message: '',
       },
       shortCode: this.edshortCode,
       content: this.edcontent,
@@ -102,9 +103,6 @@ export default {
       this.$v.content.$touch();
       this.content = name;
     },
-    showAlert() {
-      bus.$emit('newToastMessage', this.editCanned.message);
-    },
     resetForm() {
       this.shortCode = '';
       this.content = '';
@@ -124,21 +122,17 @@ export default {
         .then(() => {
           // Reset Form, Show success message
           this.editCanned.showLoading = false;
-          this.editCanned.message = this.$t(
-            'CANNED_MGMT.EDIT.API.SUCCESS_MESSAGE'
-          );
-          this.showAlert();
+          this.showAlert(this.$t('CANNED_MGMT.EDIT.API.SUCCESS_MESSAGE'));
           this.resetForm();
           setTimeout(() => {
             this.onClose();
           }, 10);
         })
-        .catch(() => {
+        .catch(error => {
           this.editCanned.showLoading = false;
-          this.editCanned.message = this.$t(
-            'CANNED_MGMT.EDIT.API.ERROR_MESSAGE'
-          );
-          this.showAlert();
+          const errorMessage =
+            error?.message || this.$t('CANNED_MGMT.EDIT.API.ERROR_MESSAGE');
+          this.showAlert(errorMessage);
         });
     },
   },

app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue

@@ -198,8 +198,10 @@ export default {
         .then(() => {
           this.showAlert(this.$t('CANNED_MGMT.DELETE.API.SUCCESS_MESSAGE'));
         })
-        .catch(() => {
-          this.showAlert(this.$t('CANNED_MGMT.DELETE.API.ERROR_MESSAGE'));
+        .catch(error => {
+          const errorMessage =
+            error?.message || this.$t('CANNED_MGMT.DELETE.API.ERROR_MESSAGE');
+          this.showAlert(errorMessage);
         });
     },
   },