From 6b8a90def6f3b6bbf40817344251c5dcd3903c93 Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Mon, 9 Nov 2020 20:40:05 +0700
Subject: [PATCH 1/7] Add UninstallConfirmationModal

---
 .../edit/components/integration_form.vue      | 16 ++++
 .../uninstall_confirmation_modal.vue          | 75 +++++++++++++++++++
 .../integrations/edit/constants.js            | 15 ++++
 3 files changed, 106 insertions(+)
 create mode 100644 app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue

diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index e42a8b7de7c73a..a8eccdef55e183 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -12,6 +12,7 @@ import JiraIssuesFields from './jira_issues_fields.vue';
 import TriggerFields from './trigger_fields.vue';
 import DynamicField from './dynamic_field.vue';
 import ConfirmationModal from './confirmation_modal.vue';
+import UninstallConfirmationModal from './uninstall_confirmation_modal.vue';
 
 export default {
   name: 'IntegrationForm',
@@ -23,6 +24,7 @@ export default {
     TriggerFields,
     DynamicField,
     ConfirmationModal,
+    UninstallConfirmationModal,
     GlButton,
   },
   directives: {
@@ -58,6 +60,7 @@ export default {
       this.setIsTesting(true);
       eventHub.$emit('testIntegration');
     },
+    onUninstallClick() {},
   },
 };
 </script>
@@ -130,6 +133,19 @@ export default {
         {{ __('Test settings') }}
       </gl-button>
 
+      <template v-if="isInstanceOrGroupLevel">
+        <gl-button
+          v-gl-modal.confirmUninstallIntegration
+          category="secondary"
+          variant="danger"
+          :loading="isUninstalling"
+          :disabled="isDisabled"
+        >
+          {{ __('Uninstall') }}
+        </gl-button>
+        <uninstall-confirmation-modal @uninstall="onUninstallClick" />
+      </template>
+
       <gl-button class="btn-cancel" :href="propsSource.cancelPath">{{ __('Cancel') }}</gl-button>
     </div>
   </div>
diff --git a/app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue b/app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue
new file mode 100644
index 00000000000000..7affc8845b7f54
--- /dev/null
+++ b/app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue
@@ -0,0 +1,75 @@
+<script>
+import { mapGetters } from 'vuex';
+import { GlFormGroup, GlFormRadio, GlModal } from '@gitlab/ui';
+
+import { uninstallOptions } from '../constants';
+import { __ } from '~/locale';
+
+export default {
+  components: {
+    GlFormGroup,
+    GlFormRadio,
+    GlModal,
+  },
+  data() {
+    return {
+      uninstallAll: false,
+    };
+  },
+  computed: {
+    ...mapGetters(['isDisabled']),
+    primaryProps() {
+      return {
+        text: __('Uninstall'),
+        attributes: [{ variant: 'danger' }, { category: 'primary' }, { disabled: this.isDisabled }],
+      };
+    },
+    cancelProps() {
+      return {
+        text: __('Cancel'),
+      };
+    },
+  },
+  methods: {
+    onUninstall() {
+      this.$emit('uninstall', this.uninstallAll);
+    },
+  },
+  uninstallOptions,
+};
+</script>
+
+<template>
+  <gl-modal
+    modal-id="confirmUninstallIntegration"
+    size="sm"
+    :title="s__('Integrations|Uninstall integration?')"
+    :action-primary="primaryProps"
+    :action-cancel="cancelProps"
+    @primary="onUninstall"
+  >
+    <p>
+      {{ s__('Integrations|Some projects are using these settings as the default.') }}
+      <br />
+      {{ s__('Integrations|How do you want to apply the changes to these projects?') }}
+    </p>
+
+    <gl-form-group>
+      <gl-form-radio
+        v-for="uninstallOption in $options.uninstallOptions"
+        :key="uninstallOption.value"
+        v-model="uninstallAll"
+        :value="uninstallOption.value"
+      >
+        {{ uninstallOption.label }}
+        <template #help>
+          {{ uninstallOption.help }}
+        </template>
+      </gl-form-radio>
+    </gl-form-group>
+
+    <p class="gl-mb-0">
+      {{ s__('Integrations|Projects using custom settings will not be impacted.') }}
+    </p>
+  </gl-modal>
+</template>
diff --git a/app/assets/javascripts/integrations/edit/constants.js b/app/assets/javascripts/integrations/edit/constants.js
index b74ae209eb7260..141e5b5c5cd4da 100644
--- a/app/assets/javascripts/integrations/edit/constants.js
+++ b/app/assets/javascripts/integrations/edit/constants.js
@@ -15,3 +15,18 @@ export const overrideDropdownDescriptions = {
     'Integrations|Default settings are inherited from the instance level.',
   ),
 };
+
+export const uninstallOptions = [
+  {
+    value: true,
+    label: s__('Integrations|Apply to all inheriting projects'),
+    help: s__(
+      'Integrations|All projects inheriting these settings will be cleared and deactivated',
+    ),
+  },
+  {
+    value: false,
+    label: s__('Integrations|Do not apply to all inheriting projects'),
+    help: s__('Integrations|Projects will be switched to custom settings and remain active'),
+  },
+];
-- 
GitLab


From 806d6b2c2cb481565a065cebefdf634475b9497e Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Mon, 9 Nov 2020 20:44:32 +0700
Subject: [PATCH 2/7] Add isUninstalling state and related code

