Add latest changes from gitlab-org/gitlab@master

7 files changed, 46 insertions, 15 deletions

diff --git a/app/assets/javascripts/import_entities/constants.js b/app/assets/javascripts/import_entities/constants.js
index c470da21765..d0a23f88ee7 100644
--- a/app/assets/javascripts/import_entities/constants.js
+++ b/app/assets/javascripts/import_entities/constants.js
@@ -12,3 +12,7 @@ export const STATUSES = {
   CANCELLED: 'cancelled',
   TIMEOUT: 'timeout',
 };
+
+export const PROVIDERS = {
+  GITHUB: 'github',
+};
diff --git a/app/assets/javascripts/import_entities/import_groups/components/import_table.vue b/app/assets/javascripts/import_entities/import_groups/components/import_table.vue
index 40eba0a19d2..6412f26fde7 100644
--- a/app/assets/javascripts/import_entities/import_groups/components/import_table.vue
+++ b/app/assets/javascripts/import_entities/import_groups/components/import_table.vue
@@ -164,7 +164,7 @@ export default {
       }
 
       return this.groups.map((group) => {
-        const importTarget = this.getImportTarget(group);
+        const importTarget = this.importTargets[group.id];
         const status = this.getStatus(group);
 
         const flags = {
@@ -256,10 +256,14 @@ export default {
       this.page = 1;
     },
 
-    groupsTableData() {
+    groups() {
       const table = this.getTableRef();
       const matches = new Set();
-      this.groupsTableData.forEach((g, idx) => {
+      this.groups.forEach((g, idx) => {
+        if (!this.importGroups[g.id]) {
+          this.setDefaultImportTarget(g);
+        }
+
         if (this.selectedGroupsIds.includes(g.id)) {
           matches.add(g.id);
           this.$nextTick(() => {
@@ -450,11 +454,7 @@ export default {
       importTarget.validationErrors = newValidationErrors;
     }, VALIDATION_DEBOUNCE_TIME),
 
-    getImportTarget(group) {
-      if (this.importTargets[group.id]) {
-        return this.importTargets[group.id];
-      }
-
+    setDefaultImportTarget(group) {
       // If we've reached this Vue application we have at least one potential import destination
       const defaultTargetNamespace =
         // first option: namespace id was explicitly provided
@@ -515,7 +515,6 @@ export default {
         .catch(() => {
           // empty catch intended
         });
-      return this.importTargets[group.id];
     },
   },
 
diff --git a/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue b/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue
index 701384f14a7..d82acfa3f05 100644
--- a/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue
+++ b/app/assets/javascripts/import_entities/import_projects/components/import_projects_table.vue
@@ -203,7 +203,7 @@ export default {
       </table>
     </div>
     <gl-intersection-observer
-      v-if="paginatable"
+      v-if="paginatable && pageInfo.hasNextPage"
       :key="pagePaginationStateKey"
       @appear="fetchRepos"
     />
diff --git a/app/assets/javascripts/import_entities/import_projects/store/actions.js b/app/assets/javascripts/import_entities/import_projects/store/actions.js
index 74723ec0e9d..ba51e1aacd3 100644
--- a/app/assets/javascripts/import_entities/import_projects/store/actions.js
+++ b/app/assets/javascripts/import_entities/import_projects/store/actions.js
@@ -1,4 +1,5 @@
 import Visibility from 'visibilityjs';
+import _ from 'lodash';
 import { createAlert } from '~/flash';
 import axios from '~/lib/utils/axios_utils';
 import { convertObjectPropsToCamelCase } from '~/lib/utils/common_utils';
@@ -8,6 +9,7 @@ import { capitalizeFirstCharacter } from '~/lib/utils/text_utility';
 import { visitUrl, objectToQuery } from '~/lib/utils/url_utility';
 import { s__, sprintf } from '~/locale';
 import { isProjectImportable } from '../utils';
+import { PROVIDERS } from '../../constants';
 import * as types from './mutation_types';
 
 let eTagPoll;
@@ -22,6 +24,24 @@ const pathWithParams = ({ path, ...params }) => {
   const queryString = objectToQuery(filteredParams);
   return queryString ? `${path}?${queryString}` : path;
 };
+const commitPaginationData = ({ state, commit, data }) => {
+  const cursorsGitHubResponse = !_.isEmpty(data.pageInfo || {});
+
+  if (state.provider === PROVIDERS.GITHUB && cursorsGitHubResponse) {
+    commit(types.SET_PAGE_CURSORS, data.pageInfo);
+  } else {
+    const nextPage = state.pageInfo.page + 1;
+    commit(types.SET_PAGE, nextPage);
+  }
+};
+const paginationParams = ({ state }) => {
+  if (state.provider === PROVIDERS.GITHUB && state.pageInfo.endCursor) {
+    return { after: state.pageInfo.endCursor };
+  }
+
+  const nextPage = state.pageInfo.page + 1;
+  return { page: nextPage === 1 ? '' : nextPage.toString() };
+};
 
 const isRequired = () => {
   // eslint-disable-next-line @gitlab/require-i18n-strings
@@ -55,7 +75,6 @@ const importAll = ({ state, dispatch }, config = {}) => {
 };
 
 const fetchReposFactory = ({ reposPath = isRequired() }) => ({ state, commit }) => {
-  const nextPage = state.pageInfo.page + 1;
   commit(types.REQUEST_REPOS);
 
   const { provider, filter } = state;
@@ -65,12 +84,13 @@ const fetchReposFactory = ({ reposPath = isRequired() }) => ({ state, commit })
       pathWithParams({
         path: reposPath,
         filter: filter ?? '',
-        page: nextPage === 1 ? '' : nextPage.toString(),
+        ...paginationParams({ state }),
       }),
     )
     .then(({ data }) => {
-      commit(types.SET_PAGE, nextPage);
-      commit(types.RECEIVE_REPOS_SUCCESS, convertObjectPropsToCamelCase(data, { deep: true }));
+      const camelData = convertObjectPropsToCamelCase(data, { deep: true });
+      commitPaginationData({ state, commit, data: camelData });
+      commit(types.RECEIVE_REPOS_SUCCESS, camelData);
     })
     .catch((e) => {
       if (hasRedirectInError(e)) {
diff --git a/app/assets/javascripts/import_entities/import_projects/store/mutation_types.js b/app/assets/javascripts/import_entities/import_projects/store/mutation_types.js
index 43dcd54c239..360582de2db 100644
--- a/app/assets/javascripts/import_entities/import_projects/store/mutation_types.js
+++ b/app/assets/javascripts/import_entities/import_projects/store/mutation_types.js
@@ -14,4 +14,4 @@ export const SET_IMPORT_TARGET = 'SET_IMPORT_TARGET';
 
 export const SET_PAGE = 'SET_PAGE';
 
-export const SET_PAGE_INFO = 'SET_PAGE_INFO';
+export const SET_PAGE_CURSORS = 'SET_PAGE_CURSORS';
diff --git a/app/assets/javascripts/import_entities/import_projects/store/mutations.js b/app/assets/javascripts/import_entities/import_projects/store/mutations.js
index fda0ed47c0f..a7cbace0725 100644
--- a/app/assets/javascripts/import_entities/import_projects/store/mutations.js
+++ b/app/assets/javascripts/import_entities/import_projects/store/mutations.js
@@ -138,4 +138,9 @@ export default {
   [types.SET_PAGE](state, page) {
     state.pageInfo.page = page;
   },
+
+  [types.SET_PAGE_CURSORS](state, pageInfo) {
+    const { startCursor, endCursor, hasNextPage } = pageInfo;
+    state.pageInfo = { ...state.pageInfo, startCursor, endCursor, hasNextPage };
+  },
 };
diff --git a/app/assets/javascripts/import_entities/import_projects/store/state.js b/app/assets/javascripts/import_entities/import_projects/store/state.js
index 010f462e385..c384848f0a0 100644
--- a/app/assets/javascripts/import_entities/import_projects/store/state.js
+++ b/app/assets/javascripts/import_entities/import_projects/store/state.js
@@ -7,5 +7,8 @@ export default () => ({
   filter: '',
   pageInfo: {
     page: 0,
+    startCursor: null,
+    endCursor: null,
+    hasNextPage: true,
   },
 });