Add incident details sidebar type

Add sidebar mount for Vue sidebar
and extend sidebar to add issuable
type to test sidebar render

app/assets/javascripts/lib/utils/common_utils.js

@@ -44,7 +44,7 @@ export const checkPageAndAction = (page, action) => {
   return pagePath === page && actionPath === action;
 };
 
-export const isInIncidentPage = () => checkPageAndAction('issues', 'incident');
+export const isInIncidentPage = () => checkPageAndAction('incidents', 'show');
 export const isInIssuePage = () => checkPageAndAction('issues', 'show');
 export const isInMRPage = () => checkPageAndAction('merge_requests', 'show');
 export const isInEpicPage = () => checkPageAndAction('epics', 'show');

app/assets/javascripts/pages/projects/incidents/show/index.js

+import initSidebarBundle from '~/sidebar/sidebar_bundle';
 import initRelatedIssues from '~/related_issues';
 import initShow from '../../issues/show';
 
 document.addEventListener('DOMContentLoaded', () => {
   initShow();
+  if (!gon.features?.vueIssuableSidebar) {
+    initSidebarBundle();
+  }
   initRelatedIssues();
 });

app/views/shared/issuable/_sidebar.html.haml

@@ -11,7 +11,7 @@
   %aside#js-vue-issuable-sidebar{ data: { signed_in: signed_in,
     sidebar_status_class: sidebar_gutter_collapsed_class } }
 - else
-  %aside.right-sidebar.js-right-sidebar.js-issuable-sidebar{ data: { signed: { in: signed_in } }, class: sidebar_gutter_collapsed_class, 'aria-live' => 'polite' }
+  %aside.right-sidebar.js-right-sidebar.js-issuable-sidebar{ data: { signed: { in: signed_in }, issuable_type: issuable_type }, class: sidebar_gutter_collapsed_class, 'aria-live' => 'polite' }
     .issuable-sidebar
       .block.issuable-sidebar-header
         - if signed_in

spec/features/incidents/incident_details_spec.rb

@@ -5,7 +5,7 @@ require 'spec_helper'
 RSpec.describe 'Incident details', :js do
   let_it_be(:project) { create(:project) }
   let_it_be(:developer) { create(:user) }
-  let_it_be(:incident) { create(:incident, project: project, author: developer) }
+  let_it_be(:incident) { create(:incident, project: project, author: developer, description: 'description') }
 
   before_all do
     project.add_developer(developer)
@@ -28,5 +28,25 @@ RSpec.describe 'Incident details', :js do
     it 'does not show design management' do
       expect(page).not_to have_selector('.js-design-management')
     end
+
+    it 'shows the incident tabs' do
+      page.within('.issuable-details') do
+        incident_tabs = find('[data-testid="incident-tabs"]')
+
+        expect(find('h2')).to have_content(incident.title)
+        expect(incident_tabs).to have_content('Summary')
+        expect(incident_tabs).to have_content(incident.description)
+      end
+    end
+
+    it 'shows the right sidebar mounted with type issue' do
+      page.within('.layout-page') do
+        sidebar = find('.right-sidebar')
+
+        expect(page).to have_selector('.right-sidebar[data-issuable-type="issue"]')
+        expect(sidebar).to have_selector('.incident-severity')
+        expect(sidebar).not_to have_selector('.milestone')
+      end
+    end
   end
 end