Add latest changes from gitlab-org/gitlab@master

4 files changed, 26 insertions, 12 deletions

diff --git a/app/assets/javascripts/alert_management/components/alert_details.vue b/app/assets/javascripts/alert_management/components/alert_details.vue
index 072ed2fa663..72dc56facd2 100644
--- a/app/assets/javascripts/alert_management/components/alert_details.vue
+++ b/app/assets/javascripts/alert_management/components/alert_details.vue
@@ -1,5 +1,4 @@
 <script>
-import * as Sentry from '@sentry/browser';
 import {
   GlAlert,
   GlBadge,
@@ -12,6 +11,7 @@ import {
   GlButton,
   GlSafeHtmlDirective,
 } from '@gitlab/ui';
+import * as Sentry from '~/sentry/wrapper';
 import { s__ } from '~/locale';
 import alertQuery from '../graphql/queries/details.query.graphql';
 import sidebarStatusQuery from '../graphql/queries/sidebar_status.query.graphql';
@@ -30,6 +30,7 @@ import AlertSidebar from './alert_sidebar.vue';
 import AlertMetrics from './alert_metrics.vue';
 import AlertDetailsTable from '~/vue_shared/components/alert_details_table.vue';
 import AlertSummaryRow from './alert_summary_row.vue';
+import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin';
 
 const containerEl = document.querySelector('.page-with-contextual-sidebar');
 
@@ -76,6 +77,7 @@ export default {
     SystemNote,
     AlertMetrics,
   },
+  mixins: [glFeatureFlagsMixin()],
   inject: {
     projectPath: {
       default: '',
@@ -147,6 +149,15 @@ export default {
         this.$router.replace({ name: 'tab', params: { tabId } });
       },
     },
+    environmentName() {
+      return this.shouldDisplayEnvironment && this.alert?.environment?.name;
+    },
+    environmentPath() {
+      return this.shouldDisplayEnvironment && this.alert?.environment?.path;
+    },
+    shouldDisplayEnvironment() {
+      return this.glFeatures.exposeEnvironmentPathInAlertDetails;
+    },
   },
   mounted() {
     this.trackPageViews();
@@ -299,19 +310,18 @@ export default {
             </span>
           </alert-summary-row>
           <alert-summary-row
-            v-if="alert.environment"
+            v-if="environmentName"
             :label="`${s__('AlertManagement|Environment')}:`"
           >
             <gl-link
-              v-if="alert.environmentUrl"
+              v-if="environmentPath"
               class="gl-display-inline-block"
-              data-testid="environmentUrl"
-              :href="alert.environmentUrl"
-              target="_blank"
+              data-testid="environmentPath"
+              :href="environmentPath"
             >
-              {{ alert.environment }}
+              {{ environmentName }}
             </gl-link>
-            <span v-else data-testid="environment">{{ alert.environment }}</span>
+            <span v-else data-testid="environmentName">{{ environmentName }}</span>
           </alert-summary-row>
           <alert-summary-row
             v-if="alert.startedAt"
diff --git a/app/assets/javascripts/alert_management/components/alert_metrics.vue b/app/assets/javascripts/alert_management/components/alert_metrics.vue
index c5b40edc672..8a6490ecd5c 100644
--- a/app/assets/javascripts/alert_management/components/alert_metrics.vue
+++ b/app/assets/javascripts/alert_management/components/alert_metrics.vue
@@ -1,7 +1,7 @@
 <script>
 import Vue from 'vue';
 import Vuex from 'vuex';
-import * as Sentry from '@sentry/browser';
+import * as Sentry from '~/sentry/wrapper';
 
 Vue.use(Vuex);
 
diff --git a/app/assets/javascripts/alert_management/details.js b/app/assets/javascripts/alert_management/details.js
index c2020dfcbe3..cbbdecae390 100644
--- a/app/assets/javascripts/alert_management/details.js
+++ b/app/assets/javascripts/alert_management/details.js
@@ -1,11 +1,11 @@
+import { defaultDataIdFromObject } from 'apollo-cache-inmemory';
+import produce from 'immer';
 import Vue from 'vue';
 import VueApollo from 'vue-apollo';
-import produce from 'immer';
-import { defaultDataIdFromObject } from 'apollo-cache-inmemory';
 import createDefaultClient from '~/lib/graphql';
-import createRouter from './router';
 import AlertDetails from './components/alert_details.vue';
 import sidebarStatusQuery from './graphql/queries/sidebar_status.query.graphql';
+import createRouter from './router';
 
 Vue.use(VueApollo);
 
diff --git a/app/assets/javascripts/alert_management/graphql/fragments/detail_item.fragment.graphql b/app/assets/javascripts/alert_management/graphql/fragments/detail_item.fragment.graphql
index 00286ec9096..406dfe97ce0 100644
--- a/app/assets/javascripts/alert_management/graphql/fragments/detail_item.fragment.graphql
+++ b/app/assets/javascripts/alert_management/graphql/fragments/detail_item.fragment.graphql
@@ -11,6 +11,10 @@ fragment AlertDetailItem on AlertManagementAlert {
   updatedAt
   endedAt
   hosts
+  environment {
+    name
+    path
+  }
   details
   runbook
   todos {