diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-10-11 12:11:29 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-10-11 12:11:29 +0300 |
commit | 289ce60cdc5fe83278ff01f9506db862e6f8e9ac (patch) | |
tree | afd09e3f3c66e5583f646b6bf9fd351fd7f363f0 /app/assets | |
parent | fd92c8afee165b1da0f0d2386fdf4382bf6d7ab2 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets')
6 files changed, 34 insertions, 38 deletions
diff --git a/app/assets/javascripts/super_sidebar/components/brand_logo.vue b/app/assets/javascripts/super_sidebar/components/brand_logo.vue index 2e6c597ea96..c280c03591b 100644 --- a/app/assets/javascripts/super_sidebar/components/brand_logo.vue +++ b/app/assets/javascripts/super_sidebar/components/brand_logo.vue @@ -26,7 +26,7 @@ export default { <template> <a - v-gl-tooltip:super-sidebar.hover.bottom="$options.i18n.homepage" + v-gl-tooltip:super-sidebar.bottom="$options.i18n.homepage" class="brand-logo" :href="rootPath" data-track-action="click_link" diff --git a/app/assets/javascripts/super_sidebar/components/create_menu.vue b/app/assets/javascripts/super_sidebar/components/create_menu.vue index c526afa2371..279e689bd8d 100644 --- a/app/assets/javascripts/super_sidebar/components/create_menu.vue +++ b/app/assets/javascripts/super_sidebar/components/create_menu.vue @@ -62,7 +62,7 @@ export default { <template> <gl-disclosure-dropdown - v-gl-tooltip:super-sidebar.hover.bottom="dropdownOpen ? '' : $options.i18n.createNew" + v-gl-tooltip:super-sidebar.bottom="dropdownOpen ? '' : $options.i18n.createNew" category="tertiary" icon="plus" no-caret diff --git a/app/assets/javascripts/super_sidebar/components/super_sidebar_toggle.vue b/app/assets/javascripts/super_sidebar/components/super_sidebar_toggle.vue index 049a61e17c7..71c1460423e 100644 --- a/app/assets/javascripts/super_sidebar/components/super_sidebar_toggle.vue +++ b/app/assets/javascripts/super_sidebar/components/super_sidebar_toggle.vue @@ -89,7 +89,7 @@ export default { <template> <gl-button - v-gl-tooltip.hover="tooltip" + v-gl-tooltip="tooltip" aria-controls="super-sidebar" :aria-expanded="ariaExpanded" :aria-label="$options.i18n.primaryNavigationSidebar" diff --git a/app/assets/javascripts/super_sidebar/components/user_bar.vue b/app/assets/javascripts/super_sidebar/components/user_bar.vue index ea634d43a96..88ea4d828b7 100644 --- a/app/assets/javascripts/super_sidebar/components/user_bar.vue +++ b/app/assets/javascripts/super_sidebar/components/user_bar.vue @@ -153,7 +153,7 @@ export default { class="gl-display-flex gl-justify-content-space-between gl-gap-2" > <counter - v-gl-tooltip:super-sidebar.hover.bottom="$options.i18n.issues" + v-gl-tooltip:super-sidebar.bottom="$options.i18n.issues" class="gl-flex-basis-third dashboard-shortcuts-issues" icon="issues" :count="userCounts.assigned_issues" @@ -171,7 +171,7 @@ export default { @hidden="mrMenuShown = false" > <counter - v-gl-tooltip:super-sidebar.hover.bottom="mrMenuShown ? '' : $options.i18n.mergeRequests" + v-gl-tooltip:super-sidebar.bottom="mrMenuShown ? '' : $options.i18n.mergeRequests" class="gl-w-full" icon="merge-request-open" :count="mergeRequestTotalCount" @@ -183,7 +183,7 @@ export default { /> </merge-request-menu> <counter - v-gl-tooltip:super-sidebar.hover.bottom="$options.i18n.todoList" + v-gl-tooltip:super-sidebar.bottom="$options.i18n.todoList" class="gl-flex-basis-third shortcuts-todos js-todos-count" icon="todo-done" :count="userCounts.todos" @@ -197,7 +197,7 @@ export default { </div> <button id="super-sidebar-search" - v-gl-tooltip.bottom.hover.html="searchTooltip" + v-gl-tooltip.bottom.html="searchTooltip" v-gl-modal="$options.SEARCH_MODAL_ID" class="counter gl-display-block gl-py-3 gl-bg-gray-10 gl-rounded-base gl-text-gray-900 gl-border-none gl-inset-border-1-gray-a-08 gl-line-height-1 gl-focus--focus gl-w-full" data-testid="super-sidebar-search-button" diff --git a/app/assets/javascripts/vue_shared/alert_details/components/alert_status.vue b/app/assets/javascripts/vue_shared/alert_details/components/alert_status.vue index 8d2ef20b381..3855e4fc078 100644 --- a/app/assets/javascripts/vue_shared/alert_details/components/alert_status.vue +++ b/app/assets/javascripts/vue_shared/alert_details/components/alert_status.vue @@ -1,5 +1,5 @@ <script> -import { GlDropdown, GlDropdownItem } from '@gitlab/ui'; +import { GlCollapsibleListbox } from '@gitlab/ui'; import updateAlertStatusMutation from '~/graphql_shared/mutations/alert_status_update.mutation.graphql'; import { s__ } from '~/locale'; import Tracking from '~/tracking'; @@ -11,10 +11,10 @@ export default { 'AlertManagement|There was an error while updating the status of the alert.', ), UPDATE_ALERT_STATUS_INSTRUCTION: s__('AlertManagement|Please try again.'), + ASSIGN_STATUS_HEADER: s__('AlertManagement|Assign status'), }, components: { - GlDropdown, - GlDropdownItem, + GlCollapsibleListbox, }, inject: { trackAlertStatusUpdateOptions: { @@ -44,10 +44,20 @@ export default { default: () => PAGE_CONFIG.OPERATIONS.STATUSES, }, }, + data() { + return { + alertStatus: this.alert.status, + }; + }, computed: { dropdownClass() { - // eslint-disable-next-line no-nested-ternary - return this.isSidebar ? (this.isDropdownShowing ? 'show' : 'gl-display-none') : ''; + return this.isSidebar && !this.isDropdownShowing ? 'gl-display-none' : ''; + }, + items() { + return Object.entries(this.statuses).map(([value, text]) => ({ value, text })); + }, + headerText() { + return this.isSidebar ? this.$options.i18n.ASSIGN_STATUS_HEADER : ''; }, }, methods: { @@ -97,30 +107,15 @@ export default { <template> <div class="dropdown dropdown-menu-selectable" :class="dropdownClass"> - <gl-dropdown + <gl-collapsible-listbox ref="dropdown" - right - :text="statuses[alert.status]" - class="w-100" - toggle-class="dropdown-menu-toggle" - @keydown.esc.native="$emit('hide-dropdown')" - @hide="$emit('hide-dropdown')" - > - <p v-if="isSidebar" class="gl-dropdown-header-top" data-testid="dropdown-header"> - {{ s__('AlertManagement|Assign status') }} - </p> - <div class="dropdown-content dropdown-body"> - <gl-dropdown-item - v-for="(label, field) in statuses" - :key="field" - data-testid="statusDropdownItem" - :active="field === alert.status" - :active-class="'is-active'" - @click="updateAlertStatus(field)" - > - {{ label }} - </gl-dropdown-item> - </div> - </gl-dropdown> + v-model="alertStatus" + placement="right" + :header-text="headerText" + :items="items" + block + @hidden="$emit('hide-dropdown')" + @select="updateAlertStatus" + /> </div> </template> diff --git a/app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_status.vue b/app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_status.vue index c512585b980..7b099516c5b 100644 --- a/app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_status.vue +++ b/app/assets/javascripts/vue_shared/alert_details/components/sidebar/sidebar_status.vue @@ -58,9 +58,10 @@ export default { }, toggleFormDropdown() { this.isDropdownShowing = !this.isDropdownShowing; - const { dropdown } = this.$refs.status.$refs.dropdown.$refs; + const { dropdown } = this.$refs.status.$refs; + if (dropdown && this.isDropdownShowing) { - dropdown.show(); + dropdown.open(); } }, handleUpdating(isMutationInProgress) { |