Add latest changes from gitlab-org/gitlab@master

3 files changed, 22 insertions, 6 deletions

diff --git a/app/assets/javascripts/integrations/edit/components/dynamic_field.vue b/app/assets/javascripts/integrations/edit/components/dynamic_field.vue
index 4260a224ca8..904e5639cac 100644
--- a/app/assets/javascripts/integrations/edit/components/dynamic_field.vue
+++ b/app/assets/javascripts/integrations/edit/components/dynamic_field.vue
@@ -74,7 +74,7 @@ export default {
     };
   },
   computed: {
-    ...mapGetters(['isInheriting']),
+    ...mapGetters(['isInheriting', 'propsSource']),
     isCheckbox() {
       return this.type === 'checkbox';
     },
@@ -116,11 +116,18 @@ export default {
         name: this.fieldName,
         state: this.valid,
         readonly: this.isInheriting,
+        disabled: this.isDisabled,
       };
     },
     valid() {
       return !this.required || !isEmpty(this.model) || this.isNonEmptyPassword || !this.isValidated;
     },
+    isInheritingOrDisabled() {
+      return this.isInheriting || this.isDisabled;
+    },
+    isDisabled() {
+      return !this.propsSource.editable;
+    },
   },
   created() {
     if (this.isNonEmptyPassword) {
@@ -143,7 +150,7 @@ export default {
 
     <template v-if="isCheckbox">
       <input :name="fieldName" type="hidden" :value="model || false" />
-      <gl-form-checkbox :id="fieldId" v-model="model" :disabled="isInheriting">
+      <gl-form-checkbox :id="fieldId" v-model="model" :disabled="isInheritingOrDisabled">
         {{ checkboxLabel || humanizedTitle }}
         <template #help>
           <span v-safe-html="help"></span>
@@ -152,7 +159,12 @@ export default {
     </template>
     <template v-else-if="isSelect">
       <input type="hidden" :name="fieldName" :value="model" />
-      <gl-form-select :id="fieldId" v-model="model" :options="options" :disabled="isInheriting" />
+      <gl-form-select
+        :id="fieldId"
+        v-model="model"
+        :options="options"
+        :disabled="isInheritingOrDisabled"
+      />
     </template>
     <gl-form-textarea
       v-else-if="isTextarea"
diff --git a/app/assets/javascripts/integrations/edit/components/integration_form.vue b/app/assets/javascripts/integrations/edit/components/integration_form.vue
index 3471c1746a9..a9cb569d823 100644
--- a/app/assets/javascripts/integrations/edit/components/integration_form.vue
+++ b/app/assets/javascripts/integrations/edit/components/integration_form.vue
@@ -229,7 +229,10 @@ export default {
   billingPlanNames,
   slackUpgradeInfo: {
     title: s__(
-      `SlackIntegration|Notifications only work if you're on the latest version of the GitLab for Slack app`,
+      `SlackIntegration|Update to the latest version of GitLab for Slack to get notifications`,
+    ),
+    text: s__(
+      `SlackIntegration|Update to the latest version to receive notifications from GitLab.`,
     ),
     btnText: s__('SlackIntegration|Update to the latest version'),
   },
@@ -290,11 +293,11 @@ export default {
       <gl-alert
         :dismissible="false"
         :title="$options.slackUpgradeInfo.title"
-        variant="warning"
         :primary-button-link="customState.upgradeSlackUrl"
         :primary-button-text="$options.slackUpgradeInfo.btnText"
         class="gl-mb-8 gl-mt-5"
-      />
+        >{{ $options.slackUpgradeInfo.text }}</gl-alert
+      >
     </div>
 
     <template v-if="hasSections">
diff --git a/app/assets/javascripts/integrations/edit/index.js b/app/assets/javascripts/integrations/edit/index.js
index f15ad5e052e..b53bcd50f16 100644
--- a/app/assets/javascripts/integrations/edit/index.js
+++ b/app/assets/javascripts/integrations/edit/index.js
@@ -108,6 +108,7 @@ export default function initIntegrationSettingsForm() {
   const initialState = {
     defaultState: null,
     customState: customSettingsProps,
+    editable: customSettingsProps.editable && !customSettingsProps.shouldUpgradeSlack,
   };
   if (defaultSettingsEl) {
     initialState.defaultState = Object.freeze(parseDatasetToProps(defaultSettingsEl.dataset));