diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-09-15 21:11:45 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-09-15 21:11:45 +0300 |
commit | 7a15fb07cf363079c4c4683850ee131d80e75f75 (patch) | |
tree | 60932d6cd96a9df0678ec56eafe373ba8bff8beb /app/assets/javascripts/jira_connect | |
parent | f357b1fa2f6a1a204f1ab9070e8a64d717c8960c (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/jira_connect')
3 files changed, 44 insertions, 12 deletions
diff --git a/app/assets/javascripts/jira_connect/branches/components/new_branch_form.vue b/app/assets/javascripts/jira_connect/branches/components/new_branch_form.vue index 46c27c33f56..1d926c0d0c5 100644 --- a/app/assets/javascripts/jira_connect/branches/components/new_branch_form.vue +++ b/app/assets/javascripts/jira_connect/branches/components/new_branch_form.vue @@ -193,6 +193,7 @@ export default { > <source-branch-dropdown id="source-branch-select" + :key="selectedProject.id" :selected-project="selectedProject" :selected-branch-name="selectedSourceBranchName" @change="onSourceBranchSelect" diff --git a/app/assets/javascripts/jira_connect/branches/components/source_branch_dropdown.vue b/app/assets/javascripts/jira_connect/branches/components/source_branch_dropdown.vue index e443df35ad2..3f9dd4eb6c6 100644 --- a/app/assets/javascripts/jira_connect/branches/components/source_branch_dropdown.vue +++ b/app/assets/javascripts/jira_connect/branches/components/source_branch_dropdown.vue @@ -2,6 +2,8 @@ import { GlCollapsibleListbox } from '@gitlab/ui'; import { debounce } from 'lodash'; import { __ } from '~/locale'; +import { logError } from '~/lib/logger'; + import { BRANCHES_PER_PAGE } from '../constants'; import getProjectQuery from '../graphql/queries/get_project.query.graphql'; @@ -26,6 +28,7 @@ export default { return { initialSourceBranchNamesLoading: false, sourceBranchNamesLoading: false, + sourceBranchNamesLoadingMore: false, sourceBranchNames: [], }; }, @@ -36,6 +39,11 @@ export default { hasSelectedSourceBranch() { return Boolean(this.selectedBranchName); }, + hasMoreBranches() { + return ( + this.sourceBranchNames.length > 0 && this.sourceBranchNames.length % BRANCHES_PER_PAGE === 0 + ); + }, branchDropdownText() { return this.selectedBranchName || __('Select a branch'); }, @@ -59,45 +67,63 @@ export default { onSearch: debounce(function debouncedSearch(branchSearchQuery) { this.onSourceBranchSearchQuery(branchSearchQuery); }, 250), - onSourceBranchSearchQuery(branchSearchQuery) { + async onSourceBranchSearchQuery(branchSearchQuery) { this.branchSearchQuery = branchSearchQuery; - this.fetchSourceBranchNames({ + this.sourceBranchNamesLoading = true; + + await this.fetchSourceBranchNames({ + projectPath: this.selectedProject.fullPath, + searchPattern: this.branchSearchQuery, + }); + this.sourceBranchNamesLoading = false; + }, + async onBottomReached() { + this.sourceBranchNamesLoadingMore = true; + + await this.fetchSourceBranchNames({ projectPath: this.selectedProject.fullPath, searchPattern: this.branchSearchQuery, + append: true, }); + + this.sourceBranchNamesLoadingMore = false; }, onError({ message } = {}) { this.$emit('error', { message }); }, - async fetchSourceBranchNames({ projectPath, searchPattern } = {}) { - this.sourceBranchNamesLoading = true; + async fetchSourceBranchNames({ projectPath, searchPattern, append = false } = {}) { try { const { data } = await this.$apollo.query({ query: getProjectQuery, variables: { projectPath, branchNamesLimit: this.$options.BRANCHES_PER_PAGE, - branchNamesOffset: 0, + branchNamesOffset: append ? this.sourceBranchNames.length : 0, branchNamesSearchPattern: searchPattern ? `*${searchPattern}*` : '*', }, }); const { branchNames, rootRef } = data?.project.repository || {}; - this.sourceBranchNames = - branchNames.map((value) => { + const branchNameItems = + branchNames?.map((value) => { return { text: value, value }; }) || []; - // Use root ref as the default selection - if (rootRef && !this.hasSelectedSourceBranch) { - this.onSourceBranchSelect(rootRef); + if (append) { + this.sourceBranchNames.push(...branchNameItems); + } else { + this.sourceBranchNames = branchNameItems; + + // Use root ref as the default selection + if (rootRef && !this.hasSelectedSourceBranch) { + this.onSourceBranchSelect(rootRef); + } } } catch (err) { + logError(err); this.onError({ message: __('Something went wrong while fetching source branches.'), }); - } finally { - this.sourceBranchNamesLoading = false; } }, }, @@ -107,6 +133,7 @@ export default { <template> <gl-collapsible-listbox :class="{ 'gl-font-monospace': hasSelectedSourceBranch }" + :selected="selectedBranchName" :disabled="!hasSelectedProject" :items="sourceBranchNames" :loading="initialSourceBranchNamesLoading" @@ -114,6 +141,9 @@ export default { :searching="sourceBranchNamesLoading" :toggle-text="branchDropdownText" fluid-width + :infinite-scroll="hasMoreBranches" + :infinite-scroll-loading="sourceBranchNamesLoadingMore" + @bottom-reached="onBottomReached" @search="onSearch" @select="onSourceBranchSelect" /> diff --git a/app/assets/javascripts/jira_connect/branches/index.js b/app/assets/javascripts/jira_connect/branches/index.js index a9a56a6362e..893b9dfa1c7 100644 --- a/app/assets/javascripts/jira_connect/branches/index.js +++ b/app/assets/javascripts/jira_connect/branches/index.js @@ -19,6 +19,7 @@ export default function initJiraConnectBranches() { return new Vue({ el, + name: 'JiraConnectNewBranchRoot', apolloProvider, provide: { initialBranchName, |