diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-02-10 21:10:50 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-02-10 21:10:50 +0300 |
commit | f27a1b0faf16a83ba9c3f71f660262e368f4509a (patch) | |
tree | f87277526b25da417b30a425c51bbd81eff6639b /app/assets/javascripts/confidential_merge_request | |
parent | ae1b3d982482280f22a907faba2c9ba02f4d1db1 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/confidential_merge_request')
-rw-r--r-- | app/assets/javascripts/confidential_merge_request/components/dropdown.vue | 48 | ||||
-rw-r--r-- | app/assets/javascripts/confidential_merge_request/components/project_form_group.vue | 2 |
2 files changed, 27 insertions, 23 deletions
diff --git a/app/assets/javascripts/confidential_merge_request/components/dropdown.vue b/app/assets/javascripts/confidential_merge_request/components/dropdown.vue index 9cb7cd9607f..c937e65abe3 100644 --- a/app/assets/javascripts/confidential_merge_request/components/dropdown.vue +++ b/app/assets/javascripts/confidential_merge_request/components/dropdown.vue @@ -1,11 +1,10 @@ <script> -import { GlDropdown, GlDropdownItem } from '@gitlab/ui'; +import { GlCollapsibleListbox } from '@gitlab/ui'; import { __ } from '~/locale'; export default { components: { - GlDropdown, - GlDropdownItem, + GlCollapsibleListbox, }, props: { projects: { @@ -19,32 +18,37 @@ export default { }, }, computed: { - dropdownText() { - if (Object.keys(this.selectedProject).length) { - return this.selectedProject.name; - } - - return __('Select private project'); + selectedProjectValue() { + return this.selectedProject?.id && String(this.selectedProject.id); + }, + toggleText() { + return this.selectedProject?.name || __('Select private project'); + }, + listboxItems() { + return this.projects.map(({ id, name }) => { + return { + value: String(id), + text: name, + }; + }); }, }, methods: { - selectProject(project) { - this.$emit('click', project); + selectProject(projectId) { + const project = this.projects.find(({ id }) => String(id) === projectId); + this.$emit('select', project); }, }, }; </script> <template> - <gl-dropdown block icon="lock" :text="dropdownText"> - <gl-dropdown-item - v-for="project in projects" - :key="project.id" - is-check-item - :is-checked="project.id === selectedProject.id" - @click="selectProject(project)" - > - {{ project.name }} - </gl-dropdown-item> - </gl-dropdown> + <gl-collapsible-listbox + icon="lock" + :items="listboxItems" + :selected="selectedProjectValue" + :toggle-text="toggleText" + block + @select="selectProject" + /> </template> diff --git a/app/assets/javascripts/confidential_merge_request/components/project_form_group.vue b/app/assets/javascripts/confidential_merge_request/components/project_form_group.vue index e95424eef4d..196f5537a90 100644 --- a/app/assets/javascripts/confidential_merge_request/components/project_form_group.vue +++ b/app/assets/javascripts/confidential_merge_request/components/project_form_group.vue @@ -114,7 +114,7 @@ export default { v-if="projects.length" :projects="projects" :selected-project="selectedProject" - @click="selectProject" + @select="selectProject" /> <p class="gl-text-gray-600 gl-mt-1 gl-mb-0"> <template v-if="projects.length"> |