Enable Alerts dropdown in Operations Settings

We are removing the feature flag
`:alert_integrations_dropdown` in backend and frontend.

app/assets/javascripts/alerts_settings/components/alerts_settings_form.vue

@@ -14,7 +14,6 @@ import {
   GlFormSelect,
 } from '@gitlab/ui';
 import { debounce } from 'lodash';
-import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
 import ToggleButton from '~/vue_shared/components/toggle_button.vue';
 import csrf from '~/lib/utils/csrf';
@@ -42,7 +41,6 @@ export default {
   directives: {
     'gl-modal': GlModalDirective,
   },
-  mixins: [glFeatureFlagsMixin()],
   props: {
     prometheus: {
       type: Object,
@@ -129,7 +127,7 @@ export default {
       return !this.isGeneric ? this.$options.i18n.prometheusInfo : '';
     },
     prometheusFeatureEnabled() {
-      return !this.isGeneric && this.glFeatures.alertIntegrationsDropdown;
+      return !this.isGeneric;
     },
     jsonIsValid() {
       return this.testAlert.error === null;
@@ -147,13 +145,9 @@ export default {
     }, JSON_VALIDATE_DELAY),
   },
   created() {
-    if (this.glFeatures.alertIntegrationsDropdown) {
     this.selectedEndpoint = this.prometheus.prometheusIsActivated
       ? this.options[1].value
       : this.options[0].value;
-    } else {
-      this.selectedEndpoint = this.options[0].value;
-    }
   },
   methods: {
     clearJson() {
@@ -187,9 +181,6 @@ export default {
     },
     toggleService(value) {
       this.canSaveForm = true;
-      if (!this.glFeatures.alertIntegrationsDropdown) {
-        this.toggleActivated(value);
-      }
 
       if (this.isGeneric) {
         this.activated.generic = value;
@@ -334,7 +325,6 @@ export default {
     </div>
     <gl-form @submit.prevent="onSubmit" @reset.prevent="onReset">
       <gl-form-group
-        v-if="glFeatures.alertIntegrationsDropdown"
         :label="$options.i18n.integrationsLabel"
         label-for="integrations"
         label-class="label-bold"
@@ -433,7 +423,6 @@ export default {
         </gl-modal>
       </gl-form-group>
       <gl-form-group
-        v-if="glFeatures.alertIntegrationsDropdown"
         :label="$options.i18n.alertJson"
         label-for="alert-json"
         label-class="label-bold"
@@ -452,10 +441,7 @@ export default {
       <gl-button :disabled="!canTestAlert" @click="validateTestAlert">{{
         $options.i18n.testAlertInfo
       }}</gl-button>
-      <div
-        v-if="glFeatures.alertIntegrationsDropdown"
-        class="footer-block row-content-block gl-display-flex gl-justify-content-space-between"
-      >
+      <div class="footer-block row-content-block gl-display-flex gl-justify-content-space-between">
         <gl-button type="submit" variant="success" category="primary" :disabled="!canSaveConfig">
           {{ __('Save changes') }}
         </gl-button>

app/controllers/projects/settings/operations_controller.rb

@@ -5,10 +5,6 @@ module Projects
     class OperationsController < Projects::ApplicationController
       before_action :authorize_admin_operations!
       before_action :authorize_read_prometheus_alerts!, only: [:reset_alerting_token]
-      before_action do
-        push_frontend_feature_flag(:alert_integrations_dropdown, project)
-      end
-
       respond_to :json, only: [:reset_alerting_token]
 
       helper_method :error_tracking_setting

app/views/projects/services/prometheus/_external_alerts.html.haml

@@ -5,4 +5,4 @@
 - authorization_key = @project.alerting_setting.try(:token)
 - learn_more_url = help_page_path('user/project/integrations/prometheus', anchor: 'external-prometheus-instances')
 
-#js-settings-prometheus-alerts{ data: { notify_url: notify_url, authorization_key: authorization_key, change_key_url: reset_alerting_token_project_settings_operations_path(@project), learn_more_url: learn_more_url, disabled: Feature.enabled?(:alert_integrations_dropdown, @service.project) && @service.manual_configuration? } }
+#js-settings-prometheus-alerts{ data: { notify_url: notify_url, authorization_key: authorization_key, change_key_url: reset_alerting_token_project_settings_operations_path(@project), learn_more_url: learn_more_url, disabled: true } }

app/views/projects/services/prometheus/_top.html.haml

-- return unless Feature.enabled?(:alert_integrations_dropdown, @service.project) && @service.manual_configuration?
+- return unless @service.manual_configuration?
 
 .row
   .col-lg-12

changelogs/unreleased/pl-remove-feature-flag-alert-integration-dropdown.yml

+---
+title: Enable Alerts dropdown in Operations Settings
+merge_request: 36296
+author:
+type: added

spec/frontend/alert_settings/__snapshots__/alert_settings_form_spec.js.snap

@@ -12,7 +12,9 @@ exports[`AlertsSettingsForm with default values renders the initial template 1`]
     </p>
   </div>
   <gl-form-stub>
-    <!---->
+    <gl-form-group-stub label=\\"Integrations\\" label-for=\\"integrations\\" label-class=\\"label-bold\\">
+      <gl-form-select-stub options=\\"[object Object],[object Object]\\" data-testid=\\"alert-settings-select\\" value=\\"generic\\"></gl-form-select-stub> <span class=\\"gl-text-gray-400\\"><gl-sprintf-stub message=\\"Learn more about our %{linkStart}upcoming integrations%{linkEnd}\\"></gl-sprintf-stub></span>
+    </gl-form-group-stub>
     <gl-form-group-stub label=\\"Active\\" label-for=\\"activated\\" label-class=\\"label-bold\\">
       <toggle-button-stub id=\\"activated\\"></toggle-button-stub>
     </gl-form-group-stub>
@@ -29,9 +31,18 @@ exports[`AlertsSettingsForm with default values renders the initial template 1`]
         Resetting the authorization key for this project will require updating the authorization key in every alert source it is enabled in.
       </gl-modal-stub>
     </gl-form-group-stub>
-    <!---->
+    <gl-form-group-stub label=\\"Alert test payload\\" label-for=\\"alert-json\\" label-class=\\"label-bold\\">
+      <gl-form-textarea-stub noresize=\\"true\\" id=\\"alert-json\\" disabled=\\"true\\" state=\\"true\\" placeholder=\\"Enter test alert JSON....\\" rows=\\"6\\" max-rows=\\"10\\"></gl-form-textarea-stub>
+    </gl-form-group-stub>
     <gl-button-stub category=\\"tertiary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" disabled=\\"true\\">Test alert payload</gl-button-stub>
-    <!---->
+    <div class=\\"footer-block row-content-block gl-display-flex gl-justify-content-space-between\\">
+      <gl-button-stub category=\\"primary\\" variant=\\"success\\" size=\\"medium\\" icon=\\"\\" disabled=\\"true\\" type=\\"submit\\">
+        Save changes
+      </gl-button-stub>
+      <gl-button-stub category=\\"primary\\" variant=\\"default\\" size=\\"medium\\" icon=\\"\\" type=\\"reset\\">
+        Cancel
+      </gl-button-stub>
+    </div>
   </gl-form-stub>
 </div>"
 `;

spec/frontend/alert_settings/alert_settings_form_spec.js

@@ -32,12 +32,7 @@ describe('AlertsSettingsForm', () => {
   let wrapper;
   let mockAxios;
 
-  const createComponent = (
-    props = defaultProps,
-    { methods } = {},
-    alertIntegrationsDropdown = false,
-    data,
-  ) => {
+  const createComponent = (props = defaultProps, { methods } = {}, data) => {
     wrapper = shallowMount(AlertsSettingsForm, {
       data() {
         return { ...data };
@@ -47,11 +42,6 @@ describe('AlertsSettingsForm', () => {
         ...props,
       },
       methods,
-      provide: {
-        glFeatures: {
-          alertIntegrationsDropdown,
-        },
-      },
     });
   };