Add latest changes from gitlab-org/gitlab@master

2 files changed, 77 insertions, 21 deletions

diff --git a/app/assets/javascripts/alerts_settings/components/alerts_settings_form_new.vue b/app/assets/javascripts/alerts_settings/components/alerts_settings_form.vue
index 3656fc4d7ec..bf2874b6cc7 100644
--- a/app/assets/javascripts/alerts_settings/components/alerts_settings_form_new.vue
+++ b/app/assets/javascripts/alerts_settings/components/alerts_settings_form.vue
@@ -216,8 +216,12 @@ export default {
       return {
         name: this.currentIntegration?.name || '',
         active: this.currentIntegration?.active || false,
-        token: this.currentIntegration?.token || this.selectedIntegrationType.token,
-        url: this.currentIntegration?.url || this.selectedIntegrationType.url,
+        token:
+          this.currentIntegration?.token ||
+          (this.selectedIntegrationType !== this.generic ? this.selectedIntegrationType.token : ''),
+        url:
+          this.currentIntegration?.url ||
+          (this.selectedIntegrationType !== this.generic ? this.selectedIntegrationType.url : ''),
         apiUrl: this.currentIntegration?.apiUrl || '',
       };
     },
@@ -246,8 +250,20 @@ export default {
     canEditPayload() {
       return this.hasSamplePayload && !this.resetSamplePayloadConfirmed;
     },
+    isResetAuthKeyDisabled() {
+      return !this.active && !this.integrationForm.token !== '';
+    },
     isPayloadEditDisabled() {
-      return !this.active || this.canEditPayload;
+      return this.glFeatures.multipleHttpIntegrationsCustomMapping
+        ? !this.active || this.canEditPayload
+        : !this.active;
+    },
+    isSubmitTestPayloadDisabled() {
+      return (
+        !this.active ||
+        Boolean(this.integrationTestPayload.error) ||
+        this.integrationTestPayload.json === ''
+      );
     },
   },
   watch: {
@@ -257,7 +273,7 @@ export default {
       }
       this.selectedIntegration = val.type;
       this.active = val.active;
-      if (val.type === typeSet.http) this.getIntegrationMapping(val.id);
+      if (val.type === typeSet.http && this.showMappingBuilder) this.getIntegrationMapping(val.id);
       return this.integrationTypeSelect();
     },
   },
