Fix Jira importer URLs

- The link to the Jira integration page was a relative path
  which was fixed to a path created by the backend
- The in progress `View issues` button was fixed to
  include a filter for the specific Jira project

app/assets/javascripts/jira_import/components/jira_import_app.vue

@@ -30,6 +30,10 @@ export default {
       type: String,
       required: true,
     },
+    jiraIntegrationPath: {
+      type: String,
+      required: true,
+    },
     jiraProjects: {
       type: Array,
       required: true,
@@ -133,7 +137,11 @@ export default {
       {{ errorMessage }}
     </gl-alert>
 
-    <jira-import-setup v-if="!isJiraConfigured" :illustration="setupIllustration" />
+    <jira-import-setup
+      v-if="!isJiraConfigured"
+      :illustration="setupIllustration"
+      :jira-integration-path="jiraIntegrationPath"
+    />
     <gl-loading-icon v-else-if="$apollo.loading" size="md" class="mt-3" />
     <jira-import-progress
       v-else-if="isImportInProgress"

app/assets/javascripts/jira_import/components/jira_import_progress.vue

@@ -46,6 +46,9 @@ export default {
         importTime: formatDate(this.importTime),
       });
     },
+    issuesLink() {
+      return `${this.issuesPath}?search=${this.importProject}`;
+    },
   },
 };
 </script>
@@ -55,7 +58,7 @@ export default {
     :svg-path="illustration"
     :title="__('Import in progress')"
     :primary-button-text="__('View issues')"
-    :primary-button-link="issuesPath"
+    :primary-button-link="issuesLink"
   >
     <template #description>
       <p class="mb-0">{{ importInitiatorText }}</p>

app/assets/javascripts/jira_import/components/jira_import_setup.vue

@@ -11,6 +11,10 @@ export default {
       type: String,
       required: true,
     },
+    jiraIntegrationPath: {
+      type: String,
+      required: true,
+    },
   },
 };
 </script>
@@ -21,6 +25,6 @@ export default {
     title=""
     :description="__('You will first need to set up Jira Integration to use this feature.')"
     :primary-button-text="__('Set up Jira Integration')"
-    primary-button-link="../services/jira/edit"
+    :primary-button-link="jiraIntegrationPath"
   />
 </template>

app/assets/javascripts/jira_import/index.js

@@ -27,6 +27,7 @@ export default function mountJiraImportApp() {
           inProgressIllustration: el.dataset.inProgressIllustration,
           isJiraConfigured: parseBoolean(el.dataset.isJiraConfigured),
           issuesPath: el.dataset.issuesPath,
+          jiraIntegrationPath: el.dataset.jiraIntegrationPath,
           jiraProjects: el.dataset.jiraProjects ? JSON.parse(el.dataset.jiraProjects) : [],
           projectPath: el.dataset.projectPath,
           setupIllustration: el.dataset.setupIllustration,

app/views/projects/import/jira/show.html.haml

 - if Feature.enabled?(:jira_issue_import_vue, @project, default_enabled: true)
   .js-jira-import-root{ data: { project_path: @project.full_path,
     issues_path: project_issues_path(@project),
+    jira_integration_path: edit_project_service_path(@project, :jira),
     is_jira_configured: @project.jira_service.present?.to_s,
     jira_projects: @jira_projects.to_json,
     in_progress_illustration: image_path('illustrations/export-import.svg'),

changelogs/unreleased/cngo-fix-jira-importer-urls.yml

+---
+title: Fix Jira importer URLs
+merge_request: 30155
+author:
+type: added

spec/frontend/jira_import/components/jira_import_app_spec.js

@@ -26,6 +26,7 @@ const mountComponent = ({
         ['My Second Jira Project', 'MSJP'],
         ['Migrate to GitLab', 'MTG'],
       ],
+      jiraIntegrationPath: 'gitlab-org/gitlab-test/-/services/jira/edit',
       projectPath: 'gitlab-org/gitlab-test',
       setupIllustration: 'setup-illustration.svg',
     },

spec/frontend/jira_import/components/jira_import_progress_spec.js

@@ -2,6 +2,10 @@ import { GlEmptyState } from '@gitlab/ui';
 import { mount, shallowMount } from '@vue/test-utils';
 import JiraImportProgress from '~/jira_import/components/jira_import_progress.vue';
 
+const illustration = 'illustration.svg';
+const importProject = 'JIRAPROJECT';
+const issuesPath = 'gitlab-org/gitlab-test/-/issues';
+
 describe('JiraImportProgress', () => {
   let wrapper;
 
@@ -13,11 +17,11 @@ describe('JiraImportProgress', () => {
     const mountFunction = mountType === 'shallowMount' ? shallowMount : mount;
     return mountFunction(JiraImportProgress, {
       propsData: {
-        illustration: 'illustration.svg',
+        illustration,
         importInitiator: 'Jane Doe',
-        importProject: 'JIRAPROJECT',
+        importProject,
         importTime: '2020-04-08T12:17:25+00:00',
-        issuesPath: 'gitlab-org/gitlab-test/-/issues',
+        issuesPath,
       },
     });
   };
@@ -33,7 +37,7 @@ describe('JiraImportProgress', () => {
     });
 
     it('contains illustration', () => {
-      expect(getGlEmptyStateAttribute('svgpath')).toBe('illustration.svg');
+      expect(getGlEmptyStateAttribute('svgpath')).toBe(illustration);
     });
 
     it('contains a title', () => {
@@ -46,7 +50,8 @@ describe('JiraImportProgress', () => {
     });
 
     it('contains button url', () => {
-      expect(getGlEmptyStateAttribute('primarybuttonlink')).toBe('gitlab-org/gitlab-test/-/issues');
+      const expected = `${issuesPath}?search=${importProject}`;
+      expect(getGlEmptyStateAttribute('primarybuttonlink')).toBe(expected);
     });
   });
 

spec/frontend/jira_import/components/jira_import_setup_spec.js

@@ -2,6 +2,9 @@ import { GlEmptyState } from '@gitlab/ui';
 import { shallowMount } from '@vue/test-utils';
 import JiraImportSetup from '~/jira_import/components/jira_import_setup.vue';
 
+const illustration = 'illustration.svg';
+const jiraIntegrationPath = 'gitlab-org/gitlab-test/-/services/jira/edit';
+
 describe('JiraImportSetup', () => {
   let wrapper;
 
@@ -10,7 +13,8 @@ describe('JiraImportSetup', () => {
   beforeEach(() => {
     wrapper = shallowMount(JiraImportSetup, {
       propsData: {
-        illustration: 'illustration.svg',
+        illustration,
+        jiraIntegrationPath,
       },
     });
   });
@@ -21,7 +25,7 @@ describe('JiraImportSetup', () => {
   });
 
   it('contains illustration', () => {
-    expect(getGlEmptyStateAttribute('svgpath')).toBe('illustration.svg');
+    expect(getGlEmptyStateAttribute('svgpath')).toBe(illustration);
   });
 
   it('contains a description', () => {
@@ -32,4 +36,8 @@ describe('JiraImportSetup', () => {
   it('contains button text', () => {
     expect(getGlEmptyStateAttribute('primarybuttontext')).toBe('Set up Jira Integration');
   });
+
+  it('contains button link', () => {
+    expect(getGlEmptyStateAttribute('primarybuttonlink')).toBe(jiraIntegrationPath);
+  });
 });