Add latest changes from gitlab-org/gitlab@master

4 files changed, 30 insertions, 36 deletions

diff --git a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue
index 4bfed6d489d..df7d9b56aed 100644
--- a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue
+++ b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_root.vue
@@ -20,7 +20,12 @@ export default {
       type: String,
       required: true,
     },
-    initialIncomingEmail: {
+    incomingEmail: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    customEmail: {
       type: String,
       required: false,
       default: '',
@@ -50,23 +55,18 @@ export default {
   data() {
     return {
       isEnabled: this.initialIsEnabled,
-      incomingEmail: this.initialIncomingEmail,
       isTemplateSaving: false,
       isAlertShowing: false,
       alertVariant: 'danger',
       alertMessage: '',
+      updatedCustomEmail: this.customEmail,
     };
   },
 
   created() {
     eventHub.$on('serviceDeskEnabledCheckboxToggled', this.onEnableToggled);
     eventHub.$on('serviceDeskTemplateSave', this.onSaveTemplate);
-
     this.service = new ServiceDeskService(this.endpoint);
-
-    if (this.isEnabled && !this.incomingEmail) {
-      this.fetchIncomingEmail();
-    }
   },
 
   beforeDestroy() {
@@ -75,22 +75,6 @@ export default {
   },
 
   methods: {
-    fetchIncomingEmail() {
-      this.service
-        .fetchIncomingEmail()
-        .then(({ data }) => {
-          const email = data.service_desk_address;
-          if (!email) {
-            throw new Error(__("Response didn't include `service_desk_address`"));
-          }
-
-          this.incomingEmail = email;
-        })
-        .catch(() =>
-          this.showAlert(__('An error occurred while fetching the Service Desk address.')),
-        );
-    },
-
     onEnableToggled(isChecked) {
       this.isEnabled = isChecked;
       this.incomingEmail = '';
@@ -119,7 +103,7 @@ export default {
       this.service
         .updateTemplate({ selectedTemplate, outgoingName, projectKey }, this.isEnabled)
         .then(({ data }) => {
-          this.incomingEmail = data?.service_desk_address;
+          this.updatedCustomEmail = data?.service_desk_address;
           this.showAlert(__('Changes were successfully made.'), 'success');
         })
         .catch(err => {
@@ -155,6 +139,7 @@ export default {
     <service-desk-setting
       :is-enabled="isEnabled"
       :incoming-email="incomingEmail"
+      :custom-email="updatedCustomEmail"
       :initial-selected-template="selectedTemplate"
       :initial-outgoing-name="outgoingName"
       :initial-project-key="projectKey"
diff --git a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue
index e18cfefc3ca..5d120fd0b3f 100644
--- a/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue
+++ b/app/assets/javascripts/projects/settings_service_desk/components/service_desk_setting.vue
@@ -26,6 +26,11 @@ export default {
       required: false,
       default: '',
     },
+    customEmail: {
+      type: String,
+      required: false,
+      default: '',
+    },
     initialSelectedTemplate: {
       type: String,
       required: false,
@@ -57,7 +62,6 @@ export default {
       selectedTemplate: this.initialSelectedTemplate,
       outgoingName: this.initialOutgoingName || __('GitLab Support Bot'),
       projectKey: this.initialProjectKey,
-      baseEmail: this.incomingEmail.replace(this.initialProjectKey, ''),
     };
   },
   computed: {
@@ -67,6 +71,12 @@ export default {
     hasProjectKeySupport() {
       return Boolean(this.glFeatures.serviceDeskCustomAddress);
     },
+    email() {
+      return this.customEmail || this.incomingEmail;
+    },
+    hasCustomEmail() {
+      return this.customEmail && this.customEmail !== this.incomingEmail;
+    },
   },
   methods: {
     onCheckboxToggle(isChecked) {
@@ -101,30 +111,31 @@ export default {
         <strong id="incoming-email-describer" class="d-block mb-1">
           {{ __('Forward external support email address to') }}
         </strong>
-        <template v-if="incomingEmail">
+        <template v-if="email">
           <div class="input-group">
             <input
               ref="service-desk-incoming-email"
               type="text"
-              class="form-control incoming-email"
+              class="form-control"
+              data-testid="incoming-email"
               :placeholder="__('Incoming email')"
               :aria-label="__('Incoming email')"
               aria-describedby="incoming-email-describer"
-              :value="incomingEmail"
+              :value="email"
               disabled="true"
             />
             <div class="input-group-append">
               <clipboard-button
                 :title="__('Copy')"
-                :text="incomingEmail"
+                :text="email"
                 css-class="input-group-text qa-clipboard-button"
               />
             </div>
           </div>
-          <span v-if="projectKey" class="form-text text-muted">
+          <span v-if="hasCustomEmail" class="form-text text-muted">
             <gl-sprintf :message="__('Emails sent to %{email} will still be supported')">
               <template #email>
-                <code>{{ baseEmail }}</code>
+                <code>{{ incomingEmail }}</code>
               </template>
             </gl-sprintf>
           </span>
diff --git a/app/assets/javascripts/projects/settings_service_desk/index.js b/app/assets/javascripts/projects/settings_service_desk/index.js
index 15c077de72e..c73163788ef 100644
--- a/app/assets/javascripts/projects/settings_service_desk/index.js
+++ b/app/assets/javascripts/projects/settings_service_desk/index.js
@@ -17,6 +17,7 @@ export default () => {
           initialIsEnabled: parseBoolean(dataset.enabled),
           endpoint: dataset.endpoint,
           incomingEmail: dataset.incomingEmail,
+          customEmail: dataset.customEmail,
           selectedTemplate: dataset.selectedTemplate,
           outgoingName: dataset.outgoingName,
           projectKey: dataset.projectKey,
@@ -28,7 +29,8 @@ export default () => {
           props: {
             initialIsEnabled: this.initialIsEnabled,
             endpoint: this.endpoint,
-            initialIncomingEmail: this.incomingEmail,
+            incomingEmail: this.incomingEmail,
+            customEmail: this.customEmail,
             selectedTemplate: this.selectedTemplate,
             outgoingName: this.outgoingName,
             projectKey: this.projectKey,
diff --git a/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js b/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js
index d707763c64e..b68c5bb876f 100644
--- a/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js
+++ b/app/assets/javascripts/projects/settings_service_desk/services/service_desk_service.js
@@ -5,10 +5,6 @@ class ServiceDeskService {
     this.endpoint = endpoint;
   }
 
-  fetchIncomingEmail() {
-    return axios.get(this.endpoint);
-  }
-
   toggleServiceDesk(enable) {
     return axios.put(this.endpoint, { service_desk_enabled: enable });
   }