@@ -297,14 +313,8 @@ export default {
         });
     },
     submitWithTestPayload() {
-      return service
-        .updateTestAlert(this.testAlertPayload)
-        .then(() => {
-          this.submit();
-        })
-        .catch(() => {
-          this.$emit('test-payload-failure');
-        });
+      this.$emit('set-test-alert-payload', this.testAlertPayload);
+      this.submit();
     },
     submit() {
       // TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
@@ -323,6 +333,7 @@ export default {
         return this.$emit('update-integration', integrationPayload);
       }
 
+      this.reset();
       return this.$emit('create-new-integration', integrationPayload);
     },
     reset() {
@@ -539,7 +550,7 @@ export default {
               </template>
             </gl-form-input-group>
 
-            <gl-button v-gl-modal.authKeyModal :disabled="!active">
+            <gl-button v-gl-modal.authKeyModal :disabled="isResetAuthKeyDisabled">
               {{ $options.i18n.integrationFormSteps.step3.reset }}
             </gl-button>
             <gl-modal
@@ -642,7 +653,7 @@ export default {
         <gl-button
           v-if="!isManagingOpsgenie"
           data-testid="integration-test-and-submit"
-          :disabled="Boolean(integrationTestPayload.error)"
+          :disabled="isSubmitTestPayloadDisabled"
           category="secondary"
           variant="success"
           class="gl-mx-3 js-no-auto-disable"
diff --git a/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue b/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue
index b9b397de05e..1ac63fd04a1 100644
--- a/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue
+++ b/app/assets/javascripts/alerts_settings/components/alerts_settings_wrapper.vue
@@ -14,7 +14,8 @@ import resetHttpTokenMutation from '../graphql/mutations/reset_http_token.mutati
 import resetPrometheusTokenMutation from '../graphql/mutations/reset_prometheus_token.mutation.graphql';
 import updateCurrentIntergrationMutation from '../graphql/mutations/update_current_intergration.mutation.graphql';
 import IntegrationsList from './alerts_integrations_list.vue';
-import SettingsFormNew from './alerts_settings_form_new.vue';
+import AlertSettingsForm from './alerts_settings_form.vue';
+import service from '../services';
 import { typeSet } from '../constants';
 import {
   updateStoreAfterIntegrationDelete,
@@ -35,6 +36,9 @@ export default {
       'AlertsIntegrations|The integration has been successfully saved. Alerts from this new integration should now appear on your alerts list.',
     ),
     integrationRemoved: s__('AlertsIntegrations|The integration has been successfully removed.'),
+    alertSent: s__(
+      'AlertsIntegrations|The test alert has been successfully sent, and should now be visible on your alerts list.',
+    ),
   },
   components: {
     // TODO: Will be removed in 13.7 as part of: https://gitlab.com/gitlab-org/gitlab/-/issues/273657
@@ -42,7 +46,7 @@ export default {
     GlLink,
     GlSprintf,
     IntegrationsList,
-    SettingsFormNew,
+    AlertSettingsForm,
   },
   inject: {
     generic: {
@@ -89,6 +93,7 @@ export default {
   data() {
     return {
       isUpdating: false,
+      testAlertPayload: null,
       integrations: {},
       currentIntegration: null,
     };
@@ -131,6 +136,19 @@ export default {
           if (error) {
             return createFlash({ message: error });
           }
+
+          if (this.testAlertPayload) {
+            const integration =
+              httpIntegrationCreate?.integration || prometheusIntegrationCreate?.integration;
+
+            const payload = {
+              ...this.testAlertPayload,
+              endpoint: integration.url,
+              token: integration.token,
+            };
+            return this.validateAlertPayload(payload);
+          }
+
           return createFlash({
             message: this.$options.i18n.changesSaved,
             type: FLASH_TYPES.SUCCESS,
@@ -161,6 +179,13 @@ export default {
           if (error) {
             return createFlash({ message: error });
           }
+
+          if (this.testAlertPayload) {
+            return this.validateAlertPayload();
+          }
+
+          this.clearCurrentIntegration();
+
           return createFlash({
             message: this.$options.i18n.changesSaved,
             type: FLASH_TYPES.SUCCESS,
@@ -171,6 +196,7 @@ export default {
         })
         .finally(() => {
           this.isUpdating = false;
+          this.testAlertPayload = null;
         });
     },
     resetToken({ type, variables }) {
@@ -194,7 +220,13 @@ export default {
             const integration =
               httpIntegrationResetToken?.integration ||
               prometheusIntegrationResetToken?.integration;
-            this.currentIntegration = integration;
+
+            this.$apollo.mutate({
+              mutation: updateCurrentIntergrationMutation,
+              variables: {
+                ...integration,
+              },
+            });
 
             return createFlash({
               message: this.$options.i18n.changesSaved,
@@ -262,8 +294,21 @@ export default {
         variables: {},
       });
     },
-    testPayloadFailure() {
-      createFlash({ message: INTEGRATION_PAYLOAD_TEST_ERROR });
+    setTestAlertPayload(payload) {
+      this.testAlertPayload = payload;
+    },
+    validateAlertPayload(payload) {
+      return service
+        .updateTestAlert(payload ?? this.testAlertPayload)
+        .then(() => {
+          return createFlash({
+            message: this.$options.i18n.alertSent,
+            type: FLASH_TYPES.SUCCESS,
+          });
+        })
+        .catch(() => {
+          createFlash({ message: INTEGRATION_PAYLOAD_TEST_ERROR });
+        });
     },
   },
 };
@@ -297,7 +342,7 @@ export default {
       @edit-integration="editIntegration"
       @delete-integration="deleteIntegration"
     />
-    <settings-form-new
+    <alert-settings-form
       :loading="isUpdating"
       :can-add-integration="canAddIntegration"
       :can-manage-opsgenie="canManageOpsgenie"
@@ -305,7 +350,7 @@ export default {
       @update-integration="updateIntegration"
       @reset-token="resetToken"
       @clear-current-integration="clearCurrentIntegration"
-      @test-payload-failure="testPayloadFailure"
+      @set-test-alert-payload="setTestAlertPayload"
     />
   </div>
 </template>