Move jira_issues_list_root to new name

The naming of this file is not representative
of what it does. This commit renames all related
names to be more meaningful.

app/assets/javascripts/issues_list/components/jira_issues_list_root.vue → app/assets/javascripts/issues_list/components/jira_issues_import_status_app.vue

@@ -11,7 +11,7 @@ import { n__ } from '~/locale';
 import getIssuesListDetailsQuery from '../queries/get_issues_list_details.query.graphql';
 
 export default {
-  name: 'JiraIssuesList',
+  name: 'JiraIssuesImportStatus',
   components: {
     GlAlert,
     GlLabel,
@@ -89,13 +89,13 @@ export default {
 </script>
 
 <template>
-  <div class="issuable-list-root">
+  <div class="gl-my-5">
     <gl-alert v-if="jiraImport.shouldShowInProgressAlert" @dismiss="hideInProgressAlert">
       {{ __('Import in progress. Refresh page to see newly added issues.') }}
     </gl-alert>
 
     <gl-alert
-      v-if="jiraImport.shouldShowFinishedAlert"
+      v-else-if="jiraImport.shouldShowFinishedAlert"
       variant="success"
       @dismiss="hideFinishedAlert"
     >

app/assets/javascripts/issues_list/index.js

@@ -3,10 +3,10 @@ import VueApollo from 'vue-apollo';
 import createDefaultClient from '~/lib/graphql';
 import { parseBoolean, convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
 import IssuablesListApp from './components/issuables_list_app.vue';
-import JiraIssuesListRoot from './components/jira_issues_list_root.vue';
+import JiraIssuesImportStatusRoot from './components/jira_issues_import_status_app.vue';
 
 function mountJiraIssuesListApp() {
-  const el = document.querySelector('.js-projects-issues-root');
+  const el = document.querySelector('.js-jira-issues-import-status');
 
   if (!el) {
     return false;
@@ -23,7 +23,7 @@ function mountJiraIssuesListApp() {
     el,
     apolloProvider,
     render(createComponent) {
-      return createComponent(JiraIssuesListRoot, {
+      return createComponent(JiraIssuesImportStatusRoot, {
         props: {
           canEdit: parseBoolean(el.dataset.canEdit),
           isJiraConfigured: parseBoolean(el.dataset.isJiraConfigured),

app/views/projects/issues/index.html.haml

@@ -8,7 +8,7 @@
 = content_for :meta_tags do
   = auto_discovery_link_tag(:atom, safe_params.merge(rss_url_options).to_h, title: "#{@project.name} issues")
 
-.js-projects-issues-root{ data: { can_edit: can?(current_user, :admin_project, @project).to_s,
+.js-jira-issues-import-status{ data: { can_edit: can?(current_user, :admin_project, @project).to_s,
   is_jira_configured: @project.jira_service.present?.to_s,
   issues_path: project_issues_path(@project),
   project_path: @project.full_path } }

ee/app/assets/stylesheets/page_bundles/issues_list.scss

 @import '../../../../../app/assets/stylesheets/page_bundles/issues_list';
 
-.issuable-list-root {
-  .gl-label-link {
-    text-decoration: none;
-
-    &:hover {
-      color: inherit;
-    }
-  }
-}
-
 .svg-container.jira-logo-container {
   svg {
     vertical-align: text-bottom;

spec/frontend/issues_list/components/jira_issues_list_root_spec.js → spec/frontend/issues_list/components/jira_issues_import_status_app_spec.js

 import { GlAlert, GlLabel } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import Vue from 'vue';
-import JiraIssuesListRoot from '~/issues_list/components/jira_issues_list_root.vue';
+import JiraIssuesImportStatus from '~/issues_list/components/jira_issues_import_status_app.vue';
 
-describe('JiraIssuesListRoot', () => {
+describe('JiraIssuesImportStatus', () => {
   const issuesPath = 'gitlab-org/gitlab-test/-/issues';
   const label = {
     color: '#333',
@@ -19,7 +19,7 @@ describe('JiraIssuesListRoot', () => {
     shouldShowFinishedAlert = false,
     shouldShowInProgressAlert = false,
   } = {}) =>
-    shallowMount(JiraIssuesListRoot, {
+    shallowMount(JiraIssuesImportStatus, {
       propsData: {
         canEdit: true,
         isJiraConfigured: true,