Merge branch 'jl-iteration-link-sidebar-fix' into 'master'

Add iteration link to issue sidebar

Closes #232731

See merge request gitlab-org/gitlab!38110

ee/app/assets/javascripts/sidebar/components/iteration_select.vue

@@ -91,8 +91,13 @@ export default {
   },
   computed: {
     iteration() {
-      // NOTE: Optional chaining guards when search result is empty
-      return this.iterations.find(({ id }) => id === this.currentIteration)?.title;
+      return this.iterations.find(({ id }) => id === this.currentIteration);
+    },
+    iterationTitle() {
+      return this.iteration?.title;
+    },
+    iterationUrl() {
+      return this.iteration?.webUrl;
     },
     showNoIterationContent() {
       return !this.editing && !this.currentIteration;
@@ -159,7 +164,7 @@ export default {
   <div>
     <div v-gl-tooltip class="sidebar-collapsed-icon">
       <gl-icon :size="16" :aria-label="$options.iterationText" name="iteration" />
-      <span class="collapse-truncated-title">{{ iteration }}</span>
+      <span class="collapse-truncated-title">{{ iterationTitle }}</span>
     </div>
     <div class="title hide-collapsed mt-3">
       {{ $options.iterationText }}
@@ -177,8 +182,8 @@ export default {
     </div>
     <div data-testid="select-iteration" class="hide-collapsed">
       <span v-if="showNoIterationContent" class="no-value">{{ $options.noIteration }}</span>
-      <gl-link v-else-if="!editing" href
-        ><strong>{{ iteration }}</strong></gl-link
+      <gl-link v-else-if="!editing" :href="iterationUrl"
+        ><strong>{{ iterationTitle }}</strong></gl-link
       >
     </div>
     <gl-new-dropdown

ee/app/assets/javascripts/sidebar/queries/group_iterations.query.graphql

@@ -5,6 +5,7 @@ query groupIterations($fullPath: ID!, $title: String) {
         id
         title
         state
+        webUrl
       }
     }
   }

ee/spec/frontend/sidebar/components/iteration_select_spec.js

 import { shallowMount } from '@vue/test-utils';
-import { GlNewDropdown, GlNewDropdownItem, GlButton, GlSearchBoxByType } from '@gitlab/ui';
+import { GlNewDropdown, GlNewDropdownItem, GlButton, GlLink, GlSearchBoxByType } from '@gitlab/ui';
 import createFlash from '~/flash';
 import IterationSelect from 'ee/sidebar/components/iteration_select.vue';
 import { iterationSelectTextMap } from 'ee/sidebar/constants';
@@ -63,6 +63,17 @@ describe('IterationSelect', () => {
 
       expect(wrapper.find('[data-testid="select-iteration"]').text()).toBe('title');
     });
+
+    it('links to the current iteration', () => {
+      createComponent({
+        data: {
+          iterations: [{ id: 'id', title: 'title', webUrl: 'webUrl' }],
+          currentIteration: 'id',
+        },
+      });
+
+      expect(wrapper.find(GlLink).attributes().href).toBe('webUrl');
+    });
   });
 
   describe('when a user cannot edit', () => {