Merge branch '325433-fix-extra-margin-about-issue-index-navigation' into 'master'

Remove extra margin above issue navigation tabs

See merge request gitlab-org/gitlab!60824

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

@@ -59,9 +59,6 @@ export default {
           shouldShowInProgressAlert: isInProgress(project.jiraImportStatus),
         };
       },
-      skip() {
-        return !this.isJiraConfigured || !this.canEdit;
-      },
     },
   },
   computed: {
@@ -75,6 +72,9 @@ export default {
     labelTarget() {
       return `${this.issuesPath}?label_name[]=${encodeURIComponent(this.jiraImport.label.title)}`;
     },
+    shouldRender() {
+      return this.jiraImport.shouldShowInProgressAlert || this.jiraImport.shouldShowFinishedAlert;
+    },
   },
   methods: {
     hideFinishedAlert() {
@@ -89,7 +89,7 @@ export default {
 </script>
 
 <template>
-  <div class="gl-my-5">
+  <div v-if="shouldRender" class="gl-my-5">
     <gl-alert v-if="jiraImport.shouldShowInProgressAlert" @dismiss="hideInProgressAlert">
       {{ __('Import in progress. Refresh page to see newly added issues.') }}
     </gl-alert>

app/assets/javascripts/issues_list/index.js

@@ -13,6 +13,14 @@ export function mountJiraIssuesListApp() {
     return false;
   }
 
+  const { issuesPath, projectPath } = el.dataset;
+  const canEdit = parseBoolean(el.dataset.canEdit);
+  const isJiraConfigured = parseBoolean(el.dataset.isJiraConfigured);
+
+  if (!isJiraConfigured || !canEdit) {
+    return false;
+  }
+
   Vue.use(VueApollo);
 
   const defaultClient = createDefaultClient();
@@ -26,10 +34,10 @@ export function mountJiraIssuesListApp() {
     render(createComponent) {
       return createComponent(JiraIssuesImportStatusRoot, {
         props: {
-          canEdit: parseBoolean(el.dataset.canEdit),
-          isJiraConfigured: parseBoolean(el.dataset.isJiraConfigured),
-          issuesPath: el.dataset.issuesPath,
-          projectPath: el.dataset.projectPath,
+          canEdit,
+          isJiraConfigured,
+          issuesPath,
+          projectPath,
         },
       });
     },

spec/frontend/issues_list/components/jira_issues_import_status_app_spec.js

@@ -43,10 +43,12 @@ describe('JiraIssuesImportStatus', () => {
     wrapper = null;
   });
 
-  describe('when Jira import is not in progress', () => {
-    it('does not show an alert', () => {
+  describe('when Jira import is neither in progress nor finished', () => {
+    beforeEach(() => {
       wrapper = mountComponent();
+    });
 
+    it('does not show an alert', () => {
       expect(wrapper.find(GlAlert).exists()).toBe(false);
     });
   });