Merge vulnerability dropdown into existing page

Merges the vulnerability dropdown into an existing page that was
created after the vulnerability dropdown feature was implemented
and deletes the files from the old location

ee/app/assets/javascripts/pages/projects/security/dashboard/show/index.js

-import App from 'ee/vulnerability_management/components/app.vue';
-import Vue from 'vue';
-
-window.addEventListener('DOMContentLoaded', () => {
-  const el = document.getElementById('vulnerability-show-header');
-  const { state, id } = el.dataset;
-
-  return new Vue({
-    el,
-
-    render: h => h(App, { props: { state, id: Number(id) } }),
-  });
-});

ee/app/assets/javascripts/pages/projects/security/vulnerabilities/show/index.js

 import Vue from 'vue';
 import { parseBoolean } from '~/lib/utils/common_utils';
 import SolutionCard from 'ee/vue_shared/security_reports/components/solution_card.vue';
+import HeaderApp from 'ee/vulnerabilities/components/app.vue';
 
-window.addEventListener('DOMContentLoaded', () => {
+function createSolutionCardApp() {
   const el = document.getElementById('js-vulnerability-solution');
 
   if (!el) {
@@ -33,4 +34,19 @@ window.addEventListener('DOMContentLoaded', () => {
         props,
       }),
   });
+}
+
+function createHeaderApp() {
+  const el = document.getElementById('js-vulnerability-show-header');
+  const { state, id } = el.dataset;
+
+  return new Vue({
+    el,
+    render: h => h(HeaderApp, { props: { state, id: Number(id) } }),
+  });
+}
+
+window.addEventListener('DOMContentLoaded', () => {
+  createHeaderApp();
+  createSolutionCardApp();
 });

ee/app/assets/javascripts/vulnerability_management/components/app.vue → ee/app/assets/javascripts/vulnerabilities/components/app.vue

@@ -41,7 +41,7 @@ export default {
 </script>
 
 <template>
-  <div class="vulnerability-show-header">
+  <div>
     <gl-loading-icon v-if="isLoading" />
     <vulnerability-state-dropdown v-else :state="state" @change="onVulnerabilityStateChange" />
   </div>

ee/app/views/projects/security/vulnerabilities/show.html.haml

@@ -17,7 +17,7 @@
       %span#js-vulnerability-created
         = time_ago_with_tooltip(@vulnerability.created_at)
   %label.mb-0.mr-2= _('Status')
-  #vulnerability-show-header{ data: { state: @vulnerability.state,
+  #js-vulnerability-show-header{ data: { state: @vulnerability.state,
     id: @vulnerability.id } }
 
 .issue-details.issuable-details

ee/spec/frontend/vulnerability_management/app_spec.js → ee/spec/frontend/vulnerabilities/app_spec.js

@@ -2,9 +2,9 @@ import { shallowMount } from '@vue/test-utils';
 import axios from '~/lib/utils/axios_utils';
 import createFlash from '~/flash';
 import MockAdapter from 'axios-mock-adapter';
-import App from 'ee/vulnerability_management/components/app.vue';
+import App from 'ee/vulnerabilities/components/app.vue';
 import waitForPromises from 'helpers/wait_for_promises';
-import VulnerabilityStateDropdown from 'ee/vulnerability_management/components/vulnerability_state_dropdown.vue';
+import VulnerabilityStateDropdown from 'ee/vulnerabilities/components/vulnerability_state_dropdown.vue';
 
 const mockAxios = new MockAdapter(axios);
 jest.mock('~/flash');

ee/spec/frontend/vulnerability_management/vulnerability_state_dropdown_spec.js → ee/spec/frontend/vulnerabilities/vulnerability_state_dropdown_spec.js

 import { shallowMount } from '@vue/test-utils';
-import VulnerabilityStateDropdown from 'ee/vulnerability_management/components/vulnerability_state_dropdown.vue';
-import { VULNERABILITY_STATES } from 'ee/vulnerability_management/constants';
+import VulnerabilityStateDropdown from 'ee/vulnerabilities/components/vulnerability_state_dropdown.vue';
+import { VULNERABILITY_STATES } from 'ee/vulnerabilities/constants';
 
 const vulnerabilityStateEntries = Object.entries(VULNERABILITY_STATES);