diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2021-03-26 15:09:15 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2021-03-26 15:09:15 +0300 |
commit | c0dd450008c1cee260905e54bbed202891158697 (patch) | |
tree | 0b034d5e4568303b77302325fc8656bb040b90b4 /app/assets/javascripts | |
parent | 26bba9525deb5e9d05fd29cf5b286e7a65d1c791 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts')
27 files changed, 164 insertions, 58 deletions
diff --git a/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue b/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue index a071e011ec3..417ecd7f3b4 100644 --- a/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue +++ b/app/assets/javascripts/alerts_settings/components/alerts_integrations_list.vue @@ -21,6 +21,8 @@ import { import getCurrentIntegrationQuery from '../graphql/queries/get_current_integration.query.graphql'; export const i18n = { + deleteIntegration: s__('AlertSettings|Delete integration'), + editIntegration: s__('AlertSettings|Edit integration'), title: s__('AlertsIntegrations|Current integrations'), emptyState: s__('AlertsIntegrations|No integrations have been added yet'), status: { @@ -174,11 +176,16 @@ export default { <template #cell(actions)="{ item }"> <gl-button-group class="gl-ml-3"> - <gl-button icon="settings" @click="editIntegration(item)" /> + <gl-button + icon="settings" + :aria-label="$options.i18n.editIntegration" + @click="editIntegration(item)" + /> <gl-button v-gl-modal.deleteIntegration :disabled="item.type === $options.typeSet.prometheus" icon="remove" + :aria-label="$options.i18n.deleteIntegration" @click="setIntegrationToDelete(item)" /> </gl-button-group> @@ -198,8 +205,8 @@ export default { </gl-table> <gl-modal modal-id="deleteIntegration" - :title="s__('AlertSettings|Delete integration')" - :ok-title="s__('AlertSettings|Delete integration')" + :title="$options.i18n.deleteIntegration" + :ok-title="$options.i18n.deleteIntegration" ok-variant="danger" @ok="deleteIntegration" > diff --git a/app/assets/javascripts/api.js b/app/assets/javascripts/api.js index 8dc44231e26..0015044bb66 100644 --- a/app/assets/javascripts/api.js +++ b/app/assets/javascripts/api.js @@ -44,7 +44,7 @@ const Api = { projectMilestonesPath: '/api/:version/projects/:id/milestones', projectIssuePath: '/api/:version/projects/:id/issues/:issue_iid', mergeRequestsPath: '/api/:version/merge_requests', - groupLabelsPath: '/groups/:namespace_path/-/labels', + groupLabelsPath: '/api/:version/groups/:namespace_path/labels', issuableTemplatePath: '/:namespace_path/:project_path/templates/:type/:key', issuableTemplatesPath: '/:namespace_path/:project_path/templates/:type', projectTemplatePath: '/api/:version/projects/:id/templates/:type/:key', @@ -402,18 +402,29 @@ const Api = { newLabel(namespacePath, projectPath, data, callback) { let url; + let payload; if (projectPath) { url = Api.buildUrl(Api.projectLabelsPath) .replace(':namespace_path', namespacePath) .replace(':project_path', projectPath); + payload = { + label: data, + }; } else { url = Api.buildUrl(Api.groupLabelsPath).replace(':namespace_path', namespacePath); + + // groupLabelsPath uses public API which accepts + // `name` and `color` props. + payload = { + name: data.title, + color: data.color, + }; } return axios .post(url, { - label: data, + ...payload, }) .then((res) => callback(res.data)) .catch((e) => callback(e.response.data)); diff --git a/app/assets/javascripts/badges/components/badge.vue b/app/assets/javascripts/badges/components/badge.vue index 9e5d70075f3..309af368df9 100644 --- a/app/assets/javascripts/badges/components/badge.vue +++ b/app/assets/javascripts/badges/components/badge.vue @@ -1,7 +1,11 @@ <script> import { GlLoadingIcon, GlTooltipDirective, GlIcon, GlButton } from '@gitlab/ui'; +import { s__ } from '~/locale'; export default { + i18n: { + buttonLabel: s__('Badges|Reload badge image'), + }, // name: 'Badge' is a false positive: https://gitlab.com/gitlab-org/frontend/eslint-plugin-i18n/issues/25 // eslint-disable-next-line @gitlab/require-i18n-strings name: 'Badge', @@ -94,7 +98,8 @@ export default { <gl-button v-show="hasError" v-gl-tooltip.hover - :title="s__('Badges|Reload badge image')" + :title="$options.i18n.buttonLabel" + :aria-label="$options.i18n.buttonLabel" category="tertiary" variant="confirm" type="button" diff --git a/app/assets/javascripts/boards/components/board_form.vue b/app/assets/javascripts/boards/components/board_form.vue index 8c354c61fa2..e5eec70c544 100644 --- a/app/assets/javascripts/boards/components/board_form.vue +++ b/app/assets/javascripts/boards/components/board_form.vue @@ -163,6 +163,9 @@ export default { currentMutation() { return this.board.id ? updateBoardMutation : createBoardMutation; }, + deleteMutation() { + return destroyBoardMutation; + }, baseMutationVariables() { const { board } = this; const variables = { @@ -244,17 +247,20 @@ export default { return this.boardUpdateResponse(response.data); }, + async deleteBoard() { + await this.$apollo.mutate({ + mutation: this.deleteMutation, + variables: { + id: fullBoardId(this.board.id), + }, + }); + }, async submit() { if (this.board.name.length === 0) return; this.isLoading = true; if (this.isDeleteForm) { try { - await this.$apollo.mutate({ - mutation: destroyBoardMutation, - variables: { - id: fullBoardId(this.board.id), - }, - }); + await this.deleteBoard(); visitUrl(this.rootPath); } catch { Flash(this.$options.i18n.deleteErrorMessage); diff --git a/app/assets/javascripts/boards/components/toggle_focus.vue b/app/assets/javascripts/boards/components/toggle_focus.vue index dc0f8ffd0fd..87a1d517111 100644 --- a/app/assets/javascripts/boards/components/toggle_focus.vue +++ b/app/assets/javascripts/boards/components/toggle_focus.vue @@ -47,6 +47,7 @@ export default { class="js-focus-mode-btn" data-qa-selector="focus_mode_button" :title="$options.i18n.toggleFocusMode" + :aria-label="$options.i18n.toggleFocusMode" @click="toggleFocusMode" /> </div> diff --git a/app/assets/javascripts/ci_settings_pipeline_triggers/components/triggers_list.vue b/app/assets/javascripts/ci_settings_pipeline_triggers/components/triggers_list.vue index 0233ffaccdc..bc1e401d373 100644 --- a/app/assets/javascripts/ci_settings_pipeline_triggers/components/triggers_list.vue +++ b/app/assets/javascripts/ci_settings_pipeline_triggers/components/triggers_list.vue @@ -7,6 +7,10 @@ import TooltipOnTruncate from '~/vue_shared/components/tooltip_on_truncate.vue'; import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue'; export default { + i18n: { + editButton: s__('Pipelines|Edit'), + revokeButton: s__('Pipelines|Revoke'), + }, components: { GlTable, GlButton, @@ -108,13 +112,15 @@ export default { </template> <template #cell(actions)="{ item }"> <gl-button - :title="s__('Pipelines|Edit')" + :title="$options.i18n.editButton" + :aria-label="$options.i18n.editButton" icon="pencil" data-testid="edit-btn" :href="item.editProjectTriggerPath" /> <gl-button - :title="s__('Pipelines|Revoke')" + :title="$options.i18n.revokeButton" + :aria-label="$options.i18n.revokeButton" icon="remove" variant="warning" :data-confirm=" diff --git a/app/assets/javascripts/deprecated_jquery_dropdown/gl_dropdown_filter.js b/app/assets/javascripts/deprecated_jquery_dropdown/gl_dropdown_filter.js index b1d486c5d66..8ca4dc587a8 100644 --- a/app/assets/javascripts/deprecated_jquery_dropdown/gl_dropdown_filter.js +++ b/app/assets/javascripts/deprecated_jquery_dropdown/gl_dropdown_filter.js @@ -2,6 +2,7 @@ import fuzzaldrinPlus from 'fuzzaldrin-plus'; import $ from 'jquery'; +import { debounce } from 'lodash'; import { isObject } from '~/lib/utils/type_utility'; const BLUR_KEYCODES = [27, 40]; @@ -11,13 +12,21 @@ const HAS_VALUE_CLASS = 'has-value'; export class GitLabDropdownFilter { constructor(input, options) { let ref; - let timeout; this.input = input; this.options = options; // eslint-disable-next-line no-cond-assign this.filterInputBlur = (ref = this.options.filterInputBlur) != null ? ref : true; const $inputContainer = this.input.parent(); const $clearButton = $inputContainer.find('.js-dropdown-input-clear'); + const filterRemoteDebounced = debounce(() => { + $inputContainer.parent().addClass('is-loading'); + + return this.options.query(this.input.val(), (data) => { + $inputContainer.parent().removeClass('is-loading'); + return this.options.callback(data); + }); + }, 500); + $clearButton.on('click', (e) => { // Clear click e.preventDefault(); @@ -25,7 +34,6 @@ export class GitLabDropdownFilter { return this.input.val('').trigger('input').focus(); }); // Key events - timeout = ''; this.input .on('keydown', (e) => { const keyCode = e.which; @@ -41,16 +49,7 @@ export class GitLabDropdownFilter { } // Only filter asynchronously only if option remote is set if (this.options.remote) { - clearTimeout(timeout); - // eslint-disable-next-line no-return-assign - return (timeout = setTimeout(() => { - $inputContainer.parent().addClass('is-loading'); - - return this.options.query(this.input.val(), (data) => { - $inputContainer.parent().removeClass('is-loading'); - return this.options.callback(data); - }); - }, 250)); + return filterRemoteDebounced(); } return this.filter(this.input.val()); }); diff --git a/app/assets/javascripts/design_management/components/toolbar/design_navigation.vue b/app/assets/javascripts/design_management/components/toolbar/design_navigation.vue index 8535f818b9c..3ebcde817f9 100644 --- a/app/assets/javascripts/design_management/components/toolbar/design_navigation.vue +++ b/app/assets/javascripts/design_management/components/toolbar/design_navigation.vue @@ -12,6 +12,10 @@ import allDesignsMixin from '../../mixins/all_designs'; import { DESIGN_ROUTE_NAME } from '../../router/constants'; export default { + i18n: { + nextButton: s__('DesignManagement|Go to next design'), + previousButton: s__('DesignManagement|Go to previous design'), + }, components: { GlButton, GlButtonGroup, @@ -81,7 +85,8 @@ export default { <gl-button v-gl-tooltip.bottom :disabled="!previousDesign" - :title="s__('DesignManagement|Go to previous design')" + :title="$options.i18n.previousButton" + :aria-label="$options.i18n.previousButton" icon="angle-left" class="js-previous-design" @click="navigateToDesign(previousDesign)" @@ -89,7 +94,8 @@ export default { <gl-button v-gl-tooltip.bottom :disabled="!nextDesign" - :title="s__('DesignManagement|Go to next design')" + :title="$options.i18n.nextButton" + :aria-label="$options.i18n.nextButton" icon="angle-right" class="js-next-design" @click="navigateToDesign(nextDesign)" diff --git a/app/assets/javascripts/diffs/components/compare_versions.vue b/app/assets/javascripts/diffs/components/compare_versions.vue index 6b1e2bfb34e..3fb9787ac30 100644 --- a/app/assets/javascripts/diffs/components/compare_versions.vue +++ b/app/assets/javascripts/diffs/components/compare_versions.vue @@ -84,6 +84,7 @@ export default { icon="file-tree" class="gl-mr-3 js-toggle-tree-list" :title="toggleFileBrowserTitle" + :aria-label="toggleFileBrowserTitle" :selected="showTreeList" @click="setShowTreeList({ showTreeList: !showTreeList })" /> diff --git a/app/assets/javascripts/environments/components/environment_rollback.vue b/app/assets/javascripts/environments/components/environment_rollback.vue index 397616c654f..c0b4e96cea2 100644 --- a/app/assets/javascripts/environments/components/environment_rollback.vue +++ b/app/assets/javascripts/environments/components/environment_rollback.vue @@ -71,6 +71,7 @@ export default { class="gl-display-none gl-md-display-block text-secondary" :loading="isLoading" :title="title" + :aria-label="title" :icon="isLastDeployment ? 'repeat' : 'redo'" @click="onClick" /> diff --git a/app/assets/javascripts/issuable/components/issuable_by_email.vue b/app/assets/javascripts/issuable/components/issuable_by_email.vue index 6d063b59922..d0ce8c2c34b 100644 --- a/app/assets/javascripts/issuable/components/issuable_by_email.vue +++ b/app/assets/javascripts/issuable/components/issuable_by_email.vue @@ -14,6 +14,9 @@ import { sprintf, __ } from '~/locale'; import ModalCopyButton from '~/vue_shared/components/modal_copy_button.vue'; export default { + i18n: { + sendEmail: __('Send email'), + }, name: 'IssuableByEmail', components: { GlButton, @@ -116,7 +119,8 @@ export default { <gl-button v-gl-tooltip.hover :href="mailToLink" - :title="__('Send email')" + :title="$options.i18n.sendEmail" + :aria-label="$options.i18n.sendEmail" icon="mail" data-testid="mail-to-btn" /> diff --git a/app/assets/javascripts/issuable_show/components/issuable_title.vue b/app/assets/javascripts/issuable_show/components/issuable_title.vue index b7ea4a010a3..b96ce0c43f7 100644 --- a/app/assets/javascripts/issuable_show/components/issuable_title.vue +++ b/app/assets/javascripts/issuable_show/components/issuable_title.vue @@ -6,8 +6,12 @@ import { GlTooltipDirective, GlSafeHtmlDirective as SafeHtml, } from '@gitlab/ui'; +import { __ } from '~/locale'; export default { + i18n: { + editTitleAndDescription: __('Edit title and description'), + }, components: { GlIcon, GlButton, @@ -58,7 +62,8 @@ export default { <gl-button v-if="enableEdit" v-gl-tooltip.bottom - :title="__('Edit title and description')" + :title="$options.i18n.editTitleAndDescription" + :aria-label="$options.i18n.editTitleAndDescription" icon="pencil" class="btn-edit js-issuable-edit qa-edit-button" @click="$emit('edit-issuable', $event)" diff --git a/app/assets/javascripts/issue_show/components/title.vue b/app/assets/javascripts/issue_show/components/title.vue index 806d95ca748..5e92211685a 100644 --- a/app/assets/javascripts/issue_show/components/title.vue +++ b/app/assets/javascripts/issue_show/components/title.vue @@ -1,9 +1,13 @@ <script> import { GlButton, GlTooltipDirective, GlSafeHtmlDirective as SafeHtml } from '@gitlab/ui'; +import { __ } from '~/locale'; import eventHub from '../event_hub'; import animateMixin from '../mixins/animate'; export default { + i18n: { + editTitleAndDescription: __('Edit title and description'), + }, components: { GlButton, }, @@ -78,7 +82,8 @@ export default { v-gl-tooltip.bottom icon="pencil" class="btn-edit js-issuable-edit qa-edit-button" - title="Edit title and description" + :title="$options.i18n.editTitleAndDescription" + :aria-label="$options.i18n.editTitleAndDescription" @click="edit" /> </div> diff --git a/app/assets/javascripts/monitoring/components/dashboard_header.vue b/app/assets/javascripts/monitoring/components/dashboard_header.vue index 3c423bea368..05b5b760f0a 100644 --- a/app/assets/javascripts/monitoring/components/dashboard_header.vue +++ b/app/assets/javascripts/monitoring/components/dashboard_header.vue @@ -14,6 +14,7 @@ import { debounce } from 'lodash'; import { mapActions, mapState, mapGetters } from 'vuex'; import invalidUrl from '~/lib/utils/invalid_url'; import { mergeUrlParams, redirectTo } from '~/lib/utils/url_utility'; +import { s__ } from '~/locale'; import DateTimePicker from '~/vue_shared/components/date_time_picker/date_time_picker.vue'; import { timeRanges } from '~/vue_shared/constants'; @@ -24,6 +25,9 @@ import DashboardsDropdown from './dashboards_dropdown.vue'; import RefreshButton from './refresh_button.vue'; export default { + i18n: { + metricsSettings: s__('Metrics|Metrics Settings'), + }, components: { GlIcon, GlButton, @@ -282,7 +286,8 @@ export default { data-testid="metrics-settings-button" icon="settings" :href="operationsSettingsPath" - :title="s__('Metrics|Metrics Settings')" + :title="$options.i18n.metricsSettings" + :aria-label="$options.i18n.metricsSettings" /> </div> </template> diff --git a/app/assets/javascripts/monitoring/components/refresh_button.vue b/app/assets/javascripts/monitoring/components/refresh_button.vue index 3daf5b38933..0b80043a92c 100644 --- a/app/assets/javascripts/monitoring/components/refresh_button.vue +++ b/app/assets/javascripts/monitoring/components/refresh_button.vue @@ -9,7 +9,7 @@ import { } from '@gitlab/ui'; import Visibility from 'visibilityjs'; import { mapActions } from 'vuex'; -import { n__, __ } from '~/locale'; +import { n__, __, s__ } from '~/locale'; import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; @@ -45,6 +45,9 @@ const makeInterval = (length = 0, unit = 's') => { }; export default { + i18n: { + refreshDashboard: s__('Metrics|Refresh dashboard'), + }, components: { GlButtonGroup, GlButton, @@ -148,7 +151,8 @@ export default { v-gl-tooltip class="gl-flex-grow-1" variant="default" - :title="s__('Metrics|Refresh dashboard')" + :title="$options.i18n.refreshDashboard" + :aria-label="$options.i18n.refreshDashboard" icon="retry" @click="refresh" /> diff --git a/app/assets/javascripts/notes/components/discussion_resolve_with_issue_button.vue b/app/assets/javascripts/notes/components/discussion_resolve_with_issue_button.vue index cace382ccd6..5f429cbf462 100644 --- a/app/assets/javascripts/notes/components/discussion_resolve_with_issue_button.vue +++ b/app/assets/javascripts/notes/components/discussion_resolve_with_issue_button.vue @@ -1,7 +1,11 @@ <script> import { GlTooltipDirective, GlButton } from '@gitlab/ui'; +import { s__ } from '~/locale'; export default { + i18n: { + buttonLabel: s__('MergeRequests|Resolve this thread in a new issue'), + }, name: 'ResolveWithIssueButton', components: { GlButton, @@ -23,7 +27,8 @@ export default { <gl-button v-gl-tooltip :href="url" - :title="s__('MergeRequests|Resolve this thread in a new issue')" + :title="$options.i18n.buttonLabel" + :aria-label="$options.i18n.buttonLabel" class="new-issue-for-discussion discussion-create-issue-btn" icon="issue-new" /> diff --git a/app/assets/javascripts/notes/components/sort_discussion.vue b/app/assets/javascripts/notes/components/sort_discussion.vue index ed1f456c174..92c39fbb9f0 100644 --- a/app/assets/javascripts/notes/components/sort_discussion.vue +++ b/app/assets/javascripts/notes/components/sort_discussion.vue @@ -49,18 +49,17 @@ export default { </script> <template> - <div class="gl-mr-3 gl-display-inline-block gl-vertical-align-bottom full-width-mobile"> + <div + data-testid="sort-discussion-filter" + class="gl-mr-3 gl-display-inline-block gl-vertical-align-bottom full-width-mobile" + > <local-storage-sync :value="sortDirection" :storage-key="storageKey" :persist="persistSortOrder" @input="setDiscussionSortDirection({ direction: $event })" /> - <gl-dropdown - :text="dropdownText" - data-testid="sort-discussion-filter" - class="js-dropdown-text full-width-mobile" - > + <gl-dropdown :text="dropdownText" class="js-dropdown-text full-width-mobile"> <gl-dropdown-item v-for="{ text, key, cls } in $options.SORT_OPTIONS" :key="key" diff --git a/app/assets/javascripts/registry/settings/components/settings_form.vue b/app/assets/javascripts/registry/settings/components/settings_form.vue index eb731c382e1..1360e09a75d 100644 --- a/app/assets/javascripts/registry/settings/components/settings_form.vue +++ b/app/assets/javascripts/registry/settings/components/settings_form.vue @@ -110,12 +110,12 @@ export default { mutationVariables() { return { projectPath: this.projectPath, - enabled: this.value.enabled, - cadence: this.value.cadence, - olderThan: this.value.olderThan, - keepN: this.value.keepN, - nameRegex: this.value.nameRegex, - nameRegexKeep: this.value.nameRegexKeep, + enabled: this.prefilledForm.enabled, + cadence: this.prefilledForm.cadence, + olderThan: this.prefilledForm.olderThan, + keepN: this.prefilledForm.keepN, + nameRegex: this.prefilledForm.nameRegex, + nameRegexKeep: this.prefilledForm.nameRegexKeep, }; }, }, @@ -291,8 +291,8 @@ export default { type="submit" :disabled="isSubmitButtonDisabled" :loading="showLoadingIcon" - variant="success" category="primary" + variant="confirm" class="js-no-auto-disable gl-mr-4" > {{ $options.i18n.SET_CLEANUP_POLICY_BUTTON }} diff --git a/app/assets/javascripts/releases/components/release_block_header.vue b/app/assets/javascripts/releases/components/release_block_header.vue index 356fc0f3bf3..89bc314db89 100644 --- a/app/assets/javascripts/releases/components/release_block_header.vue +++ b/app/assets/javascripts/releases/components/release_block_header.vue @@ -1,9 +1,13 @@ <script> import { GlTooltipDirective, GlLink, GlBadge, GlButton, GlIcon } from '@gitlab/ui'; import { setUrlParams } from '~/lib/utils/url_utility'; +import { __ } from '~/locale'; import { BACK_URL_PARAM } from '~/releases/constants'; export default { + i18n: { + editButton: __('Edit this release'), + }, name: 'ReleaseBlockHeader', components: { GlLink, @@ -69,7 +73,8 @@ export default { variant="default" icon="pencil" class="gl-mr-3 js-edit-button ml-2 pb-2" - :title="__('Edit this release')" + :title="$options.i18n.editButton" + :aria-label="$options.i18n.editButton" :href="editLink" /> </div> diff --git a/app/assets/javascripts/search/sort/components/app.vue b/app/assets/javascripts/search/sort/components/app.vue index e4eba655e39..2bf144705c4 100644 --- a/app/assets/javascripts/search/sort/components/app.vue +++ b/app/assets/javascripts/search/sort/components/app.vue @@ -96,6 +96,7 @@ export default { v-gl-tooltip :disabled="!selectedSortOption.sortable" :title="sortDirectionData.tooltip" + :aria-label="sortDirectionData.tooltip" :icon="sortDirectionData.icon" @click="handleSortDirectionChange" /> diff --git a/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue b/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue index dd1d54d67f2..c6fef86c6ff 100644 --- a/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue +++ b/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue @@ -1,12 +1,15 @@ <script> import { GlButton, GlTooltipDirective, GlIcon } from '@gitlab/ui'; -import { sprintf, s__ } from '~/locale'; +import { __, sprintf, s__ } from '~/locale'; import ReviewerAvatarLink from './reviewer_avatar_link.vue'; const LOADING_STATE = 'loading'; const SUCCESS_STATE = 'success'; export default { + i18n: { + reRequestReview: __('Re-request review'), + }, components: { GlButton, GlIcon, @@ -109,7 +112,8 @@ export default { <gl-button v-else-if="user.can_update_merge_request && user.reviewed" v-gl-tooltip.left - :title="__('Re-request review')" + :title="$options.i18n.reRequestReview" + :aria-label="$options.i18n.reRequestReview" :loading="loadingStates[user.id] === $options.LOADING_STATE" class="float-right gl-text-gray-500!" size="small" diff --git a/app/assets/javascripts/snippets/components/embed_dropdown.vue b/app/assets/javascripts/snippets/components/embed_dropdown.vue index f6c9c569b5f..ad1b08a5a07 100644 --- a/app/assets/javascripts/snippets/components/embed_dropdown.vue +++ b/app/assets/javascripts/snippets/components/embed_dropdown.vue @@ -65,6 +65,7 @@ export default { <gl-button v-gl-tooltip.hover :title="$options.MSG_COPY" + :aria-label="$options.MSG_COPY" :data-clipboard-text="value" icon="copy-to-clipboard" data-qa-selector="copy_button" diff --git a/app/assets/javascripts/static_site_editor/graphql/index.js b/app/assets/javascripts/static_site_editor/graphql/index.js index 23f800517c9..2ae2baddbcc 100644 --- a/app/assets/javascripts/static_site_editor/graphql/index.js +++ b/app/assets/javascripts/static_site_editor/graphql/index.js @@ -1,6 +1,7 @@ import Vue from 'vue'; import VueApollo from 'vue-apollo'; import createDefaultClient from '~/lib/graphql'; +import appDataQuery from './queries/app_data.query.graphql'; import fileResolver from './resolvers/file'; import hasSubmittedChangesResolver from './resolvers/has_submitted_changes'; import submitContentChangesResolver from './resolvers/submit_content_changes'; @@ -28,7 +29,8 @@ const createApolloProvider = (appData) => { // eslint-disable-next-line @gitlab/require-i18n-strings const mounts = appData.mounts.map((mount) => ({ __typename: 'Mount', ...mount })); - defaultClient.cache.writeData({ + defaultClient.cache.writeQuery({ + query: appDataQuery, data: { appData: { __typename: 'AppData', diff --git a/app/assets/javascripts/vue_shared/components/clone_dropdown.vue b/app/assets/javascripts/vue_shared/components/clone_dropdown.vue index cd5f63afc79..f14e1992901 100644 --- a/app/assets/javascripts/vue_shared/components/clone_dropdown.vue +++ b/app/assets/javascripts/vue_shared/components/clone_dropdown.vue @@ -56,6 +56,7 @@ export default { <gl-button v-gl-tooltip.hover :title="$options.copyURLTooltip" + :aria-label="$options.copyURLTooltip" :data-clipboard-text="sshLink" data-qa-selector="copy_ssh_url_button" icon="copy-to-clipboard" @@ -75,6 +76,7 @@ export default { <gl-button v-gl-tooltip.hover :title="$options.copyURLTooltip" + :aria-label="$options.copyURLTooltip" :data-clipboard-text="httpLink" data-qa-selector="copy_http_url_button" icon="copy-to-clipboard" diff --git a/app/assets/javascripts/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue b/app/assets/javascripts/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue index 6952c5def8c..107ced550c1 100644 --- a/app/assets/javascripts/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue +++ b/app/assets/javascripts/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue @@ -363,6 +363,7 @@ export default { <gl-button v-gl-tooltip :title="sortDirectionTooltip" + :aria-label="sortDirectionTooltip" :icon="sortDirectionIcon" class="flex-shrink-1" @click="handleSortDirectionClick" diff --git a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/label_token.vue b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/label_token.vue index 9c2a644b7a9..76b005772ec 100644 --- a/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/label_token.vue +++ b/app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/label_token.vue @@ -46,7 +46,7 @@ export default { }, activeLabel() { return this.labels.find( - (label) => label.title.toLowerCase() === stripQuotes(this.currentValue), + (label) => this.getLabelName(label).toLowerCase() === stripQuotes(this.currentValue), ); }, containerStyle() { @@ -69,6 +69,21 @@ export default { }, }, methods: { + /** + * There's an inconsistency between private and public API + * for labels where label name is included in a different + * property; + * + * Private API => `label.title` + * Public API => `label.name` + * + * This method allows compatibility as there may be instances + * where `config.fetchLabels` provided externally may still be + * using either of the two APIs. + */ + getLabelName(label) { + return label.name || label.title; + }, fetchLabelBySearchTerm(searchTerm) { this.loading = true; this.config @@ -85,7 +100,7 @@ export default { }); }, searchLabels: debounce(function debouncedSearch({ data }) { - this.fetchLabelBySearchTerm(data); + if (!this.loading) this.fetchLabelBySearchTerm(data); }, DEBOUNCE_DELAY), }, }; @@ -100,7 +115,7 @@ export default { > <template #view-token="{ inputValue, cssClasses, listeners }"> <gl-token variant="search-value" :class="cssClasses" :style="containerStyle" v-on="listeners" - >~{{ activeLabel ? activeLabel.title : inputValue }}</gl-token + >~{{ activeLabel ? getLabelName(activeLabel) : inputValue }}</gl-token > </template> <template #suggestions> @@ -114,13 +129,17 @@ export default { <gl-dropdown-divider v-if="defaultLabels.length" /> <gl-loading-icon v-if="loading" /> <template v-else> - <gl-filtered-search-suggestion v-for="label in labels" :key="label.id" :value="label.title"> - <div class="gl-display-flex"> + <gl-filtered-search-suggestion + v-for="label in labels" + :key="label.id" + :value="getLabelName(label)" + > + <div class="gl-display-flex gl-align-items-center"> <span :style="{ backgroundColor: label.color }" class="gl-display-inline-block mr-2 p-2" ></span> - <div>{{ label.title }}</div> + <div>{{ getLabelName(label) }}</div> </div> </gl-filtered-search-suggestion> </template> diff --git a/app/assets/javascripts/vue_shared/components/modal_copy_button.vue b/app/assets/javascripts/vue_shared/components/modal_copy_button.vue index 7b36d57dfbf..38afd56bae6 100644 --- a/app/assets/javascripts/vue_shared/components/modal_copy_button.vue +++ b/app/assets/javascripts/vue_shared/components/modal_copy_button.vue @@ -101,6 +101,7 @@ export default { :data-clipboard-target="target" :data-clipboard-text="text" :title="title" + :aria-label="title" :category="category" icon="copy-to-clipboard" /> |