Update `isSavingOrTesting` to `isDisabled` to
include `isUninstalling` as one of the conditions to
disable action buttons
---
 .../edit/components/confirmation_modal.vue           |  4 ++--
 .../edit/components/integration_form.vue             | 12 ++++++------
 .../javascripts/integrations/edit/store/actions.js   |  2 ++
 .../javascripts/integrations/edit/store/getters.js   |  2 +-
 .../integrations/edit/store/mutation_types.js        |  1 +
 .../javascripts/integrations/edit/store/mutations.js |  3 +++
 .../javascripts/integrations/edit/store/state.js     |  1 +
 7 files changed, 16 insertions(+), 9 deletions(-)

diff --git a/app/assets/javascripts/integrations/edit/components/confirmation_modal.vue b/app/assets/javascripts/integrations/edit/components/confirmation_modal.vue
index d4489bbf693a32..93ea1f4f636055 100644
--- a/app/assets/javascripts/integrations/edit/components/confirmation_modal.vue
+++ b/app/assets/javascripts/integrations/edit/components/confirmation_modal.vue
@@ -8,14 +8,14 @@ export default {
     GlModal,
   },
   computed: {
-    ...mapGetters(['isSavingOrTesting']),
+    ...mapGetters(['isDisabled']),
     primaryProps() {
       return {
         text: __('Save'),
         attributes: [
           { variant: 'success' },
           { category: 'primary' },
-          { disabled: this.isSavingOrTesting },
+          { disabled: this.isDisabled },
         ],
       };
     },
diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index a8eccdef55e183..7144b3ef7ff85c 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -32,8 +32,8 @@ export default {
   },
   mixins: [glFeatureFlagsMixin()],
   computed: {
-    ...mapGetters(['currentKey', 'propsSource', 'isSavingOrTesting']),
-    ...mapState(['defaultState', 'override', 'isSaving', 'isTesting']),
+    ...mapGetters(['currentKey', 'propsSource', 'isDisabled']),
+    ...mapState(['defaultState', 'override', 'isSaving', 'isTesting', 'isUninstalling']),
     isEditable() {
       return this.propsSource.editable;
     },
@@ -51,7 +51,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions(['setOverride', 'setIsSaving', 'setIsTesting']),
+    ...mapActions(['setOverride', 'setIsSaving', 'setIsTesting', 'setIsUninstalling']),
     onSaveClick() {
       this.setIsSaving(true);
       eventHub.$emit('saveIntegration');
@@ -103,7 +103,7 @@ export default {
           category="primary"
           variant="success"
           :loading="isSaving"
-          :disabled="isSavingOrTesting"
+          :disabled="isDisabled"
           data-qa-selector="save_changes_button"
         >
           {{ __('Save changes') }}
@@ -116,7 +116,7 @@ export default {
         variant="success"
         type="submit"
         :loading="isSaving"
-        :disabled="isSavingOrTesting"
+        :disabled="isDisabled"
         data-qa-selector="save_changes_button"
         @click.prevent="onSaveClick"
       >
@@ -126,7 +126,7 @@ export default {
       <gl-button
         v-if="propsSource.canTest"
         :loading="isTesting"
-        :disabled="isSavingOrTesting"
+        :disabled="isDisabled"
         :href="propsSource.testPath"
         @click.prevent="onTestClick"
       >
diff --git a/app/assets/javascripts/integrations/edit/store/actions.js b/app/assets/javascripts/integrations/edit/store/actions.js
index 199c9074ead129..a2e9da8d703c6c 100644
--- a/app/assets/javascripts/integrations/edit/store/actions.js
+++ b/app/assets/javascripts/integrations/edit/store/actions.js
@@ -3,3 +3,5 @@ import * as types from './mutation_types';
 export const setOverride = ({ commit }, override) => commit(types.SET_OVERRIDE, override);
 export const setIsSaving = ({ commit }, isSaving) => commit(types.SET_IS_SAVING, isSaving);
 export const setIsTesting = ({ commit }, isTesting) => commit(types.SET_IS_TESTING, isTesting);
+export const setIsUninstalling = ({ commit }, isUninstalling) =>
+  commit(types.SET_IS_UNINSTALLING, isUninstalling);
diff --git a/app/assets/javascripts/integrations/edit/store/getters.js b/app/assets/javascripts/integrations/edit/store/getters.js
index 4ee5f11855cca0..6aadecaecf9f53 100644
--- a/app/assets/javascripts/integrations/edit/store/getters.js
+++ b/app/assets/javascripts/integrations/edit/store/getters.js
@@ -1,6 +1,6 @@
 export const isInheriting = state => (state.defaultState === null ? false : !state.override);
 
-export const isSavingOrTesting = state => state.isSaving || state.isTesting;
+export const isDisabled = state => state.isSaving || state.isTesting || state.isUninstalling;
 
 export const propsSource = (state, getters) =>
   getters.isInheriting ? state.defaultState : state.customState;
diff --git a/app/assets/javascripts/integrations/edit/store/mutation_types.js b/app/assets/javascripts/integrations/edit/store/mutation_types.js
index 0dae8ea079ee2c..4d9cd12f14a2b0 100644
--- a/app/assets/javascripts/integrations/edit/store/mutation_types.js
+++ b/app/assets/javascripts/integrations/edit/store/mutation_types.js
@@ -1,3 +1,4 @@
 export const SET_OVERRIDE = 'SET_OVERRIDE';
 export const SET_IS_SAVING = 'SET_IS_SAVING';
 export const SET_IS_TESTING = 'SET_IS_TESTING';
+export const SET_IS_UNINSTALLING = 'SET_IS_UNINSTALLING';
diff --git a/app/assets/javascripts/integrations/edit/store/mutations.js b/app/assets/javascripts/integrations/edit/store/mutations.js
index 8ac3c476f9e545..2e88a6469f1cee 100644
--- a/app/assets/javascripts/integrations/edit/store/mutations.js
+++ b/app/assets/javascripts/integrations/edit/store/mutations.js
@@ -10,4 +10,7 @@ export default {
   [types.SET_IS_TESTING](state, isTesting) {
     state.isTesting = isTesting;
   },
+  [types.SET_IS_UNINSTALLING](state, isUninstalling) {
+    state.isUninstalling = isUninstalling;
+  },
 };
diff --git a/app/assets/javascripts/integrations/edit/store/state.js b/app/assets/javascripts/integrations/edit/store/state.js
index a9ecee6c539638..cb6cc4983c7ccc 100644
--- a/app/assets/javascripts/integrations/edit/store/state.js
+++ b/app/assets/javascripts/integrations/edit/store/state.js
@@ -7,5 +7,6 @@ export default ({ defaultState = null, customState = {} } = {}) => {
     customState,
     isSaving: false,
     isTesting: false,
+    isUninstalling: false,
   };
 };
-- 
GitLab


From 0e9f5b965000b4288e6dbee76def45853c29e0d1 Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Mon, 9 Nov 2020 22:47:58 +0700
Subject: [PATCH 3/7] Update specs and translations

---
 locale/gitlab.pot                             | 24 +++++++++++++++++++
 .../integrations/edit/store/state_spec.js     |  1 +
 2 files changed, 25 insertions(+)

diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 60a987778d5837..442322196eb8dd 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -14569,6 +14569,12 @@ msgstr ""
 msgid "Integrations|All details"
 msgstr ""
 
+msgid "Integrations|All projects inheriting these settings will be cleared and deactivated"
+msgstr ""
+
+msgid "Integrations|Apply to all inheriting projects"
+msgstr ""
+
 msgid "Integrations|Comment detail:"
 msgstr ""
 
@@ -14590,9 +14596,15 @@ msgstr ""
 msgid "Integrations|Default settings are inherited from the instance level."
 msgstr ""
 
+msgid "Integrations|Do not apply to all inheriting projects"
+msgstr ""
+
 msgid "Integrations|Enable comments"
 msgstr ""
 
+msgid "Integrations|How do you want to apply the changes to these projects?"
+msgstr ""
+
 msgid "Integrations|Includes Standard plus entire commit message, commit hash, and issue IDs"
 msgstr ""
 
@@ -14605,6 +14617,12 @@ msgstr ""
 msgid "Integrations|Projects using custom settings will not be impacted unless the project owner chooses to use parent level defaults."
 msgstr ""
 
+msgid "Integrations|Projects using custom settings will not be impacted."
+msgstr ""
+
+msgid "Integrations|Projects will be switched to custom settings and remain active"
+msgstr ""
+
 msgid "Integrations|Return to GitLab for Jira"
 msgstr ""
 
@@ -14617,12 +14635,18 @@ msgstr ""
 msgid "Integrations|Search Jira issues"
 msgstr ""
 
+msgid "Integrations|Some projects are using these settings as the default."
+msgstr ""
+
 msgid "Integrations|Standard"
 msgstr ""
 
 msgid "Integrations|To keep this project going, create a new issue."
 msgstr ""
 
+msgid "Integrations|Uninstall integration?"
+msgstr ""
+
 msgid "Integrations|Update your projects on Packagist, the main Composer repository"
 msgstr ""
 
diff --git a/spec/frontend/integrations/edit/store/state_spec.js b/spec/frontend/integrations/edit/store/state_spec.js
index fc193850a94cd1..2e9bfa0e097fd6 100644
--- a/spec/frontend/integrations/edit/store/state_spec.js
+++ b/spec/frontend/integrations/edit/store/state_spec.js
@@ -7,6 +7,7 @@ describe('Integration form state factory', () => {
       customState: {},
       isSaving: false,
       isTesting: false,
+      isUninstalling: false,
       override: false,
     });
   });
-- 
GitLab


From d4692c46b789e7db974b7dba682dd08774f2c04b Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Wed, 11 Nov 2020 14:37:02 +0700
Subject: [PATCH 4/7] Rename "uninstall" to "reset"

- Make the terminology and UX consistent
- Update buttons to default / warning variants to make
them less prominent.
- Remove radio button option since we will only support
1 option at the moment.
---
 .../edit/components/integration_form.vue      | 20 ++---
 .../components/reset_confirmation_modal.vue   | 61 +++++++++++++++
 .../uninstall_confirmation_modal.vue          | 75 -------------------
 .../integrations/edit/constants.js            | 15 ----
 .../integrations/edit/store/actions.js        |  4 +-
 .../integrations/edit/store/getters.js        |  2 +-
 .../integrations/edit/store/mutation_types.js |  2 +-
 .../integrations/edit/store/mutations.js      |  4 +-
 .../integrations/edit/store/state.js          |  2 +-
 locale/gitlab.pot                             | 27 +++----
 .../integrations/edit/store/state_spec.js     |  2 +-
 11 files changed, 88 insertions(+), 126 deletions(-)
 create mode 100644 app/assets/javascripts/integrations/edit/components/reset_confirmation_modal.vue
 delete mode 100644 app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue

diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index 7144b3ef7ff85c..a745c9d392a2de 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -12,7 +12,7 @@ import JiraIssuesFields from './jira_issues_fields.vue';
 import TriggerFields from './trigger_fields.vue';
 import DynamicField from './dynamic_field.vue';
 import ConfirmationModal from './confirmation_modal.vue';
-import UninstallConfirmationModal from './uninstall_confirmation_modal.vue';
+import ResetConfirmationModal from './reset_confirmation_modal.vue';
 
 export default {
   name: 'IntegrationForm',
@@ -24,7 +24,7 @@ export default {
     TriggerFields,
     DynamicField,
     ConfirmationModal,
-    UninstallConfirmationModal,
+    ResetConfirmationModal,
     GlButton,
   },
   directives: {
@@ -33,7 +33,7 @@ export default {
   mixins: [glFeatureFlagsMixin()],
   computed: {
     ...mapGetters(['currentKey', 'propsSource', 'isDisabled']),
-    ...mapState(['defaultState', 'override', 'isSaving', 'isTesting', 'isUninstalling']),
+    ...mapState(['defaultState', 'override', 'isSaving', 'isTesting', 'isResetting']),
     isEditable() {
       return this.propsSource.editable;
     },
@@ -51,7 +51,7 @@ export default {
     },
   },
   methods: {
-    ...mapActions(['setOverride', 'setIsSaving', 'setIsTesting', 'setIsUninstalling']),
+    ...mapActions(['setOverride', 'setIsSaving', 'setIsTesting', 'setIsResetting']),
     onSaveClick() {
       this.setIsSaving(true);
       eventHub.$emit('saveIntegration');
@@ -60,7 +60,7 @@ export default {
       this.setIsTesting(true);
       eventHub.$emit('testIntegration');
     },
-    onUninstallClick() {},
+    onResetClick() {},
   },
 };
 </script>
@@ -135,15 +135,15 @@ export default {
 
       <template v-if="isInstanceOrGroupLevel">
         <gl-button
-          v-gl-modal.confirmUninstallIntegration
+          v-gl-modal.confirmResetIntegration
           category="secondary"
-          variant="danger"
-          :loading="isUninstalling"
+          variant="default"
+          :loading="isResetting"
           :disabled="isDisabled"
         >
-          {{ __('Uninstall') }}
+          {{ __('Reset') }}
         </gl-button>
-        <uninstall-confirmation-modal @uninstall="onUninstallClick" />
+        <reset-confirmation-modal @reset="onResetClick" />
       </template>
 
       <gl-button class="btn-cancel" :href="propsSource.cancelPath">{{ __('Cancel') }}</gl-button>
diff --git a/app/assets/javascripts/integrations/edit/components/reset_confirmation_modal.vue b/app/assets/javascripts/integrations/edit/components/reset_confirmation_modal.vue
new file mode 100644
index 00000000000000..d850391056697d
--- /dev/null
+++ b/app/assets/javascripts/integrations/edit/components/reset_confirmation_modal.vue
@@ -0,0 +1,61 @@
+<script>
+import { mapGetters } from 'vuex';
+import { GlModal } from '@gitlab/ui';
+
+import { __ } from '~/locale';
+
+export default {
+  components: {
+    GlModal,
+  },
+  computed: {
+    ...mapGetters(['isDisabled']),
+    primaryProps() {
+      return {
+        text: __('Reset'),
+        attributes: [
+          { variant: 'warning' },
+          { category: 'primary' },
+          { disabled: this.isDisabled },
+        ],
+      };
+    },
+    cancelProps() {
+      return {
+        text: __('Cancel'),
+      };
+    },
+  },
+  methods: {
+    onReset() {
+      this.$emit('reset');
+    },
+  },
+};
+</script>
+
+<template>
+  <gl-modal
+    modal-id="confirmResetIntegration"
+    size="sm"
+    :title="s__('Integrations|Reset integration?')"
+    :action-primary="primaryProps"
+    :action-cancel="cancelProps"
+    @primary="onReset"
+  >
+    <p>
+      {{
+        s__(
+          'Integrations|Resetting this integration will clear the settings and deactivate this integration.',
+        )
+      }}
+    </p>
+    <p>
+      {{ s__('Integrations|All projects inheriting these settings will also be reset.') }}
+    </p>
+
+    <p class="gl-mb-0">
+      {{ s__('Integrations|Projects using custom settings will not be affected.') }}
+    </p>
+  </gl-modal>
+</template>
diff --git a/app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue b/app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue
deleted file mode 100644
index 7affc8845b7f54..00000000000000
--- a/app/assets/javascripts/integrations/edit/components/uninstall_confirmation_modal.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import { GlFormGroup, GlFormRadio, GlModal } from '@gitlab/ui';
-
-import { uninstallOptions } from '../constants';
-import { __ } from '~/locale';
-
-export default {
-  components: {
-    GlFormGroup,
-    GlFormRadio,
-    GlModal,
-  },
-  data() {
-    return {
-      uninstallAll: false,
-    };
-  },
-  computed: {
-    ...mapGetters(['isDisabled']),
-    primaryProps() {
-      return {
-        text: __('Uninstall'),
-        attributes: [{ variant: 'danger' }, { category: 'primary' }, { disabled: this.isDisabled }],
-      };
-    },
-    cancelProps() {
-      return {
-        text: __('Cancel'),
-      };
-    },
-  },
-  methods: {
-    onUninstall() {
-      this.$emit('uninstall', this.uninstallAll);
-    },
-  },
-  uninstallOptions,
-};
-</script>
-
-<template>
-  <gl-modal
-    modal-id="confirmUninstallIntegration"
-    size="sm"
-    :title="s__('Integrations|Uninstall integration?')"
-    :action-primary="primaryProps"
-    :action-cancel="cancelProps"
-    @primary="onUninstall"
-  >
-    <p>
-      {{ s__('Integrations|Some projects are using these settings as the default.') }}
-      <br />
-      {{ s__('Integrations|How do you want to apply the changes to these projects?') }}
-    </p>
-
-    <gl-form-group>
-      <gl-form-radio
-        v-for="uninstallOption in $options.uninstallOptions"
-        :key="uninstallOption.value"
-        v-model="uninstallAll"
-        :value="uninstallOption.value"
-      >
-        {{ uninstallOption.label }}
-        <template #help>
-          {{ uninstallOption.help }}
-        </template>
-      </gl-form-radio>
-    </gl-form-group>
-
-    <p class="gl-mb-0">
-      {{ s__('Integrations|Projects using custom settings will not be impacted.') }}
-    </p>
-  </gl-modal>
-</template>
diff --git a/app/assets/javascripts/integrations/edit/constants.js b/app/assets/javascripts/integrations/edit/constants.js
index 141e5b5c5cd4da..b74ae209eb7260 100644
--- a/app/assets/javascripts/integrations/edit/constants.js
+++ b/app/assets/javascripts/integrations/edit/constants.js
@@ -15,18 +15,3 @@ export const overrideDropdownDescriptions = {
     'Integrations|Default settings are inherited from the instance level.',
   ),
 };
-
-export const uninstallOptions = [
-  {
-    value: true,
-    label: s__('Integrations|Apply to all inheriting projects'),
-    help: s__(
-      'Integrations|All projects inheriting these settings will be cleared and deactivated',
-    ),
-  },
-  {
-    value: false,
-    label: s__('Integrations|Do not apply to all inheriting projects'),
-    help: s__('Integrations|Projects will be switched to custom settings and remain active'),
-  },
-];
diff --git a/app/assets/javascripts/integrations/edit/store/actions.js b/app/assets/javascripts/integrations/edit/store/actions.js
index a2e9da8d703c6c..097304be242886 100644
--- a/app/assets/javascripts/integrations/edit/store/actions.js
+++ b/app/assets/javascripts/integrations/edit/store/actions.js
@@ -3,5 +3,5 @@ import * as types from './mutation_types';
 export const setOverride = ({ commit }, override) => commit(types.SET_OVERRIDE, override);
 export const setIsSaving = ({ commit }, isSaving) => commit(types.SET_IS_SAVING, isSaving);
 export const setIsTesting = ({ commit }, isTesting) => commit(types.SET_IS_TESTING, isTesting);
-export const setIsUninstalling = ({ commit }, isUninstalling) =>
-  commit(types.SET_IS_UNINSTALLING, isUninstalling);
+export const setIsResetting = ({ commit }, isResetting) =>
+  commit(types.SET_IS_RESETTING, isResetting);
diff --git a/app/assets/javascripts/integrations/edit/store/getters.js b/app/assets/javascripts/integrations/edit/store/getters.js
index 6aadecaecf9f53..310d970c73ebaf 100644
--- a/app/assets/javascripts/integrations/edit/store/getters.js
+++ b/app/assets/javascripts/integrations/edit/store/getters.js
@@ -1,6 +1,6 @@
 export const isInheriting = state => (state.defaultState === null ? false : !state.override);
 
-export const isDisabled = state => state.isSaving || state.isTesting || state.isUninstalling;
+export const isDisabled = state => state.isSaving || state.isTesting || state.isResetting;
 
 export const propsSource = (state, getters) =>
   getters.isInheriting ? state.defaultState : state.customState;
diff --git a/app/assets/javascripts/integrations/edit/store/mutation_types.js b/app/assets/javascripts/integrations/edit/store/mutation_types.js
index 4d9cd12f14a2b0..2a84408f658534 100644
--- a/app/assets/javascripts/integrations/edit/store/mutation_types.js
+++ b/app/assets/javascripts/integrations/edit/store/mutation_types.js
@@ -1,4 +1,4 @@
 export const SET_OVERRIDE = 'SET_OVERRIDE';
 export const SET_IS_SAVING = 'SET_IS_SAVING';
 export const SET_IS_TESTING = 'SET_IS_TESTING';
-export const SET_IS_UNINSTALLING = 'SET_IS_UNINSTALLING';
+export const SET_IS_RESETTING = 'SET_IS_RESETTING';
diff --git a/app/assets/javascripts/integrations/edit/store/mutations.js b/app/assets/javascripts/integrations/edit/store/mutations.js
index 2e88a6469f1cee..07e3e25ccf0149 100644
--- a/app/assets/javascripts/integrations/edit/store/mutations.js
+++ b/app/assets/javascripts/integrations/edit/store/mutations.js
@@ -10,7 +10,7 @@ export default {
   [types.SET_IS_TESTING](state, isTesting) {
     state.isTesting = isTesting;
   },
-  [types.SET_IS_UNINSTALLING](state, isUninstalling) {
-    state.isUninstalling = isUninstalling;
+  [types.SET_IS_RESETTING](state, isResetting) {
+    state.isResetting = isResetting;
   },
 };
diff --git a/app/assets/javascripts/integrations/edit/store/state.js b/app/assets/javascripts/integrations/edit/store/state.js
index cb6cc4983c7ccc..aae3db1583fbae 100644
--- a/app/assets/javascripts/integrations/edit/store/state.js
+++ b/app/assets/javascripts/integrations/edit/store/state.js
@@ -7,6 +7,6 @@ export default ({ defaultState = null, customState = {} } = {}) => {
     customState,
     isSaving: false,
     isTesting: false,
-    isUninstalling: false,
+    isResetting: false,
   };
 };
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index 442322196eb8dd..697e92b7c689ab 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -14569,10 +14569,7 @@ msgstr ""
 msgid "Integrations|All details"
 msgstr ""
 
-msgid "Integrations|All projects inheriting these settings will be cleared and deactivated"
-msgstr ""
-
-msgid "Integrations|Apply to all inheriting projects"
+msgid "Integrations|All projects inheriting these settings will also be reset."
 msgstr ""
 
 msgid "Integrations|Comment detail:"
@@ -14596,15 +14593,9 @@ msgstr ""
 msgid "Integrations|Default settings are inherited from the instance level."
 msgstr ""
 
-msgid "Integrations|Do not apply to all inheriting projects"
-msgstr ""
-
 msgid "Integrations|Enable comments"
 msgstr ""
 
-msgid "Integrations|How do you want to apply the changes to these projects?"
-msgstr ""
-
 msgid "Integrations|Includes Standard plus entire commit message, commit hash, and issue IDs"
 msgstr ""
 
@@ -14614,13 +14605,16 @@ msgstr ""
 msgid "Integrations|Issues created in Jira are shown here once you have created the issues in project setup in Jira."
 msgstr ""
 
+msgid "Integrations|Projects using custom settings will not be affected."
+msgstr ""
+
 msgid "Integrations|Projects using custom settings will not be impacted unless the project owner chooses to use parent level defaults."
 msgstr ""
 
-msgid "Integrations|Projects using custom settings will not be impacted."
+msgid "Integrations|Reset integration?"
 msgstr ""
 
-msgid "Integrations|Projects will be switched to custom settings and remain active"
+msgid "Integrations|Resetting this integration will clear the settings and deactivate this integration."
 msgstr ""
 
 msgid "Integrations|Return to GitLab for Jira"
@@ -14635,18 +14629,12 @@ msgstr ""
 msgid "Integrations|Search Jira issues"
 msgstr ""
 
-msgid "Integrations|Some projects are using these settings as the default."
-msgstr ""
-
 msgid "Integrations|Standard"
 msgstr ""
 
 msgid "Integrations|To keep this project going, create a new issue."
 msgstr ""
 
-msgid "Integrations|Uninstall integration?"
-msgstr ""
-
 msgid "Integrations|Update your projects on Packagist, the main Composer repository"
 msgstr ""
 
@@ -23001,6 +22989,9 @@ msgstr ""
 msgid "Resend it"
 msgstr ""
 
+msgid "Reset"
+msgstr ""
+
 msgid "Reset authorization key"
 msgstr ""
 
diff --git a/spec/frontend/integrations/edit/store/state_spec.js b/spec/frontend/integrations/edit/store/state_spec.js
index 2e9bfa0e097fd6..4d0f4a1da717d4 100644
--- a/spec/frontend/integrations/edit/store/state_spec.js
+++ b/spec/frontend/integrations/edit/store/state_spec.js
@@ -7,7 +7,7 @@ describe('Integration form state factory', () => {
       customState: {},
       isSaving: false,
       isTesting: false,
-      isUninstalling: false,
+      isResetting: false,
       override: false,
     });
   });
-- 
GitLab


From 29dabb43778e8d85ad895082786683a16195efd3 Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Wed, 11 Nov 2020 14:46:58 +0700
Subject: [PATCH 5/7] Add condition to temporarily hide reset

We should only show the reset button if it's passed from
the backend. This should happen slightly later in
another MR.
---
 .../integrations/edit/components/integration_form.vue        | 5 ++++-
 app/assets/javascripts/integrations/edit/index.js            | 2 ++
 app/helpers/services_helper.rb                               | 3 ++-
 3 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index a745c9d392a2de..d60fbeed1884c1 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -49,6 +49,9 @@ export default {
     showJiraIssuesFields() {
       return this.isJira && this.glFeatures.jiraIssuesIntegration;
     },
+    showReset() {
+      return this.isInstanceOrGroupLevel && this.propsSource.resetPath;
+    },
   },
   methods: {
     ...mapActions(['setOverride', 'setIsSaving', 'setIsTesting', 'setIsResetting']),
@@ -133,7 +136,7 @@ export default {
         {{ __('Test settings') }}
       </gl-button>
 
-      <template v-if="isInstanceOrGroupLevel">
+      <template v-if="showReset">
         <gl-button
           v-gl-modal.confirmResetIntegration
           category="secondary"
diff --git a/app/assets/javascripts/integrations/edit/index.js b/app/assets/javascripts/integrations/edit/index.js
index 248ee62d43a2f7..95a53f1beab163 100644
--- a/app/assets/javascripts/integrations/edit/index.js
+++ b/app/assets/javascripts/integrations/edit/index.js
@@ -26,6 +26,7 @@ function parseDatasetToProps(data) {
     integrationLevel,
     cancelPath,
     testPath,
+    resetPath,
     ...booleanAttributes
   } = data;
   const {
@@ -49,6 +50,7 @@ function parseDatasetToProps(data) {
     editable,
     canTest,
     testPath,
+    resetPath,
     triggerFieldsProps: {
       initialTriggerCommit: commitEvents,
       initialTriggerMergeRequest: mergeRequestEvents,
diff --git a/app/helpers/services_helper.rb b/app/helpers/services_helper.rb
index 1ca2c9a5cd3a1c..9eba9cf89fd22d 100644
--- a/app/helpers/services_helper.rb
+++ b/app/helpers/services_helper.rb
@@ -93,7 +93,8 @@ def integration_form_data(integration)
       editable: integration.editable?.to_s,
       cancel_path: scoped_integrations_path,
       can_test: integration.can_test?.to_s,
-      test_path: scoped_test_integration_path(integration)
+      test_path: scoped_test_integration_path(integration),
+      reset_path: ''
     }
   end
 
-- 
GitLab


From 62433e9f8b72e1944b7a175910203e42d9f9c4d2 Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Fri, 13 Nov 2020 11:40:54 +0700
Subject: [PATCH 6/7] Add extra specs around reset functionality

Also add missing specs for mutations / actions of
related code.
---
 .../edit/components/integration_form.vue      |  1 +
 .../edit/components/integration_form_spec.js  | 59 +++++++++++++++++++
 .../integrations/edit/store/actions_spec.js   | 27 ++++++++-
 .../integrations/edit/store/getters_spec.js   | 30 +++++++++-
 .../integrations/edit/store/mutations_spec.js | 24 ++++++++
 5 files changed, 139 insertions(+), 2 deletions(-)

diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index d60fbeed1884c1..bbfa865905aec1 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -143,6 +143,7 @@ export default {
           variant="default"
           :loading="isResetting"
           :disabled="isDisabled"
+          data-testid="reset-button"
         >
           {{ __('Reset') }}
         </gl-button>
diff --git a/spec/frontend/integrations/edit/components/integration_form_spec.js b/spec/frontend/integrations/edit/components/integration_form_spec.js
index 4dd38c959f8ce5..97e77ac87abcb5 100644
--- a/spec/frontend/integrations/edit/components/integration_form_spec.js
+++ b/spec/frontend/integrations/edit/components/integration_form_spec.js
@@ -5,6 +5,7 @@ import IntegrationForm from '~/integrations/edit/components/integration_form.vue
 import OverrideDropdown from '~/integrations/edit/components/override_dropdown.vue';
 import ActiveCheckbox from '~/integrations/edit/components/active_checkbox.vue';
 import ConfirmationModal from '~/integrations/edit/components/confirmation_modal.vue';
+import ResetConfirmationModal from '~/integrations/edit/components/reset_confirmation_modal.vue';
 import JiraTriggerFields from '~/integrations/edit/components/jira_trigger_fields.vue';
 import JiraIssuesFields from '~/integrations/edit/components/jira_issues_fields.vue';
 import TriggerFields from '~/integrations/edit/components/trigger_fields.vue';
@@ -44,6 +45,8 @@ describe('IntegrationForm', () => {
   const findOverrideDropdown = () => wrapper.find(OverrideDropdown);
   const findActiveCheckbox = () => wrapper.find(ActiveCheckbox);
   const findConfirmationModal = () => wrapper.find(ConfirmationModal);
+  const findResetConfirmationModal = () => wrapper.find(ResetConfirmationModal);
+  const findResetButton = () => wrapper.find('[data-testid="reset-button"]');
   const findJiraTriggerFields = () => wrapper.find(JiraTriggerFields);
   const findJiraIssuesFields = () => wrapper.find(JiraIssuesFields);
   const findTriggerFields = () => wrapper.find(TriggerFields);
@@ -75,6 +78,29 @@ describe('IntegrationForm', () => {
 
         expect(findConfirmationModal().exists()).toBe(true);
       });
+
+      describe('resetPath is empty', () => {
+        it('does not render ResetConfirmationModal and button', () => {
+          createComponent({
+            integrationLevel: integrationLevels.INSTANCE,
+          });
+
+          expect(findResetButton().exists()).toBe(false);
+          expect(findResetConfirmationModal().exists()).toBe(false);
+        });
+      });
+
+      describe('resetPath is present', () => {
+        it('renders ResetConfirmationModal and button', () => {
+          createComponent({
+            integrationLevel: integrationLevels.INSTANCE,
+            resetPath: 'resetPath',
+          });
+
+          expect(findResetButton().exists()).toBe(true);
+          expect(findResetConfirmationModal().exists()).toBe(true);
+        });
+      });
     });
 
     describe('integrationLevel is group', () => {
@@ -85,6 +111,29 @@ describe('IntegrationForm', () => {
 
         expect(findConfirmationModal().exists()).toBe(true);
       });
+
+      describe('resetPath is empty', () => {
+        it('does not render ResetConfirmationModal and button', () => {
+          createComponent({
+            integrationLevel: integrationLevels.GROUP,
+          });
+
+          expect(findResetButton().exists()).toBe(false);
+          expect(findResetConfirmationModal().exists()).toBe(false);
+        });
+      });
+
+      describe('resetPath is present', () => {
+        it('renders ResetConfirmationModal and button', () => {
+          createComponent({
+            integrationLevel: integrationLevels.GROUP,
+            resetPath: 'resetPath',
+          });
+
+          expect(findResetButton().exists()).toBe(true);
+          expect(findResetConfirmationModal().exists()).toBe(true);
+        });
+      });
     });
 
     describe('integrationLevel is project', () => {
@@ -95,6 +144,16 @@ describe('IntegrationForm', () => {
 
         expect(findConfirmationModal().exists()).toBe(false);
       });
+
+      it('does not render ResetConfirmationModal and button', () => {
+        createComponent({
+          integrationLevel: 'project',
+          resetPath: 'resetPath',
+        });
+
+        expect(findResetButton().exists()).toBe(false);
+        expect(findResetConfirmationModal().exists()).toBe(false);
+      });
     });
 
     describe('type is "slack"', () => {
diff --git a/spec/frontend/integrations/edit/store/actions_spec.js b/spec/frontend/integrations/edit/store/actions_spec.js
index 5356c0a411b0ca..5b5c8d6f76ee44 100644
--- a/spec/frontend/integrations/edit/store/actions_spec.js
+++ b/spec/frontend/integrations/edit/store/actions_spec.js
@@ -1,6 +1,11 @@
 import testAction from 'helpers/vuex_action_helper';
 import createState from '~/integrations/edit/store/state';
-import { setOverride } from '~/integrations/edit/store/actions';
+import {
+  setOverride,
+  setIsSaving,
+  setIsTesting,
+  setIsResetting,
+} from '~/integrations/edit/store/actions';
 import * as types from '~/integrations/edit/store/mutation_types';
 
 describe('Integration form store actions', () => {
@@ -15,4 +20,24 @@ describe('Integration form store actions', () => {
       return testAction(setOverride, true, state, [{ type: types.SET_OVERRIDE, payload: true }]);
     });
   });
+
+  describe('setIsSaving', () => {
+    it('should commit isSaving mutation', () => {
+      return testAction(setIsSaving, true, state, [{ type: types.SET_IS_SAVING, payload: true }]);
+    });
+  });
+
+  describe('setIsTesting', () => {
+    it('should commit isTesting mutation', () => {
+      return testAction(setIsTesting, true, state, [{ type: types.SET_IS_TESTING, payload: true }]);
+    });
+  });
+
+  describe('setIsResetting', () => {
+    it('should commit isResetting mutation', () => {
+      return testAction(setIsResetting, true, state, [
+        { type: types.SET_IS_RESETTING, payload: true },
+      ]);
+    });
+  });
 });
diff --git a/spec/frontend/integrations/edit/store/getters_spec.js b/spec/frontend/integrations/edit/store/getters_spec.js
index 3353e0c84cc19c..0e7f9bac07b8ad 100644
--- a/spec/frontend/integrations/edit/store/getters_spec.js
+++ b/spec/frontend/integrations/edit/store/getters_spec.js
@@ -1,4 +1,9 @@
-import { currentKey, isInheriting, propsSource } from '~/integrations/edit/store/getters';
+import {
+  currentKey,
+  isInheriting,
+  isDisabled,
+  propsSource,
+} from '~/integrations/edit/store/getters';
 import createState from '~/integrations/edit/store/state';
 import { mockIntegrationProps } from '../mock_data';
 
@@ -45,6 +50,29 @@ describe('Integration form store getters', () => {
     });
   });
 
+  describe('isDisabled', () => {
+    it.each`
+      isSaving | isTesting | isResetting | expected
+      ${false} | ${false}  | ${false}    | ${false}
+      ${true}  | ${false}  | ${false}    | ${true}
+      ${false} | ${true}   | ${false}    | ${true}
+      ${false} | ${false}  | ${true}     | ${true}
+      ${false} | ${true}   | ${true}     | ${true}
+      ${true}  | ${false}  | ${true}     | ${true}
+      ${true}  | ${true}   | ${false}    | ${true}
+      ${true}  | ${true}   | ${true}     | ${true}
+    `(
+      'when isSaving = $isSaving, isTesting = $isTesting, isResetting = $isResetting then isDisabled = $expected',
+      ({ isSaving, isTesting, isResetting, expected }) => {
+        state.isSaving = isSaving;
+        state.isTesting = isTesting;
+        state.isResetting = isResetting;
+
+        expect(isDisabled(state)).toBe(expected);
+      },
+    );
+  });
+
   describe('propsSource', () => {
     beforeEach(() => {
       state.defaultState = defaultState;
diff --git a/spec/frontend/integrations/edit/store/mutations_spec.js b/spec/frontend/integrations/edit/store/mutations_spec.js
index 4b733726d44a5d..4707b4b37144f2 100644
--- a/spec/frontend/integrations/edit/store/mutations_spec.js
+++ b/spec/frontend/integrations/edit/store/mutations_spec.js
@@ -16,4 +16,28 @@ describe('Integration form store mutations', () => {
       expect(state.override).toBe(true);
     });
   });
+
+  describe(`${types.SET_IS_SAVING}`, () => {
+    it('sets isSaving', () => {
+      mutations[types.SET_IS_SAVING](state, true);
+
+      expect(state.isSaving).toBe(true);
+    });
+  });
+
+  describe(`${types.SET_IS_TESTING}`, () => {
+    it('sets isTesting', () => {
+      mutations[types.SET_IS_TESTING](state, true);
+
+      expect(state.isTesting).toBe(true);
+    });
+  });
+
+  describe(`${types.SET_IS_RESETTING}`, () => {
+    it('sets isResetting', () => {
+      mutations[types.SET_IS_RESETTING](state, true);
+
+      expect(state.isResetting).toBe(true);
+    });
+  });
 });
-- 
GitLab


From 0a804da14efe7a8b464fe91acb87e1b9dd77b8f2 Mon Sep 17 00:00:00 2001
From: Justin Ho <hduong@gitlab.com>
Date: Mon, 16 Nov 2020 18:17:44 +0700
Subject: [PATCH 7/7] Use mutations instead of editing state directly

---
 spec/frontend/integrations/edit/store/getters_spec.js | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/spec/frontend/integrations/edit/store/getters_spec.js b/spec/frontend/integrations/edit/store/getters_spec.js
index 0e7f9bac07b8ad..7d4532a10598d7 100644
--- a/spec/frontend/integrations/edit/store/getters_spec.js
+++ b/spec/frontend/integrations/edit/store/getters_spec.js
@@ -5,6 +5,8 @@ import {
   propsSource,
 } from '~/integrations/edit/store/getters';
 import createState from '~/integrations/edit/store/state';
+import mutations from '~/integrations/edit/store/mutations';
+import * as types from '~/integrations/edit/store/mutation_types';
 import { mockIntegrationProps } from '../mock_data';
 
 describe('Integration form store getters', () => {
@@ -64,9 +66,9 @@ describe('Integration form store getters', () => {
     `(
       'when isSaving = $isSaving, isTesting = $isTesting, isResetting = $isResetting then isDisabled = $expected',
       ({ isSaving, isTesting, isResetting, expected }) => {
-        state.isSaving = isSaving;
-        state.isTesting = isTesting;
-        state.isResetting = isResetting;
+        mutations[types.SET_IS_SAVING](state, isSaving);
+        mutations[types.SET_IS_TESTING](state, isTesting);
+        mutations[types.SET_IS_RESETTING](state, isResetting);
 
         expect(isDisabled(state)).toBe(expected);
       },
-- 
GitLab