Merge branch '4289-add-epic-issue-board-sidebar' into 'master'

Add Epic information for selected issue in Issue boards sidebar

Closes #4289

See merge request gitlab-org/gitlab-ee!4104

app/assets/javascripts/boards/boards_bundle.js

@@ -132,14 +132,17 @@ $(() => {
         if (sidebarInfoEndpoint && newIssue.subscribed === undefined) {
           newIssue.setFetchingState('subscriptions', true);
           newIssue.setFetchingState('weight', true);
+          newIssue.setFetchingState('epic', true);
           BoardService.getIssueInfo(sidebarInfoEndpoint)
             .then(res => res.data)
             .then((data) => {
               newIssue.setFetchingState('subscriptions', false);
               newIssue.setFetchingState('weight', false);
+              newIssue.setFetchingState('epic', false);
               newIssue.updateData({
                 subscribed: data.subscribed,
                 weight: data.weight,
+                epic: data.epic,
               });
             })
             .catch(() => {

app/views/shared/boards/components/_sidebar.html.haml

@@ -19,6 +19,7 @@
             = custom_icon("icon_close", size: 15)
         .js-issuable-update
           = render "shared/boards/components/sidebar/assignee"
+          = render "shared/boards/components/sidebar/epic"
           = render "shared/boards/components/sidebar/milestone"
           = render "shared/boards/components/sidebar/due_date"
           = render "shared/boards/components/sidebar/labels"

changelogs/unreleased-ee/4289-add-epic-issue-board-sidebar.yml

+---
+title: Add Epic information for selected issue in Issue boards sidebar
+merge_request: 4104
+author:
+type: added

ee/app/views/shared/boards/components/sidebar/_epic.html.haml

+- return unless @group&.feature_available?(:epics) || @project&.group&.feature_available?(:epics)
+
+.block.epic
+  .title
+    Epic
+    %span.js-epic-label-loading{ "v-if" => "issue.isFetching && issue.isFetching.epic" }
+      = icon('spinner spin', class: 'loading-icon')
+  .value.js-epic-label{ "v-if" => "issue.isFetching && !issue.isFetching.epic" }
+    %a.bold{ "v-if" => "issue.epic", ":href" => "issue.epic.url" }
+      {{ issue.epic.title }}
+    .no-value{ "v-if" => "!issue.epic" }
+      None

spec/ee/spec/features/boards/sidebar_spec.rb

@@ -5,7 +5,8 @@ describe 'Issue Boards', :js do
 
   let(:user)         { create(:user) }
   let(:user2)        { create(:user) }
-  let(:project)      { create(:project, :public) }
+  let(:group)        { create(:group) }
+  let(:project)      { create(:project, :public, group: group) }
   let!(:milestone)   { create(:milestone, project: project) }
   let!(:development) { create(:label, project: project, name: 'Development') }
   let!(:stretch)     { create(:label, project: project, name: 'Stretch') }
@@ -141,6 +142,36 @@ describe 'Issue Boards', :js do
     end
   end
 
+  context 'epic' do
+    before do
+      stub_licensed_features(epics: true)
+
+      visit project_board_path(project, board)
+      wait_for_requests
+    end
+
+    context 'when the issue is not associated with an epic' do
+      it 'displays `None` for value of epic' do
+        click_card(card1)
+        wait_for_requests
+
+        expect(find('.js-epic-label').text).to have_content('None')
+      end
+    end
+
+    context 'when the issue is associated with an epic' do
+      let(:epic)          { create(:epic, group: group) }
+      let!(:epic_issue)   { create(:epic_issue, issue: issue1, epic: epic) }
+
+      it 'displays name of epic and links to it' do
+        click_card(card1)
+        wait_for_requests
+
+        expect(find('.js-epic-label')).to have_link(epic.title, href: epic_path(epic))
+      end
+    end
+  end
+
   context 'weight' do
     it 'displays weight async' do
       click_card(card1)