1 files changed, 37 insertions, 5 deletions

diff --git a/app/assets/javascripts/issues_list/index.js b/app/assets/javascripts/issues_list/index.js
index 5c3910955bc..a283cbdc86b 100644
--- a/app/assets/javascripts/issues_list/index.js
+++ b/app/assets/javascripts/issues_list/index.js
@@ -1,12 +1,13 @@
 import Vue from 'vue';
 import VueApollo from 'vue-apollo';
+import IssuesListApp from '~/issues_list/components/issues_list_app.vue';
 import createDefaultClient from '~/lib/graphql';
-import { parseBoolean, convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
+import { convertObjectPropsToCamelCase, parseBoolean } 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 +24,7 @@ function mountJiraIssuesListApp() {
     el,
     apolloProvider,
     render(createComponent) {
-      return createComponent(JiraIssuesListRoot, {
+      return createComponent(JiraIssuesImportStatusRoot, {
         props: {
           canEdit: parseBoolean(el.dataset.canEdit),
           isJiraConfigured: parseBoolean(el.dataset.isJiraConfigured),
@@ -36,7 +37,7 @@ function mountJiraIssuesListApp() {
 }
 
 function mountIssuablesListApp() {
-  if (!gon.features?.vueIssuablesList && !gon.features?.jiraIssuesIntegration) {
+  if (!gon.features?.vueIssuablesList) {
     return;
   }
 
@@ -64,6 +65,37 @@ function mountIssuablesListApp() {
   });
 }
 
+export function initIssuesListApp() {
+  const el = document.querySelector('.js-issues-list');
+
+  if (!el) {
+    return false;
+  }
+
+  const {
+    endpoint,
+    fullPath,
+    hasBlockedIssuesFeature,
+    hasIssuableHealthStatusFeature,
+    hasIssueWeightsFeature,
+  } = el.dataset;
+
+  return new Vue({
+    el,
+    // Currently does not use Vue Apollo, but need to provide {} for now until the
+    // issue is fixed upstream in https://github.com/vuejs/vue-apollo/pull/1153
+    apolloProvider: {},
+    provide: {
+      endpoint,
+      fullPath,
+      hasBlockedIssuesFeature: parseBoolean(hasBlockedIssuesFeature),
+      hasIssuableHealthStatusFeature: parseBoolean(hasIssuableHealthStatusFeature),
+      hasIssueWeightsFeature: parseBoolean(hasIssueWeightsFeature),
+    },
+    render: (createComponent) => createComponent(IssuesListApp),
+  });
+}
+
 export default function initIssuablesList() {
   mountJiraIssuesListApp();
   mountIssuablesListApp();