Add latest changes from gitlab-org/gitlab@master

3 files changed, 65 insertions, 69 deletions

diff --git a/app/assets/javascripts/jira_import/components/jira_import_app.vue b/app/assets/javascripts/jira_import/components/jira_import_app.vue
index e5083f01a8a..ef0fc4716dd 100644
--- a/app/assets/javascripts/jira_import/components/jira_import_app.vue
+++ b/app/assets/javascripts/jira_import/components/jira_import_app.vue
@@ -4,7 +4,8 @@ import { last } from 'lodash';
 import { __ } from '~/locale';
 import getJiraImportDetailsQuery from '../queries/get_jira_import_details.query.graphql';
 import initiateJiraImportMutation from '../queries/initiate_jira_import.mutation.graphql';
-import { IMPORT_STATE, isInProgress, extractJiraProjectsOptions } from '../utils';
+import { addInProgressImportToStore } from '../utils/cache_update';
+import { isInProgress, extractJiraProjectsOptions } from '../utils/jira_import_utils';
 import JiraImportForm from './jira_import_form.vue';
 import JiraImportProgress from './jira_import_progress.vue';
 import JiraImportSetup from './jira_import_setup.vue';
@@ -20,14 +21,14 @@ export default {
     JiraImportSetup,
   },
   props: {
-    isJiraConfigured: {
-      type: Boolean,
-      required: true,
-    },
     inProgressIllustration: {
       type: String,
       required: true,
     },
+    isJiraConfigured: {
+      type: Boolean,
+      required: true,
+    },
     issuesPath: {
       type: String,
       required: true,
@@ -62,9 +63,10 @@ export default {
         };
       },
       update: ({ project }) => ({
-        projects: extractJiraProjectsOptions(project.services.nodes[0].projects.nodes),
-        status: project.jiraImportStatus,
         imports: project.jiraImports.nodes,
+        isInProgress: isInProgress(project.jiraImportStatus),
+        mostRecentImport: last(project.jiraImports.nodes),
+        projects: extractJiraProjectsOptions(project.services.nodes[0].projects.nodes),
       }),
       skip() {
         return !this.isJiraConfigured;
@@ -72,32 +74,22 @@ export default {
     },
   },
   computed: {
-    isImportInProgress() {
-      return isInProgress(this.jiraImportDetails.status);
-    },
-    mostRecentImport() {
-      // The backend returns JiraImports ordered by created_at asc in app/models/project.rb
-      return last(this.jiraImportDetails.imports);
-    },
-    numberOfPreviousImportsForProject() {
+    numberOfPreviousImports() {
       return this.jiraImportDetails.imports?.reduce?.(
         (acc, jiraProject) => (jiraProject.jiraProjectKey === this.selectedProject ? acc + 1 : acc),
         0,
       );
     },
+    hasPreviousImports() {
+      return this.numberOfPreviousImports > 0;
+    },
     importLabel() {
       return this.selectedProject
-        ? `jira-import::${this.selectedProject}-${this.numberOfPreviousImportsForProject + 1}`
+        ? `jira-import::${this.selectedProject}-${this.numberOfPreviousImports + 1}`
         : 'jira-import::KEY-1';
     },
-    hasPreviousImports() {
-      return this.numberOfPreviousImportsForProject > 0;
-    },
   },
   methods: {
-    dismissAlert() {
-      this.showAlert = false;
-    },
     initiateJiraImport(project) {
       this.$apollo
         .mutate({
@@ -108,39 +100,8 @@ export default {
               jiraProjectKey: project,
             },
           },
-          update: (store, { data }) => {
-            if (data.jiraImportStart.errors.length) {
-              return;
-            }
-
-            const cacheData = store.readQuery({
-              query: getJiraImportDetailsQuery,
-              variables: {
-                fullPath: this.projectPath,
-              },
-            });
-
-            store.writeQuery({
-              query: getJiraImportDetailsQuery,
-              variables: {
-                fullPath: this.projectPath,
-              },
-              data: {
-                project: {
-                  jiraImportStatus: IMPORT_STATE.SCHEDULED,
-                  jiraImports: {
-                    nodes: [
-                      ...cacheData.project.jiraImports.nodes,
-                      data.jiraImportStart.jiraImport,
-                    ],
-                    __typename: 'JiraImportConnection',
-                  },
-                  // eslint-disable-next-line @gitlab/require-i18n-strings
-                  __typename: 'Project',
-                },
-              },
-            });
-          },
+          update: (store, { data }) =>
+            addInProgressImportToStore(store, data.jiraImportStart, this.projectPath),
         })
         .then(({ data }) => {
           if (data.jiraImportStart.errors.length) {
@@ -155,7 +116,13 @@ export default {
       this.errorMessage = message;
       this.showAlert = true;
     },
+    dismissAlert() {
+      this.showAlert = false;
+    },
   },
+  previousImportsMessage: __(
+    'You have imported from this project %{numberOfPreviousImports} times before. Each new import will create duplicate issues.',
+  ),
 };
 </script>
 
@@ -165,16 +132,8 @@ export default {
       {{ errorMessage }}
     </gl-alert>
     <gl-alert v-if="hasPreviousImports" variant="warning" :dismissible="false">
-      <gl-sprintf
-        :message="
-          __(
-            'You have imported from this project %{numberOfPreviousImportsForProject} times before. Each new import will create duplicate issues.',
-          )
-        "
-      >
-        <template #numberOfPreviousImportsForProject>{{
-          numberOfPreviousImportsForProject
-        }}</template>
+      <gl-sprintf :message="$options.previousImportsMessage">
+        <template #numberOfPreviousImports>{{ numberOfPreviousImports }}</template>
       </gl-sprintf>
     </gl-alert>
 
@@ -185,11 +144,11 @@ export default {
     />
     <gl-loading-icon v-else-if="$apollo.loading" size="md" class="mt-3" />
     <jira-import-progress
-      v-else-if="isImportInProgress"
+      v-else-if="jiraImportDetails.isInProgress"
       :illustration="inProgressIllustration"
-      :import-initiator="mostRecentImport.scheduledBy.name"
-      :import-project="mostRecentImport.jiraProjectKey"
-      :import-time="mostRecentImport.scheduledAt"
+      :import-initiator="jiraImportDetails.mostRecentImport.scheduledBy.name"
+      :import-project="jiraImportDetails.mostRecentImport.jiraProjectKey"
+      :import-time="jiraImportDetails.mostRecentImport.scheduledAt"
       :issues-path="issuesPath"
     />
     <jira-import-form
diff --git a/app/assets/javascripts/jira_import/utils/cache_update.js b/app/assets/javascripts/jira_import/utils/cache_update.js
new file mode 100644
index 00000000000..6aaf2010866
--- /dev/null
+++ b/app/assets/javascripts/jira_import/utils/cache_update.js
@@ -0,0 +1,37 @@
+import getJiraImportDetailsQuery from '../queries/get_jira_import_details.query.graphql';
+import { IMPORT_STATE } from './jira_import_utils';
+
+export const addInProgressImportToStore = (store, jiraImportStart, fullPath) => {
+  if (jiraImportStart.errors.length) {
+    return;
+  }
+
+  const queryDetails = {
+    query: getJiraImportDetailsQuery,
+    variables: {
+      fullPath,
+    },
+  };
+
+  const cacheData = store.readQuery({
+    ...queryDetails,
+  });
+
+  store.writeQuery({
+    ...queryDetails,
+    data: {
+      project: {
+        ...cacheData.project,
+        jiraImportStatus: IMPORT_STATE.SCHEDULED,
+        jiraImports: {
+          ...cacheData.project.jiraImports,
+          nodes: cacheData.project.jiraImports.nodes.concat(jiraImportStart.jiraImport),
+        },
+      },
+    },
+  });
+};
+
+export default {
+  addInProgressImportToStore,
+};
diff --git a/app/assets/javascripts/jira_import/utils.js b/app/assets/javascripts/jira_import/utils/jira_import_utils.js
index e82a3f44a29..e82a3f44a29 100644
--- a/app/assets/javascripts/jira_import/utils.js
+++ b/app/assets/javascripts/jira_import/utils/jira_import_utils.js