Add latest changes from gitlab-org/gitlab@15-6-stable-eev15.6.0-rc42

3 files changed, 34 insertions, 6 deletions

diff --git a/app/assets/javascripts/vue_shared/alert_details/components/alert_details.vue b/app/assets/javascripts/vue_shared/alert_details/components/alert_details.vue
index f2ea55df63d..96c2ffa929c 100644
--- a/app/assets/javascripts/vue_shared/alert_details/components/alert_details.vue
+++ b/app/assets/javascripts/vue_shared/alert_details/components/alert_details.vue
@@ -145,11 +145,14 @@ export default {
     },
     currentTabIndex: {
       get() {
-        return this.$options.tabsConfig.findIndex((tab) => tab.id === this.activeTab);
+        const tabIndex = this.$options.tabsConfig.findIndex((tab) => tab.id === this.activeTab);
+        return tabIndex >= 0 ? tabIndex : 0;
       },
       set(tabIdx) {
         const tabId = this.$options.tabsConfig[tabIdx].id;
-        this.$router.replace({ name: 'tab', params: { tabId } });
+        if (this.$route.params?.tabId !== tabId) {
+          this.$router.push({ name: 'tab', params: { tabId } });
+        }
       },
     },
     environmentName() {
diff --git a/app/assets/javascripts/vue_shared/alert_details/index.js b/app/assets/javascripts/vue_shared/alert_details/index.js
index 5793069440c..357dfa49901 100644
--- a/app/assets/javascripts/vue_shared/alert_details/index.js
+++ b/app/assets/javascripts/vue_shared/alert_details/index.js
@@ -15,9 +15,17 @@ Vue.use(VueApollo);
 
 export default (selector) => {
   const domEl = document.querySelector(selector);
-  const { alertId, projectPath, projectIssuesPath, projectId, page, canUpdate } = domEl.dataset;
+  const {
+    alertId,
+    projectPath,
+    projectIssuesPath,
+    projectAlertManagementDetailsPath,
+    projectId,
+    page,
+    canUpdate,
+  } = domEl.dataset;
   const iid = alertId;
-  const router = createRouter();
+  const router = createRouter(projectAlertManagementDetailsPath);
 
   const resolvers = {
     Mutation: {
diff --git a/app/assets/javascripts/vue_shared/alert_details/router.js b/app/assets/javascripts/vue_shared/alert_details/router.js
index 5687fe4e0f5..26477a3a66a 100644
--- a/app/assets/javascripts/vue_shared/alert_details/router.js
+++ b/app/assets/javascripts/vue_shared/alert_details/router.js
@@ -5,9 +5,26 @@ import { joinPaths } from '~/lib/utils/url_utility';
 Vue.use(VueRouter);
 
 export default function createRouter(base) {
-  return new VueRouter({
-    mode: 'hash',
+  const router = new VueRouter({
+    mode: 'history',
     base: joinPaths(gon.relative_url_root || '', base),
     routes: [{ path: '/:tabId', name: 'tab' }],
   });
+
+  /* 
+    Backward-compatible behavior. Redirects hash mode URLs to history mode ones.
+    Ex: from #/overview to /overview
+        from #/metrics to /metrics
+        from #/activity to /activity
+  */
+  router.beforeEach((to, _, next) => {
+    if (to.hash.startsWith('#/')) {
+      const path = to.fullPath.substring(2);
+      next(path);
+    } else {
+      next();
+    }
+  });
+
+  return router;
 }