Skip to content

G
gitlab-ce
Commit 5ef5f413 authored by Paul Slaughter's avatar Paul Slaughter
Browse files
Options

Merge branch 'mg-rename-gl-dropdown' into 'master' 

Rename GlDropdown to GlDeprecatedDropdown

See merge request gitlab-org/gitlab!37826
parents 490fd60f 28bbcc93
Hide whitespace changes
Inline Side-by-side
Showing with 822 additions and 715 deletions
app/assets/javascripts/alert_management/components/alert_status.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem, GlButton } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlButton } from '@gitlab/ui';
import { s__ } from '~/locale';
import Tracking from '~/tracking';
import { trackAlertStatusUpdateOptions } from '../constants';
......@@ -18,8 +18,8 @@ export default {
RESOLVED: s__('AlertManagement|Resolved'),
},
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlButton,
},
props: {
......@@ -91,7 +91,7 @@ export default {
<template>
<div class="dropdown dropdown-menu-selectable" :class="dropdownClass">
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
right
:text="$options.statuses[alert.status]"
......@@ -112,7 +112,7 @@ export default {
/>
</div>
<div class="dropdown-content dropdown-body">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="(label, field) in $options.statuses"
:key="field"
data-testid="statusDropdownItem"
......@@ -122,8 +122,8 @@ export default {
@click="updateAlertStatus(label)"
>
{{ label }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</template>
app/assets/javascripts/alert_management/components/sidebar/sidebar_assignee.vue
View file @ 5ef5f413
<script>
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
export default {
components: {
GlDropdownItem,
GlDeprecatedDropdownItem,
},
props: {
user: {
......@@ -24,7 +24,7 @@ export default {
</script>
<template>
<gl-dropdown-item
<gl-deprecated-dropdown-item
:key="user.username"
data-testid="assigneeDropdownItem"
class="assignee-dropdown-item gl-vertical-align-middle"
......@@ -47,5 +47,5 @@ export default {
</strong>
<span class="dropdown-menu-user-username"> {{ user.username }}</span>
</span>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
app/assets/javascripts/alert_management/components/sidebar/sidebar_assignees.vue
View file @ 5ef5f413
<script>
import {
GlIcon,
GlDropdown,
GlDropdownDivider,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
GlLoadingIcon,
GlTooltip,
GlButton,
......@@ -33,10 +33,10 @@ export default {
},
components: {
GlIcon,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDropdownHeader,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlLoadingIcon,
GlTooltip,
GlButton,
......@@ -213,7 +213,7 @@ export default {
</p>
<div class="dropdown dropdown-menu-selectable" :class="dropdownClass">
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
:text="assignedUser"
class="w-100"
......@@ -243,18 +243,18 @@ export default {
</div>
<div class="dropdown-content dropdown-body">
<template v-if="userListValid">
<gl-dropdown-item
<gl-deprecated-dropdown-item
:active="!userName"
active-class="is-active"
@click="updateAlertAssignees('')"
>
{{ __('Unassigned') }}
</gl-dropdown-item>
<gl-dropdown-divider />
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-divider />
<gl-dropdown-header class="mt-0">
<gl-deprecated-dropdown-header class="mt-0">
{{ __('Assignee') }}
</gl-dropdown-header>
</gl-deprecated-dropdown-header>
<sidebar-assignee
v-for="user in sortedUsers"
:key="user.username"
......@@ -263,12 +263,12 @@ export default {
@update-alert-assignees="updateAlertAssignees"
/>
</template>
<gl-dropdown-item v-else-if="userListEmpty">
<gl-deprecated-dropdown-item v-else-if="userListEmpty">
{{ __('No Matching Results') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<gl-loading-icon v-else />
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
<gl-loading-icon v-if="isUpdating" :inline="true" />
......
app/assets/javascripts/boards/components/boards_selector.vue
View file @ 5ef5f413
......@@ -3,10 +3,10 @@ import { throttle } from 'lodash';
import {
GlLoadingIcon,
GlSearchBoxByType,
GlDropdown,
GlDropdownDivider,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
} from '@gitlab/ui';
import httpStatusCodes from '~/lib/utils/http_status';
......@@ -26,10 +26,10 @@ export default {
BoardForm,
GlLoadingIcon,
GlSearchBoxByType,
GlDropdown,
GlDropdownDivider,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
},
props: {
currentBoard: {
......@@ -235,7 +235,7 @@ export default {
<template>
<div class="boards-switcher js-boards-selector gl-mr-3">
<span class="boards-selector-wrapper js-boards-selector-wrapper">
<gl-dropdown
<gl-deprecated-dropdown
data-qa-selector="boards_dropdown"
toggle-class="dropdown-menu-toggle js-dropdown-toggle"
menu-class="flex-column dropdown-extended-height"
......@@ -248,9 +248,9 @@ export default {
</div>
</div>
<gl-dropdown-header class="mt-0">
<gl-deprecated-dropdown-header class="mt-0">
<gl-search-box-by-type ref="searchBox" v-model="filterTerm" />
</gl-dropdown-header>
</gl-deprecated-dropdown-header>
<div
v-if="!loading"
......@@ -259,26 +259,26 @@ export default {
class="dropdown-content flex-fill"
@scroll.passive="throttledSetScrollFade"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-show="filteredBoards.length === 0"
class="no-pointer-events text-secondary"
>
{{ s__('IssueBoards|No matching boards found') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<h6 v-if="showRecentSection" class="dropdown-bold-header my-0">
{{ __('Recent') }}
</h6>
<template v-if="showRecentSection">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="recentBoard in recentBoards"
:key="`recent-${recentBoard.id}`"
class="js-dropdown-item"
:href="`${boardBaseUrl}/${recentBoard.id}`"
>
{{ recentBoard.name }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
<hr v-if="showRecentSection" class="my-1" />
......@@ -287,21 +287,21 @@ export default {
{{ __('All') }}
</h6>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="otherBoard in filteredBoards"
:key="otherBoard.id"
class="js-dropdown-item"
:href="`${boardBaseUrl}/${otherBoard.id}`"
>
{{ otherBoard.name }}
</gl-dropdown-item>
<gl-dropdown-item v-if="hasMissingBoards" class="small unclickable">
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-item v-if="hasMissingBoards" class="small unclickable">
{{
s__(
'IssueBoards|Some of your boards are hidden, activate a license to see them again.',
)
}}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
<div
......@@ -313,25 +313,25 @@ export default {
<gl-loading-icon v-if="loading" />
<div v-if="canAdminBoard">
<gl-dropdown-divider />
<gl-deprecated-dropdown-divider />
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-if="multipleIssueBoardsAvailable"
data-qa-selector="create_new_board_button"
@click.prevent="showPage('new')"
>
{{ s__('IssueBoards|Create new board') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-if="showDelete"
class="text-danger js-delete-board"
@click.prevent="showPage('delete')"
>
{{ s__('IssueBoards|Delete board') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
<board-form
v-if="currentPage"
......
app/assets/javascripts/ci_variable_list/components/ci_environments_dropdown.vue
View file @ 5ef5f413
<script>
import {
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlSearchBoxByType,
GlIcon,
} from '@gitlab/ui';
......@@ -12,9 +12,9 @@ import { mapGetters } from 'vuex';
export default {
name: 'CiEnvironmentsDropdown',
components: {
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlSearchBoxByType,
GlIcon,
},
......@@ -66,9 +66,9 @@ export default {
};
</script>
<template>
<gl-dropdown :text="value">
<gl-deprecated-dropdown :text="value">
<gl-search-box-by-type v-model.trim="searchTerm" class="m-2" />
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="environment in filteredResults"
:key="environment"
@click="selectEnvironment(environment)"
......@@ -79,15 +79,15 @@ export default {
class="vertical-align-middle"
/>
{{ environment }}
</gl-dropdown-item>
<gl-dropdown-item v-if="!filteredResults.length" ref="noMatchingResults">{{
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-item v-if="!filteredResults.length" ref="noMatchingResults">{{
__('No matching results')
}}</gl-dropdown-item>
}}</gl-deprecated-dropdown-item>
<template v-if="shouldRenderCreateButton">
<gl-dropdown-divider />
<gl-dropdown-item @click="createClicked">
<gl-deprecated-dropdown-divider />
<gl-deprecated-dropdown-item @click="createClicked">
{{ composedCreateButtonLabel }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
app/assets/javascripts/clusters/components/crossplane_provider_stack.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem, GlIcon } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlIcon } from '@gitlab/ui';
import { s__ } from '../../locale';
export default {
name: 'CrossplaneProviderStack',
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
},
props: {
......@@ -67,17 +67,21 @@ export default {
<label>
{{ s__('ClusterIntegration|Enabled stack') }}
</label>
<gl-dropdown
<gl-deprecated-dropdown
:disabled="crossplane.installed"
:text="dropdownText"
toggle-class="dropdown-menu-toggle gl-field-error-outline"
class="w-100"
:class="{ 'gl-show-field-errors': validationError }"
>
<gl-dropdown-item v-for="stack in stacks" :key="stack.code" @click="selectStack(stack)">
<gl-deprecated-dropdown-item
v-for="stack in stacks"
:key="stack.code"
@click="selectStack(stack)"
>
<span class="ml-1">{{ stack.name }}</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<span v-if="validationError" class="gl-field-error">{{ validationError }}</span>
<p class="form-text text-muted">
{{ s__(`You must select a stack for configuring your cloud provider. Learn more about`) }}
......
app/assets/javascripts/clusters/components/fluentd_output_settings.vue
View file @ 5ef5f413
......@@ -4,8 +4,8 @@ import { APPLICATION_STATUS, FLUENTD } from '~/clusters/constants';
import {
GlAlert,
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormCheckbox,
} from '@gitlab/ui';
import eventHub from '~/clusters/event_hub';
......@@ -17,8 +17,8 @@ export default {
components: {
GlAlert,
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormCheckbox,
},
props: {
......@@ -203,15 +203,15 @@ export default {
<label for="fluentd-protocol">
<strong>{{ s__('ClusterIntegration|SIEM Protocol') }}</strong>
</label>
<gl-dropdown :text="protocolName" class="w-100">
<gl-dropdown-item
<gl-deprecated-dropdown :text="protocolName" class="w-100">
<gl-deprecated-dropdown-item
v-for="(value, index) in protocols"
:key="index"
@click="selectProtocol(value.toLowerCase())"
>
{{ value }}
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
<div class="form-group flex flex-wrap">
<gl-form-checkbox :checked="wafLogEnabled" @input="wafLogChanged">
......
app/assets/javascripts/clusters/components/ingress_modsecurity_settings.vue
View file @ 5ef5f413
......@@ -8,8 +8,8 @@ import {
GlLink,
GlToggle,
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
} from '@gitlab/ui';
import eventHub from '~/clusters/event_hub';
......@@ -26,8 +26,8 @@ export default {
GlLink,
GlToggle,
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
},
props: {
......@@ -221,11 +221,15 @@ export default {
</strong>
</p>
</div>
<gl-dropdown :text="modSecurityModeName" :disabled="saveButtonDisabled">
<gl-dropdown-item v-for="(mode, key) in modes" :key="key" @click="selectMode(key)">
<gl-deprecated-dropdown :text="modSecurityModeName" :disabled="saveButtonDisabled">
<gl-deprecated-dropdown-item
v-for="(mode, key) in modes"
:key="key"
@click="selectMode(key)"
>
{{ mode.name }}
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
</div>
<div v-if="showButtons" class="mt-3">
......
app/assets/javascripts/clusters/components/knative_domain_editor.vue
View file @ 5ef5f413
<script>
import {
GlDropdown,
GlDropdownDivider,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownItem,
GlLoadingIcon,
GlSearchBoxByType,
GlSprintf,
......@@ -20,9 +20,9 @@ export default {
LoadingButton,
ClipboardButton,
GlLoadingIcon,
GlDropdown,
GlDropdownDivider,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownItem,
GlSearchBoxByType,
GlSprintf,
},
......@@ -121,7 +121,7 @@ export default {
<strong>{{ s__('ClusterIntegration|Knative Domain Name:') }}</strong>
</label>
<gl-dropdown
<gl-deprecated-dropdown
v-if="showDomainsDropdown"
:text="domainDropdownText"
toggle-class="dropdown-menu-toggle"
......@@ -132,16 +132,16 @@ export default {
:placeholder="s__('ClusterIntegration|Search domains')"
class="m-2"
/>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="domain in filteredDomains"
:key="domain.id"
@click="selectDomain(domain)"
>
<span class="ml-1">{{ domain.domain }}</span>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<template v-if="searchQuery">
<gl-dropdown-divider />
<gl-dropdown-item key="custom-domain" @click="selectCustomDomain(searchQuery)">
<gl-deprecated-dropdown-divider />
<gl-deprecated-dropdown-item key="custom-domain" @click="selectCustomDomain(searchQuery)">
<span class="ml-1">
<gl-sprintf :message="s__('ClusterIntegration|Use %{query}')">
<template #query>
......@@ -149,9 +149,9 @@ export default {
</template>
</gl-sprintf>
</span>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
</gl-dropdown>
</gl-deprecated-dropdown>
<input
v-else
......
app/assets/javascripts/confidential_merge_request/components/dropdown.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { __ } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
Icon,
},
props: {
......@@ -38,7 +38,7 @@ export default {
</script>
<template>
<gl-dropdown toggle-class="d-flex align-items-center w-100" class="w-100">
<gl-deprecated-dropdown toggle-class="d-flex align-items-center w-100" class="w-100">
<template #button-content>
<span class="str-truncated-100 mr-2">
<icon name="lock" />
......@@ -46,13 +46,17 @@ export default {
</span>
<icon name="chevron-down" class="ml-auto" />
</template>
<gl-dropdown-item v-for="project in projects" :key="project.id" @click="selectProject(project)">
<gl-deprecated-dropdown-item
v-for="project in projects"
:key="project.id"
@click="selectProject(project)"
>
<icon
name="mobile-issue-close"
:class="{ icon: project.id !== selectedProject.id }"
class="js-active-project-check"
/>
<span class="ml-1">{{ project.name }}</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</template>
app/assets/javascripts/design_management/components/upload/design_version_dropdown.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { __, sprintf } from '~/locale';
import allVersionsMixin from '../../mixins/all_versions';
import { findVersionId } from '../../utils/design_management_utils';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
mixins: [allVersionsMixin],
computed: {
......@@ -50,8 +50,8 @@ export default {
</script>
<template>
<gl-dropdown :text="dropdownText" variant="link" class="design-version-dropdown">
<gl-dropdown-item v-for="(version, index) in allVersions" :key="version.node.id">
<gl-deprecated-dropdown :text="dropdownText" variant="link" class="design-version-dropdown">
<gl-deprecated-dropdown-item v-for="(version, index) in allVersions" :key="version.node.id">
<router-link
class="d-flex js-version-link"
:to="{ path: $route.path, query: { version: findVersionId(version.node.id) } }"
......@@ -71,6 +71,6 @@ export default {
class="fa fa-check pull-right"
></i>
</router-link>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</template>
app/assets/javascripts/error_tracking/components/error_details.vue
View file @ 5ef5f413
......@@ -9,9 +9,9 @@ import {
GlBadge,
GlAlert,
GlSprintf,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
} from '@gitlab/ui';
import { __, sprintf, n__ } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
......@@ -43,9 +43,9 @@ export default {
GlBadge,
GlAlert,
GlSprintf,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
TimeAgoTooltip,
},
directives: {
......@@ -331,38 +331,38 @@ export default {
</gl-button>
</form>
</div>
<gl-dropdown
<gl-deprecated-dropdown
text="Options"
class="error-details-options d-md-none"
right
:disabled="issueUpdateInProgress"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
data-qa-selector="update_ignore_status_button"
@click="onIgnoreStatusUpdate"
>{{ ignoreBtnLabel }}</gl-dropdown-item
>{{ ignoreBtnLabel }}</gl-deprecated-dropdown-item
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
data-qa-selector="update_resolve_status_button"
@click="onResolveStatusUpdate"
>{{ resolveBtnLabel }}</gl-dropdown-item
>{{ resolveBtnLabel }}</gl-deprecated-dropdown-item
>
<gl-dropdown-divider />
<gl-dropdown-item
<gl-deprecated-dropdown-divider />
<gl-deprecated-dropdown-item
v-if="error.gitlabIssuePath"
data-qa-selector="view_issue_button"
:href="error.gitlabIssuePath"
variant="success"
>{{ __('View issue') }}</gl-dropdown-item
>{{ __('View issue') }}</gl-deprecated-dropdown-item
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-if="!error.gitlabIssuePath"
:loading="issueCreationInProgress"
data-qa-selector="create_issue_button"
@click="createIssue"
>{{ __('Create issue') }}</gl-dropdown-item
>{{ __('Create issue') }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</div>
<div>
......
app/assets/javascripts/error_tracking/components/error_tracking_list.vue
View file @ 5ef5f413
......@@ -8,9 +8,9 @@ import {
GlLoadingIcon,
GlTable,
GlFormInput,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlTooltipDirective,
GlPagination,
} from '@gitlab/ui';
......@@ -72,9 +72,9 @@ export default {
components: {
GlEmptyState,
GlButton,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlIcon,
GlLink,
GlLoadingIcon,
......@@ -233,7 +233,7 @@ export default {
>
<div class="search-box flex-fill mb-1 mb-md-0">
<div class="filtered-search-box mb-0">
<gl-dropdown
<gl-deprecated-dropdown
:text="__('Recent searches')"
class="filtered-search-history-dropdown-wrapper"
toggle-class="filtered-search-history-dropdown-toggle-button"
......@@ -243,19 +243,19 @@ export default {
{{ __('This feature requires local storage to be enabled') }}
</div>
<template v-else-if="recentSearches.length > 0">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="searchQuery in recentSearches"
:key="searchQuery"
@click="setSearchText(searchQuery)"
>{{ searchQuery }}
</gl-dropdown-item>
<gl-dropdown-divider />
<gl-dropdown-item ref="clearRecentSearches" @click="clearRecentSearches"
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-divider />
<gl-deprecated-dropdown-item ref="clearRecentSearches" @click="clearRecentSearches"
>{{ __('Clear recent searches') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
<div v-else class="px-3">{{ __("You don't have any recent searches") }}</div>
</gl-dropdown>
</gl-deprecated-dropdown>
<div class="filtered-search-input-container flex-fill">
<gl-form-input
v-model="errorSearchQuery"
......@@ -280,13 +280,13 @@ export default {
</div>
</div>
<gl-dropdown
<gl-deprecated-dropdown
:text="$options.statusFilters[statusFilter]"
class="status-dropdown mx-md-1 mb-1 mb-md-0"
menu-class="dropdown"
:disabled="loading"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="(label, status) in $options.statusFilters"
:key="status"
@click="filterErrors(status, label)"
......@@ -299,16 +299,16 @@ export default {
/>
{{ label }}
</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<gl-dropdown
<gl-deprecated-dropdown
:text="$options.sortFields[sortField]"
left
:disabled="loading"
menu-class="dropdown"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="(label, field) in $options.sortFields"
:key="field"
@click="sortByField(field)"
......@@ -321,8 +321,8 @@ export default {
/>
{{ label }}
</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
<div v-if="loading" class="py-3">
......
app/assets/javascripts/error_tracking_settings/components/project_dropdown.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { getDisplayName } from '../utils';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
dropdownLabel: {
......@@ -52,7 +52,7 @@ export default {
<div :class="{ 'gl-show-field-errors': isProjectInvalid }">
<label class="label-bold" for="project-dropdown">{{ __('Project') }}</label>
<div class="row">
<gl-dropdown
<gl-deprecated-dropdown
id="project-dropdown"
class="col-8 col-md-9 gl-pr-0"
:disabled="!hasProjects"
......@@ -60,14 +60,14 @@ export default {
toggle-class="dropdown-menu-toggle w-100 gl-field-error-outline"
:text="dropdownLabel"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="project in projects"
:key="`${project.organizationSlug}.${project.slug}`"
class="w-100"
@click="$emit('select-project', project)"
>{{ getDisplayName(project) }}</gl-dropdown-item
>{{ getDisplayName(project) }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
<p v-if="isProjectInvalid" class="js-project-dropdown-error gl-field-error">
{{ invalidProjectLabel }}
......
app/assets/javascripts/logs/components/environment_logs.vue
View file @ 5ef5f413
......@@ -5,10 +5,10 @@ import {
GlSprintf,
GlIcon,
GlAlert,
GlDropdown,
GlDropdownHeader,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlInfiniteScroll,
} from '@gitlab/ui';
......@@ -25,10 +25,10 @@ export default {
GlSprintf,
GlIcon,
GlAlert,
GlDropdown,
GlDropdownHeader,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
GlInfiniteScroll,
LogSimpleFilters,
LogAdvancedFilters,
......@@ -174,16 +174,16 @@ export default {
<div class="top-bar d-md-flex border bg-secondary-50 pt-2 pr-1 pb-0 pl-2">
<div class="flex-grow-0">
<gl-dropdown
<gl-deprecated-dropdown
id="environments-dropdown"
:text="environments.current || managedApps.current"
:disabled="environments.isLoading"
class="mb-2 gl-h-32 pr-2 d-flex d-md-block js-environments-dropdown"
>
<gl-dropdown-header class="gl-text-center">
<gl-deprecated-dropdown-header class="gl-text-center">
{{ s__('Environments|Environments') }}
</gl-dropdown-header>
<gl-dropdown-item
</gl-deprecated-dropdown-header>
<gl-deprecated-dropdown-item
v-for="env in environments.options"
:key="env.id"
@click="showEnvironment(env.name)"
......@@ -195,12 +195,12 @@ export default {
/>
<div class="gl-flex-grow-1">{{ env.name }}</div>
</div>
</gl-dropdown-item>
<gl-dropdown-divider />
<gl-dropdown-header class="gl-text-center">
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-divider />
<gl-deprecated-dropdown-header class="gl-text-center">
{{ s__('Environments|Managed apps') }}
</gl-dropdown-header>
<gl-dropdown-item
</gl-deprecated-dropdown-header>
<gl-deprecated-dropdown-item
v-for="app in managedApps.options"
:key="app.id"
@click="showManagedApp(app.name)"
......@@ -212,8 +212,8 @@ export default {
/>
<div class="gl-flex-grow-1">{{ app.name }}</div>
</div>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
<log-advanced-filters
......
app/assets/javascripts/logs/components/log_simple_filters.vue
View file @ 5ef5f413
<script>
import { s__ } from '~/locale';
import { mapActions, mapState } from 'vuex';
import { GlIcon, GlDropdown, GlDropdownHeader, GlDropdownItem } from '@gitlab/ui';
import {
GlIcon,
GlDeprecatedDropdown,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
} from '@gitlab/ui';
export default {
components: {
GlIcon,
GlDropdown,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
},
props: {
disabled: {
......@@ -39,22 +44,22 @@ export default {
</script>
<template>
<div>
<gl-dropdown
<gl-deprecated-dropdown
ref="podsDropdown"
:text="podDropdownText"
:disabled="disabled"
class="mb-2 gl-h-32 pr-2 d-flex d-md-block flex-grow-0 qa-pods-dropdown"
>
<gl-dropdown-header class="text-center">
<gl-deprecated-dropdown-header class="text-center">
{{ s__('Environments|Select pod') }}
</gl-dropdown-header>
</gl-deprecated-dropdown-header>
<gl-dropdown-item v-if="!pods.options.length" disabled>
<gl-deprecated-dropdown-item v-if="!pods.options.length" disabled>
<span ref="noPodsMsg" class="text-muted">
{{ s__('Environments|No pods to display') }}
</span>
</gl-dropdown-item>
<gl-dropdown-item
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-item
v-for="podName in pods.options"
:key="podName"
class="text-nowrap"
......@@ -67,7 +72,7 @@ export default {
/>
<div class="flex-grow-1">{{ podName }}</div>
</div>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
</template>
app/assets/javascripts/monitoring/components/alert_widget_form.vue
View file @ 5ef5f413
......@@ -7,8 +7,8 @@ import {
GlButtonGroup,
GlFormGroup,
GlFormInput,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlModal,
GlTooltipDirective,
} from '@gitlab/ui';
......@@ -40,8 +40,8 @@ export default {
GlButtonGroup,
GlFormGroup,
GlFormInput,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlModal,
GlLink,
Icon,
......@@ -244,20 +244,20 @@ export default {
</template>
</gl-form-group>
<gl-form-group v-else label-for="alert-query-dropdown" :label="$options.alertQueryText.label">
<gl-dropdown
<gl-deprecated-dropdown
id="alert-query-dropdown"
:text="queryDropdownLabel"
toggle-class="dropdown-menu-toggle qa-alert-query-dropdown"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="query in relevantQueries"
:key="query.metricId"
data-qa-selector="alert_query_option"
@click="selectQuery(query.metricId)"
>
{{ query.label }}
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</gl-form-group>
<gl-button-group class="mb-2" :label="s__('PrometheusAlerts|Operator')">
<gl-deprecated-button
......
app/assets/javascripts/monitoring/components/dashboard_header.vue
View file @ 5ef5f413
......@@ -5,10 +5,10 @@ import {
GlButton,
GlIcon,
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDropdownHeader,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownDivider,
GlNewDropdown,
GlNewDropdownDivider,
GlNewDropdownItem,
......@@ -41,11 +41,11 @@ export default {
GlButton,
GlIcon,
GlDeprecatedButton,
GlDropdown,
GlDeprecatedDropdown,
GlLoadingIcon,
GlDropdownItem,
GlDropdownHeader,
GlDropdownDivider,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownDivider,
GlNewDropdown,
GlNewDropdownDivider,
GlNewDropdownItem,
......@@ -240,7 +240,7 @@ export default {
<span aria-hidden="true" class="gl-pl-3 border-left gl-mb-3 d-none d-sm-block"></span>
<div class="mb-2 pr-2 d-flex d-sm-block">
<gl-dropdown
<gl-deprecated-dropdown
id="monitor-environments-dropdown"
ref="monitorEnvironmentsDropdown"
class="flex-grow-1"
......@@ -250,20 +250,20 @@ export default {
:text="currentEnvironmentName"
>
<div class="d-flex flex-column overflow-hidden">
<gl-dropdown-header class="monitor-environment-dropdown-header text-center">
<gl-deprecated-dropdown-header class="monitor-environment-dropdown-header text-center">
{{ __('Environment') }}
</gl-dropdown-header>
<gl-dropdown-divider />
</gl-deprecated-dropdown-header>
<gl-deprecated-dropdown-divider />
<gl-search-box-by-type class="m-2" @input="debouncedEnvironmentsSearch" />
<gl-loading-icon v-if="environmentsLoading" :inline="true" />
<div v-else class="flex-fill overflow-auto">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="environment in filteredEnvironments"
:key="environment.id"
:active="environment.name === currentEnvironmentName"
active-class="is-active"
:href="getEnvironmentPath(environment.id)"
>{{ environment.name }}</gl-dropdown-item
>{{ environment.name }}</gl-deprecated-dropdown-item
>
</div>
<div
......@@ -274,7 +274,7 @@ export default {
{{ __('No matching results') }}
</div>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
<div class="mb-2 pr-2 d-flex d-sm-block">
......
app/assets/javascripts/monitoring/components/dashboards_dropdown.vue
View file @ 5ef5f413
......@@ -2,10 +2,10 @@
import { mapState, mapActions, mapGetters } from 'vuex';
import {
GlIcon,
GlDropdown,
GlDropdownItem,
GlDropdownHeader,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownDivider,
GlSearchBoxByType,
GlModalDirective,
} from '@gitlab/ui';
......@@ -17,10 +17,10 @@ const events = {
export default {
components: {
GlIcon,
GlDropdown,
GlDropdownItem,
GlDropdownHeader,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownDivider,
GlSearchBoxByType,
},
directives: {
......@@ -81,16 +81,16 @@ export default {
};
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
toggle-class="dropdown-menu-toggle"
menu-class="monitor-dashboard-dropdown-menu"
:text="selectedDashboardText"
>
<div class="d-flex flex-column overflow-hidden">
<gl-dropdown-header class="monitor-dashboard-dropdown-header text-center">{{
<gl-deprecated-dropdown-header class="monitor-dashboard-dropdown-header text-center">{{
__('Dashboard')
}}</gl-dropdown-header>
<gl-dropdown-divider />
}}</gl-deprecated-dropdown-header>
<gl-deprecated-dropdown-divider />
<gl-search-box-by-type
ref="monitorDashboardsDropdownSearch"
v-model="searchTerm"
......@@ -98,7 +98,7 @@ export default {
/>
<div class="flex-fill overflow-auto">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="dashboard in starredDashboards"
:key="dashboard.path"
:active="dashboard.path === selectedDashboardPath"
......@@ -109,14 +109,14 @@ export default {
{{ dashboardDisplayName(dashboard) }}
<gl-icon class="text-muted ml-auto" name="star" />
</div>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<gl-dropdown-divider
<gl-deprecated-dropdown-divider
v-if="starredDashboards.length && nonStarredDashboards.length"
ref="starredListDivider"
/>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="dashboard in nonStarredDashboards"
:key="dashboard.path"
:active="dashboard.path === selectedDashboardPath"
......@@ -124,7 +124,7 @@ export default {
@click="selectDashboard(dashboard)"
>
{{ dashboardDisplayName(dashboard) }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
<div
......@@ -140,12 +140,12 @@ export default {
in https://gitlab.com/gitlab-org/gitlab/-/issues/223223
-->
<template v-if="isOutOfTheBoxDashboard">
<gl-dropdown-divider />
<gl-deprecated-dropdown-divider />
<gl-dropdown-item v-gl-modal="modalId" data-testid="duplicateDashboardItem">
<gl-deprecated-dropdown-item v-gl-modal="modalId" data-testid="duplicateDashboardItem">
{{ s__('Metrics|Duplicate dashboard') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
app/assets/javascripts/monitoring/components/variables/dropdown_field.vue
View file @ 5ef5f413
<script>
import { GlFormGroup, GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlFormGroup, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
export default {
components: {
GlFormGroup,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
name: {
......@@ -41,13 +41,16 @@ export default {
</script>
<template>
<gl-form-group :label="label">
<gl-dropdown toggle-class="dropdown-menu-toggle" :text="text || s__('Metrics|Select a value')">
<gl-dropdown-item
<gl-deprecated-dropdown
toggle-class="dropdown-menu-toggle"
:text="text || s__('Metrics|Select a value')"
>
<gl-deprecated-dropdown-item
v-for="val in options.values"
:key="val.value"
@click="onUpdate(val.value)"
>{{ val.text }}</gl-dropdown-item
>{{ val.text }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
</gl-form-group>
</template>
app/assets/javascripts/pages/projects/graphs/components/code_coverage.vue
View file @ 5ef5f413
<script>
import { GlAlert, GlDropdown, GlDropdownItem, GlIcon, GlSprintf } from '@gitlab/ui';
import {
GlAlert,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
GlSprintf,
} from '@gitlab/ui';
import { GlAreaChart } from '@gitlab/ui/dist/charts';
import dateFormat from 'dateformat';
import axios from '~/lib/utils/axios_utils';
......@@ -11,8 +17,8 @@ export default {
components: {
GlAlert,
GlAreaChart,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
GlSprintf,
},
......@@ -134,8 +140,8 @@ export default {
{{ __('It seems that there is currently no available data for code coverage') }}
</span>
</gl-alert>
<gl-dropdown v-if="canShowData" :text="selectedDailyCoverageName">
<gl-dropdown-item
<gl-deprecated-dropdown v-if="canShowData" :text="selectedDailyCoverageName">
<gl-deprecated-dropdown-item
v-for="({ group_name }, index) in dailyCoverageData"
:key="index"
:value="group_name"
......@@ -151,8 +157,8 @@ export default {
{{ group_name }}
</span>
</div>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
<gl-area-chart
v-if="!isLoading"
......
app/assets/javascripts/pipelines/components/pipelines_list/tokens/pipeline_trigger_author_token.vue
View file @ 5ef5f413
......@@ -3,7 +3,7 @@ import {
GlFilteredSearchToken,
GlAvatar,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
} from '@gitlab/ui';
import Api from '~/api';
......@@ -21,7 +21,7 @@ export default {
GlFilteredSearchToken,
GlAvatar,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
},
props: {
......@@ -94,7 +94,7 @@ export default {
<gl-filtered-search-suggestion :value="$options.anyTriggerAuthor">{{
$options.anyTriggerAuthor
}}</gl-filtered-search-suggestion>
<gl-dropdown-divider />
<gl-deprecated-dropdown-divider />
<gl-loading-icon v-if="loading" />
<template v-else>
......
app/assets/javascripts/registry/explorer/components/list_page/cli_commands.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlFormGroup, GlFormInputGroup } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlFormGroup, GlFormInputGroup } from '@gitlab/ui';
import { mapGetters } from 'vuex';
import Tracking from '~/tracking';
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
......@@ -15,7 +15,7 @@ import {
export default {
components: {
GlDropdown,
GlDeprecatedDropdown,
GlFormGroup,
GlFormInputGroup,
ClipboardButton,
......@@ -36,7 +36,7 @@ export default {
};
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
:text="$options.i18n.dropdownTitle"
variant="primary"
size="sm"
......@@ -99,5 +99,5 @@ export default {
</gl-form-group>
</form>
</li>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
app/assets/javascripts/repository/components/breadcrumbs.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownDivider, GlDropdownHeader, GlDropdownItem } from '@gitlab/ui';
import {
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
} from '@gitlab/ui';
import { joinPaths, escapeFileUrl } from '~/lib/utils/url_utility';
import { __ } from '../../locale';
import Icon from '../../vue_shared/components/icon.vue';
......@@ -15,10 +20,10 @@ const ROW_TYPES = {
export default {
components: {
GlDropdown,
GlDropdownDivider,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
Icon,
},
apollo: {
......@@ -221,11 +226,11 @@ export default {
getComponent(type) {
switch (type) {
case ROW_TYPES.divider:
return 'gl-dropdown-divider';
return 'gl-deprecated-dropdown-divider';
case ROW_TYPES.header:
return 'gl-dropdown-header';
return 'gl-deprecated-dropdown-header';
default:
return 'gl-dropdown-item';
return 'gl-deprecated-dropdown-item';
}
},
},
......@@ -241,7 +246,7 @@ export default {
</router-link>
</li>
<li v-if="renderAddToTreeDropdown" class="breadcrumb-item">
<gl-dropdown toggle-class="add-to-tree qa-add-to-tree ml-1">
<gl-deprecated-dropdown toggle-class="add-to-tree qa-add-to-tree ml-1">
<template #button-content>
<span class="sr-only">{{ __('Add to tree') }}</span>
<icon name="plus" :size="16" class="float-left" />
......@@ -252,7 +257,7 @@ export default {
{{ item.text }}
</component>
</template>
</gl-dropdown>
</gl-deprecated-dropdown>
</li>
</ol>
</nav>
......
app/assets/javascripts/snippets/components/snippet_header.vue
View file @ 5ef5f413
......@@ -7,8 +7,8 @@ import {
GlModal,
GlAlert,
GlLoadingIcon,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlButton,
GlTooltipDirective,
} from '@gitlab/ui';
......@@ -26,8 +26,8 @@ export default {
GlModal,
GlAlert,
GlLoadingIcon,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
TimeAgoTooltip,
GlButton,
},
......@@ -223,17 +223,17 @@ export default {
</template>
</div>
<div class="d-block d-sm-none dropdown">
<gl-dropdown :text="__('Options')" class="w-100" toggle-class="text-center">
<gl-dropdown-item
<gl-deprecated-dropdown :text="__('Options')" class="w-100" toggle-class="text-center">
<gl-deprecated-dropdown-item
v-for="(action, index) in personalSnippetActions"
:key="index"
:disabled="action.disabled"
:title="action.title"
:href="action.href"
@click="action.click ? action.click() : undefined"
>{{ action.text }}</gl-dropdown-item
>{{ action.text }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</div>
......
app/assets/javascripts/vue_merge_request_widget/components/states/commit_message_dropdown.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
commits: {
......@@ -18,20 +18,20 @@ export default {
<template>
<div>
<gl-dropdown
<gl-deprecated-dropdown
right
text="Use an existing commit message"
variant="link"
class="mr-commit-dropdown"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="commit in commits"
:key="commit.short_id"
class="text-nowrap text-truncate"
@click="$emit('input', commit.message)"
>
<span class="monospace mr-2">{{ commit.short_id }}</span> {{ commit.title }}
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
</template>
app/assets/javascripts/vue_shared/components/date_time_picker/date_time_picker.vue
View file @ 5ef5f413
<script>
import { GlIcon, GlDeprecatedButton, GlDropdown, GlDropdownItem, GlFormGroup } from '@gitlab/ui';
import {
GlIcon,
GlDeprecatedButton,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormGroup,
} from '@gitlab/ui';
import { __, sprintf } from '~/locale';
import { convertToFixedRange, isEqualTimeRanges, findTimeRange } from '~/lib/utils/datetime_range';
......@@ -23,8 +29,8 @@ export default {
components: {
GlIcon,
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormGroup,
TooltipOnTruncate,
DateTimePickerInput,
......@@ -206,7 +212,7 @@ export default {
placement="top"
class="d-inline-block"
>
<gl-dropdown
<gl-deprecated-dropdown
:text="timeWindowText"
v-bind="$attrs"
class="date-time-picker w-100"
......@@ -256,7 +262,7 @@ export default {
<span class="gl-pl-5-deprecated-no-really-do-not-use-me">{{ __('Quick range') }}</span>
</template>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="(option, index) in options"
:key="index"
data-qa-selector="quick_range_item"
......@@ -270,9 +276,9 @@ export default {
:class="{ invisible: !isOptionActive(option) }"
/>
{{ option.label }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</gl-form-group>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</tooltip-on-truncate>
</template>
app/assets/javascripts/vue_shared/components/filtered_search_bar/tokens/author_token.vue
View file @ 5ef5f413
......@@ -3,7 +3,7 @@ import {
GlFilteredSearchToken,
GlAvatar,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
} from '@gitlab/ui';
import { debounce } from 'lodash';
......@@ -19,7 +19,7 @@ export default {
GlFilteredSearchToken,
GlAvatar,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
},
props: {
......@@ -102,7 +102,7 @@ export default {
<gl-filtered-search-suggestion :value="$options.anyAuthor">
{{ __('Any') }}
</gl-filtered-search-suggestion>
<gl-dropdown-divider />
<gl-deprecated-dropdown-divider />
<gl-loading-icon v-if="loading" />
<template v-else>
<gl-filtered-search-suggestion
......
app/assets/javascripts/vue_shared/components/split_button.vue
View file @ 5ef5f413
<script>
import { isString } from 'lodash';
import { GlDropdown, GlDropdownDivider, GlDropdownItem } from '@gitlab/ui';
import {
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownItem,
} from '@gitlab/ui';
const isValidItem = item =>
isString(item.eventName) && isString(item.title) && isString(item.description);
export default {
components: {
GlDropdown,
GlDropdownDivider,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownItem,
},
props: {
......@@ -57,7 +61,7 @@ export default {
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
:menu-class="`dropdown-menu-selectable ${menuClass}`"
split
:text="dropdownToggleText"
......@@ -66,7 +70,7 @@ export default {
@click="triggerEvent"
>
<template v-for="(item, itemIndex) in actionItems">
<gl-dropdown-item
<gl-deprecated-dropdown-item
:key="item.eventName"
:active="selectedItem === item"
active-class="is-active"
......@@ -74,12 +78,12 @@ export default {
>
<strong>{{ item.title }}</strong>
<div>{{ item.description }}</div>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<gl-dropdown-divider
<gl-deprecated-dropdown-divider
v-if="itemIndex < actionItems.length - 1"
:key="`${item.eventName}-divider`"
/>
</template>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
app/assets/javascripts/vue_shared/components/timezone_dropdown.vue
View file @ 5ef5f413
<script>
import { GlNewDropdown, GlDropdownItem, GlSearchBoxByType, GlIcon } from '@gitlab/ui';
import { GlNewDropdown, GlDeprecatedDropdownItem, GlSearchBoxByType, GlIcon } from '@gitlab/ui';
import { __ } from '~/locale';
import autofocusonshow from '~/vue_shared/directives/autofocusonshow';
......@@ -7,7 +7,7 @@ export default {
name: 'TimezoneDropdown',
components: {
GlNewDropdown,
GlDropdownItem,
GlDeprecatedDropdownItem,
GlSearchBoxByType,
GlIcon,
},
......@@ -83,7 +83,7 @@ export default {
</template>
<gl-search-box-by-type v-model.trim="searchTerm" v-autofocusonshow autofocus class="gl-m-3" />
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="timezone in filteredResults"
:key="timezone.formattedTimezone"
@click="selectTimezone(timezone)"
......@@ -94,9 +94,9 @@ export default {
class="gl-vertical-align-middle"
/>
{{ timezone.formattedTimezone }}
</gl-dropdown-item>
<gl-dropdown-item v-if="!filteredResults.length" data-testid="noMatchingResults">
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-item v-if="!filteredResults.length" data-testid="noMatchingResults">
{{ $options.tranlations.noResultsText }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</gl-new-dropdown>
</template>
ee/app/assets/javascripts/analytics/cycle_analytics/components/custom_stage_form.vue
View file @ 5ef5f413
......@@ -6,9 +6,9 @@ import {
GlFormInput,
GlFormSelect,
GlLoadingIcon,
GlDropdown,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
GlSprintf,
} from '@gitlab/ui';
import { s__ } from '~/locale';
......@@ -76,9 +76,9 @@ export default {
GlFormSelect,
GlLoadingIcon,
LabelsSelector,
GlDropdown,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
GlSprintf,
},
props: {
......@@ -257,18 +257,21 @@ export default {
<form v-else class="custom-stage-form m-4 mt-0">
<div class="mb-1 d-flex flex-row justify-content-between">
<h4>{{ formTitle }}</h4>
<gl-dropdown :text="__('Recover hidden stage')" class="js-recover-hidden-stage-dropdown">
<gl-dropdown-header>{{ __('Default stages') }}</gl-dropdown-header>
<gl-deprecated-dropdown
:text="__('Recover hidden stage')"
class="js-recover-hidden-stage-dropdown"
>
<gl-deprecated-dropdown-header>{{ __('Default stages') }}</gl-deprecated-dropdown-header>
<template v-if="hasHiddenStages">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="stage in hiddenStages"
:key="stage.id"
@click="handleRecoverStage(stage.id)"
>{{ stage.title }}</gl-dropdown-item
>{{ stage.title }}</gl-deprecated-dropdown-item
>
</template>
<p v-else class="mx-3 my-2">{{ __('All default stages are currently visible') }}</p>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
<gl-form-group
ref="name"
......
ee/app/assets/javascripts/analytics/cycle_analytics/components/labels_selector.vue
View file @ 5ef5f413
<script>
import Api from 'ee/api';
import { debounce } from 'lodash';
import { GlDropdown, GlDropdownItem, GlIcon, GlLoadingIcon, GlSearchBoxByType } from '@gitlab/ui';
import {
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
GlLoadingIcon,
GlSearchBoxByType,
} from '@gitlab/ui';
import { mapGetters } from 'vuex';
import createFlash from '~/flash';
import { __ } from '~/locale';
......@@ -11,8 +17,8 @@ import { DATA_REFETCH_DELAY } from '../../shared/constants';
export default {
name: 'LabelsSelector',
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
GlLoadingIcon,
GlSearchBoxByType,
......@@ -120,7 +126,7 @@ export default {
};
</script>
<template>
<gl-dropdown class="w-100" toggle-class="overflow-hidden" :right="right">
<gl-deprecated-dropdown class="w-100" toggle-class="overflow-hidden" :right="right">
<template #button-content>
<slot name="label-dropdown-button">
<span v-if="selectedLabel">
......@@ -136,15 +142,17 @@ export default {
</template>
<template>
<slot name="label-dropdown-list-header">
<gl-dropdown-item :active="!selectedLabelId.length" @click.prevent="$emit('clearLabel')"
<gl-deprecated-dropdown-item
:active="!selectedLabelId.length"
@click.prevent="$emit('clearLabel')"
>{{ __('Select a label') }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</slot>
<div class="mb-3 px-3">
<gl-search-box-by-type v-model.trim="searchTerm" class="mb-2" />
</div>
<div class="mb-3 px-3">
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="label in labels"
:key="label.id"
:class="{
......@@ -162,7 +170,7 @@ export default {
<span :style="{ backgroundColor: label.color }" class="d-inline-block dropdown-label-box">
</span>
{{ labelTitle(label) }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<div v-show="loading" class="text-center">
<gl-loading-icon :inline="true" size="md" />
</div>
......@@ -171,5 +179,5 @@ export default {
</div>
</div>
</template>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
ee/app/assets/javascripts/analytics/cycle_analytics/components/tasks_by_type/tasks_by_type_filters.vue
View file @ 5ef5f413
<script>
import { GlDropdownDivider, GlSegmentedControl, GlIcon } from '@gitlab/ui';
import { GlDeprecatedDropdownDivider, GlSegmentedControl, GlIcon } from '@gitlab/ui';
import { s__, sprintf } from '~/locale';
import createFlash from '~/flash';
import { removeFlash } from '../../utils';
......@@ -15,7 +15,7 @@ export default {
name: 'TasksByTypeFilters',
components: {
GlSegmentedControl,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlIcon,
LabelsSelector,
},
......@@ -126,7 +126,7 @@ export default {
"
/>
</div>
<gl-dropdown-divider />
<gl-deprecated-dropdown-divider />
<div class="mb-3 px-3">
<p class="font-weight-bold text-left my-2">
{{ s__('CycleAnalytics|Select labels') }}
......
ee/app/assets/javascripts/analytics/productivity_analytics/components/app.vue
View file @ 5ef5f413
......@@ -3,8 +3,8 @@ import { mapState, mapActions, mapGetters } from 'vuex';
import {
GlEmptyState,
GlLoadingIcon,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedButton,
GlTooltipDirective,
} from '@gitlab/ui';
......@@ -24,8 +24,8 @@ export default {
components: {
GlEmptyState,
GlLoadingIcon,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlColumnChart,
GlDeprecatedButton,
Icon,
......@@ -298,12 +298,12 @@ export default {
>
<strong class="mr-2">{{ __('Sort by') }}</strong>
<div class="d-flex">
<gl-dropdown
<gl-deprecated-dropdown
class="mr-2 flex-grow"
toggle-class="dropdown-menu-toggle"
:text="sortFieldDropdownLabel"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="metric in tableSortOptions"
:key="metric.key"
active-class="is-active"
......@@ -320,8 +320,8 @@ export default {
/>
{{ metric.label }}
</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<gl-deprecated-button
v-gl-tooltip.hover
:title="sortTooltipTitle"
......
ee/app/assets/javascripts/analytics/productivity_analytics/components/metric_chart.vue
View file @ 5ef5f413
<script>
import { isEmpty } from 'lodash';
import { GlDropdown, GlDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { s__ } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
export default {
name: 'MetricChart',
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlLoadingIcon,
Icon,
},
......@@ -72,14 +72,14 @@ export default {
{{ __('There is no data available. Please change your selection.') }}
</div>
<template v-else>
<gl-dropdown
<gl-deprecated-dropdown
v-if="hasMetricTypes"
class="mb-4 metric-dropdown"
toggle-class="dropdown-menu-toggle w-100"
menu-class="w-100 mw-100"
:text="metricDropdownLabel"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="metric in metricTypes"
:key="metric.key"
active-class="is-active"
......@@ -98,8 +98,8 @@ export default {
/>
{{ metric.label }}
</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<p v-if="description" class="text-muted">{{ description }}</p>
<div ref="chart">
<slot v-if="hasChartData"></slot>
......
ee/app/assets/javascripts/analytics/productivity_analytics/components/mr_table.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import Icon from '~/vue_shared/components/icon.vue';
import MergeRequestTableRow from './mr_table_row.vue';
import Pagination from '~/vue_shared/components/pagination_links.vue';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
Icon,
MergeRequestTableRow,
Pagination,
......@@ -65,13 +65,13 @@ export default {
<div class="d-flex">
<span class="d-none d-md-flex metric-col">{{ __('Time to merge') }}</span>
<gl-dropdown
<gl-deprecated-dropdown
class="w-100 metric-col"
toggle-class="dropdown-menu-toggle w-100"
menu-class="w-100 mw-100"
:text="metricDropdownLabel"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="option in columnOptions"
:key="option.key"
active-class="is-active"
......@@ -88,8 +88,8 @@ export default {
/>
{{ option.label }}
</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
</div>
</div>
......
ee/app/assets/javascripts/analytics/shared/components/date_range_dropdown.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { __, sprintf } from '~/locale';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
availableDaysInPast: {
......@@ -43,17 +43,17 @@ export default {
};
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
toggle-class="dropdown-menu-toggle w-100"
menu-class="w-100 mw-100"
:text="dropdownText"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="d in availableDaysInPast"
:key="d"
class="w-100"
@click="onSelect(d)"
>{{ getLabel(d) }}</gl-dropdown-item
>{{ getLabel(d) }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
ee/app/assets/javascripts/analytics/shared/components/tokens/label_token.vue
View file @ 5ef5f413
......@@ -3,7 +3,7 @@ import {
GlToken,
GlFilteredSearchToken,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
} from '@gitlab/ui';
import { __ } from '~/locale';
......@@ -15,7 +15,7 @@ export default {
GlToken,
GlFilteredSearchToken,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
},
inheritAttrs: false,
......@@ -108,7 +108,7 @@ export default {
:value="suggestion.value"
>{{ suggestion.text }}</gl-filtered-search-suggestion
>
<gl-dropdown-divider v-if="config.isLoading || labels.length" />
<gl-deprecated-dropdown-divider v-if="config.isLoading || labels.length" />
<gl-filtered-search-suggestion
v-for="label in labels"
ref="labelItem"
......
ee/app/assets/javascripts/analytics/shared/components/tokens/milestone_token.vue
View file @ 5ef5f413
......@@ -2,7 +2,7 @@
import {
GlFilteredSearchToken,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
} from '@gitlab/ui';
import { __ } from '~/locale';
......@@ -13,7 +13,7 @@ export default {
components: {
GlFilteredSearchToken,
GlFilteredSearchSuggestion,
GlDropdownDivider,
GlDeprecatedDropdownDivider,
GlLoadingIcon,
},
inheritAttrs: false,
......@@ -90,7 +90,7 @@ export default {
:value="suggestion.value"
>{{ suggestion.text }}</gl-filtered-search-suggestion
>
<gl-dropdown-divider v-if="config.isLoading || milestones.length" />
<gl-deprecated-dropdown-divider v-if="config.isLoading || milestones.length" />
<gl-loading-icon v-if="config.isLoading" />
<template v-else>
<gl-filtered-search-suggestion
......
ee/app/assets/javascripts/boards/components/weight_select.vue
View file @ 5ef5f413
<script>
import { GlDeprecatedButton, GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedButton, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
const ANY_WEIGHT = 'Any weight';
const NO_WEIGHT = 'None';
......@@ -7,8 +7,8 @@ const NO_WEIGHT = 'None';
export default {
components: {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
board: {
......@@ -82,7 +82,7 @@ export default {
</div>
<div :class="valueClass" :hidden="!dropdownHidden" class="value">{{ valueText }}</div>
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
:hidden="dropdownHidden"
:text="valueText"
......@@ -91,10 +91,10 @@ export default {
toggle-class="d-flex justify-content-between"
>
<div ref="weight-select" @click="selectWeight">
<gl-dropdown-item v-for="weight in weights" :key="weight" :value="weight">
<gl-deprecated-dropdown-item v-for="weight in weights" :key="weight" :value="weight">
{{ weight }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</template>
ee/app/assets/javascripts/dependencies/components/dependencies_actions.vue
View file @ 5ef5f413
......@@ -2,8 +2,8 @@
import { mapActions, mapState } from 'vuex';
import {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
GlTooltipDirective,
} from '@gitlab/ui';
......@@ -14,8 +14,8 @@ export default {
name: 'DependenciesActions',
components: {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
},
directives: {
......@@ -72,8 +72,12 @@ export default {
<template>
<div class="btn-toolbar">
<div class="btn-group flex-grow-1 mr-2">
<gl-dropdown :text="sortFieldName" class="flex-grow-1 text-center" right>
<gl-dropdown-item v-for="(name, id) in sortFields" :key="id" @click="setSortField(id)">
<gl-deprecated-dropdown :text="sortFieldName" class="flex-grow-1 text-center" right>
<gl-deprecated-dropdown-item
v-for="(name, id) in sortFields"
:key="id"
@click="setSortField(id)"
>
<span class="d-flex">
<gl-icon
class="flex-shrink-0 gl-mr-2"
......@@ -82,8 +86,8 @@ export default {
/>
{{ name }}
</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<gl-deprecated-button
v-gl-tooltip
:title="__('Sort direction')"
......
ee/app/assets/javascripts/geo_node_form/components/geo_node_form_namespaces.vue
View file @ 5ef5f413
<script>
import { GlIcon, GlSearchBoxByType, GlDropdown, GlDeprecatedButton } from '@gitlab/ui';
import { GlIcon, GlSearchBoxByType, GlDeprecatedDropdown, GlDeprecatedButton } from '@gitlab/ui';
import { mapActions, mapState } from 'vuex';
import { debounce } from 'lodash';
import { __, n__ } from '~/locale';
......@@ -10,7 +10,7 @@ export default {
components: {
GlIcon,
GlSearchBoxByType,
GlDropdown,
GlDeprecatedDropdown,
GlDeprecatedButton,
},
props: {
......@@ -59,7 +59,7 @@ export default {
</script>
<template>
<gl-dropdown :text="dropdownTitle" @show="fetchSyncNamespaces(namespaceSearch)">
<gl-deprecated-dropdown :text="dropdownTitle" @show="fetchSyncNamespaces(namespaceSearch)">
<gl-search-box-by-type v-model="namespaceSearch" class="m-2" />
<li v-for="namespace in synchronizationNamespaces" :key="namespace.id">
<gl-deprecated-button class="d-flex align-items-center" @click="toggleNamespace(namespace)">
......@@ -68,5 +68,5 @@ export default {
</gl-deprecated-button>
</li>
<div v-if="noSyncNamespaces" class="text-secondary p-2">{{ __('Nothing found…') }}</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
ee/app/assets/javascripts/geo_node_form/components/geo_node_form_shards.vue
View file @ 5ef5f413
<script>
import { GlIcon, GlDropdown, GlDeprecatedButton } from '@gitlab/ui';
import { GlIcon, GlDeprecatedDropdown, GlDeprecatedButton } from '@gitlab/ui';
import { __, n__ } from '~/locale';
import { SELECTIVE_SYNC_SHARDS } from '../constants';
......@@ -7,7 +7,7 @@ export default {
name: 'GeoNodeFormShards',
components: {
GlIcon,
GlDropdown,
GlDeprecatedDropdown,
GlDeprecatedButton,
},
props: {
......@@ -49,7 +49,7 @@ export default {
</script>
<template>
<gl-dropdown :text="dropdownTitle">
<gl-deprecated-dropdown :text="dropdownTitle">
<li v-for="shard in syncShardsOptions" :key="shard.value">
<gl-deprecated-button class="d-flex align-items-center" @click="toggleShard(shard)">
<gl-icon :class="[{ invisible: !isSelected(shard) }]" name="mobile-issue-close" />
......@@ -57,5 +57,5 @@ export default {
</gl-deprecated-button>
</li>
<div v-if="noSyncShards" class="text-secondary p-2">{{ __('Nothing found…') }}</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
ee/app/assets/javascripts/geo_replicable/components/geo_replicable_filter_bar.vue
View file @ 5ef5f413
<script>
import { mapActions, mapState, mapGetters } from 'vuex';
import { debounce } from 'lodash';
import { GlSearchBoxByType, GlDropdown, GlDropdownItem, GlButton } from '@gitlab/ui';
import {
GlSearchBoxByType,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlButton,
} from '@gitlab/ui';
import { __, sprintf } from '~/locale';
import { DEFAULT_SEARCH_DELAY, ACTION_TYPES, FILTER_STATES } from '../constants';
......@@ -9,8 +14,8 @@ export default {
name: 'GeoReplicableFilterBar',
components: {
GlSearchBoxByType,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlButton,
},
computed: {
......@@ -48,8 +53,8 @@ export default {
<div class="row d-flex flex-column flex-sm-row">
<div class="col">
<div class="d-sm-flex mx-n1">
<gl-dropdown :text="__('Filter by status')" class="px-1 my-1 my-sm-0 w-100">
<gl-dropdown-item
<gl-deprecated-dropdown :text="__('Filter by status')" class="px-1 my-1 my-sm-0 w-100">
<gl-deprecated-dropdown-item
v-for="(filter, index) in filterOptions"
:key="index"
:class="{ 'bg-secondary-100': index === currentFilterIndex }"
......@@ -59,8 +64,8 @@ export default {
>{{ filter.label }} {{ replicableTypeName }}</span
>
<span v-else>{{ filter.label }}</span>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<gl-search-box-by-type
v-model="search"
class="px-1 my-1 my-sm-0 bg-white w-100"
......
ee/app/assets/javascripts/insights/components/insights.vue
View file @ 5ef5f413
<script>
import { mapActions, mapState } from 'vuex';
import { GlAlert, GlDropdown, GlDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { GlAlert, GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import InsightsPage from './insights_page.vue';
import InsightsConfigWarning from './insights_config_warning.vue';
......@@ -10,8 +10,8 @@ export default {
GlLoadingIcon,
InsightsPage,
InsightsConfigWarning,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
endpoint: {
......@@ -107,7 +107,7 @@ export default {
</gl-alert>
</div>
<div v-else-if="configPresent" class="insights-wrapper">
<gl-dropdown
<gl-deprecated-dropdown
class="js-insights-dropdown w-100"
data-qa-selector="insights_dashboard_dropdown"
menu-class="w-100 mw-100"
......@@ -115,14 +115,14 @@ export default {
:text="__('Select Page')"
:disabled="pageLoading"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="page in pages"
:key="page.scope"
class="w-100"
@click="onChangePage(page.scope)"
>{{ page.name }}</gl-dropdown-item
>{{ page.name }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
<gl-alert v-if="notice != ''">
{{ notice }}
</gl-alert>
......
ee/app/assets/javascripts/licenses/components/cards/license_card.vue
View file @ 5ef5f413
<script>
import { mapState, mapActions } from 'vuex';
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { capitalizeFirstCharacter } from '~/lib/utils/text_utility';
import { __ } from '~/locale';
import LicenseCardBody from './license_card_body.vue';
......@@ -9,8 +9,8 @@ export default {
name: 'LicenseCard',
components: {
LicenseCardBody,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
props: {
license: {
......@@ -55,21 +55,26 @@ export default {
}}
</h4>
<gl-dropdown right class="js-manage-license" :text="__('Manage')" :disabled="isRemoving">
<gl-dropdown-item
<gl-deprecated-dropdown
right
class="js-manage-license"
:text="__('Manage')"
:disabled="isRemoving"
>
<gl-deprecated-dropdown-item
v-if="isCurrentLicense"
class="js-download-license"
:href="downloadLicensePath"
>
{{ __('Download license') }}
</gl-dropdown-item>
<gl-dropdown-item
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-item
class="js-delete-license text-danger"
@click="confirmDeleteLicense(license)"
>
{{ __('Delete license') }}
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</div>
</div>
......
ee/app/assets/javascripts/related_items_tree/components/create_issue_form.vue
View file @ 5ef5f413
......@@ -2,8 +2,8 @@
import { mapState, mapActions } from 'vuex';
import {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormInput,
GlSearchBoxByType,
GlLoadingIcon,
......@@ -17,8 +17,8 @@ import { SEARCH_DEBOUNCE } from '../constants';
export default {
components: {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormInput,
GlSearchBoxByType,
GlLoadingIcon,
......@@ -129,7 +129,7 @@ export default {
</div>
<div class="col-sm">
<label class="label-bold">{{ __('Project') }}</label>
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdownButton"
:text="dropdownToggleText"
class="w-100 projects-dropdown"
......@@ -154,7 +154,7 @@ export default {
<span v-if="!projects.length" class="d-block text-center p-2">{{
__('No matches found')
}}</span>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="project in projects"
:key="project.id"
class="w-100"
......@@ -163,9 +163,9 @@ export default {
<project-avatar :project="project" :size="32" />
{{ project.name }}
<div class="text-secondary">{{ project.namespace.name }}</div>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</div>
......
ee/app/assets/javascripts/related_items_tree/components/epic_issue_actions_split_button.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownDivider, GlDropdownHeader, GlDropdownItem } from '@gitlab/ui';
import {
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
} from '@gitlab/ui';
import { s__, __ } from '~/locale';
......@@ -29,10 +34,10 @@ export default {
epicActionItems,
issueActionItems,
components: {
GlDropdown,
GlDropdownDivider,
GlDropdownHeader,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
GlDeprecatedDropdownHeader,
GlDeprecatedDropdownItem,
},
props: {
allowSubEpics: {
......@@ -50,32 +55,32 @@ export default {
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
:text="__('Add')"
variant="secondary"
data-qa-selector="epic_issue_actions_split_button"
right
>
<gl-dropdown-header>{{ __('Issue') }}</gl-dropdown-header>
<gl-dropdown-item
<gl-deprecated-dropdown-header>{{ __('Issue') }}</gl-deprecated-dropdown-header>
<gl-deprecated-dropdown-item
v-for="item in $options.issueActionItems"
:key="item.eventName"
active-class="is-active"
@click="change(item)"
>
{{ item.title }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<template v-if="allowSubEpics">
<gl-dropdown-divider />
<gl-dropdown-header>{{ __('Epic') }}</gl-dropdown-header>
<gl-dropdown-item
<gl-deprecated-dropdown-divider />
<gl-deprecated-dropdown-header>{{ __('Epic') }}</gl-deprecated-dropdown-header>
<gl-deprecated-dropdown-item
v-for="item in $options.epicActionItems"
:key="item.eventName"
active-class="is-active"
@click="change(item)"
>
{{ item.title }}
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</template>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
ee/app/assets/javascripts/security_dashboard/components/filter.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlSearchBoxByType } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlSearchBoxByType } from '@gitlab/ui';
import Icon from '~/vue_shared/components/icon.vue';
export default {
components: {
GlDropdown,
GlDeprecatedDropdown,
GlSearchBoxByType,
Icon,
},
......@@ -58,7 +58,7 @@ export default {
<template>
<div class="dashboard-filter">
<strong class="js-name">{{ filter.name }}</strong>
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
class="d-block mt-1"
menu-class="dropdown-extended-height"
......@@ -127,6 +127,6 @@ export default {
>
{{ __('No matching results') }}
</button>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</template>
ee/app/assets/javascripts/security_dashboard/components/fuzzing_artifacts_download.vue
View file @ 5ef5f413
<script>
import { s__ } from '~/locale';
import { GlButton, GlNewDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlButton, GlNewDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
export default {
i18n: {
......@@ -9,7 +9,7 @@ export default {
components: {
GlButton,
GlNewDropdown,
GlDropdownItem,
GlDeprecatedDropdownItem,
},
props: {
jobs: {
......@@ -47,9 +47,12 @@ export default {
variant="info"
size="small"
>
<gl-dropdown-item v-for="job in jobs" :key="job.id" :href="artifactDownloadUrl(job)">{{
job.name
}}</gl-dropdown-item>
<gl-deprecated-dropdown-item
v-for="job in jobs"
:key="job.id"
:href="artifactDownloadUrl(job)"
>{{ job.name }}</gl-deprecated-dropdown-item
>
</gl-new-dropdown>
<gl-button
v-else
......
ee/app/assets/javascripts/sidebar/components/status/health_status_dropdown.vue
View file @ 5ef5f413
<script>
import { GlButton, GlDropdownItem, GlDropdown, GlDropdownDivider } from '@gitlab/ui';
import {
GlButton,
GlDeprecatedDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
} from '@gitlab/ui';
import { s__ } from '~/locale';
import { healthStatusTextMap } from '../../constants';
export default {
components: {
GlButton,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
},
props: {
isEditable: {
......@@ -81,7 +86,7 @@ export default {
<template>
<div class="dropdown dropdown-menu-selectable">
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
class="w-100"
:text="dropdownText"
......@@ -100,7 +105,7 @@ export default {
</div>
<div class="dropdown-content dropdown-body">
<gl-dropdown-item @click="handleDropdownClick(null)">
<gl-deprecated-dropdown-item @click="handleDropdownClick(null)">
<gl-button
variant="link"
class="dropdown-item health-dropdown-item"
......@@ -108,11 +113,11 @@ export default {
>
{{ s__('Sidebar|No status') }}
</gl-button>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<gl-dropdown-divider class="divider health-divider" />
<gl-deprecated-dropdown-divider class="divider health-divider" />
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="option in statusOptions"
:key="option.key"
@click="handleDropdownClick(option.key)"
......@@ -124,8 +129,8 @@ export default {
>
{{ option.value }}
</gl-button>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
</template>
ee/app/assets/javascripts/sidebar/components/status/status.vue
View file @ 5ef5f413
......@@ -5,9 +5,9 @@ import {
GlButton,
GlLoadingIcon,
GlTooltip,
GlDropdownItem,
GlDropdown,
GlDropdownDivider,
GlDeprecatedDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownDivider,
} from '@gitlab/ui';
import { s__ } from '~/locale';
import { healthStatusTextMap } from '../../constants';
......@@ -18,9 +18,9 @@ export default {
GlButton,
GlLoadingIcon,
GlTooltip,
GlDropdown,
GlDropdownItem,
GlDropdownDivider,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedDropdownDivider,
},
mixins: [Tracking.mixin()],
props: {
......@@ -139,7 +139,7 @@ export default {
class="dropdown dropdown-menu-selectable"
:class="{ show: isDropdownShowing, 'd-none': !isDropdownShowing }"
>
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
class="w-100"
:text="dropdownText"
......@@ -158,7 +158,7 @@ export default {
</div>
<div class="dropdown-content dropdown-body">
<gl-dropdown-item @click="handleDropdownClick(null)">
<gl-deprecated-dropdown-item @click="handleDropdownClick(null)">
<gl-button
variant="link"
class="dropdown-item health-dropdown-item"
......@@ -166,11 +166,11 @@ export default {
>
{{ s__('Sidebar|No status') }}
</gl-button>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
<gl-dropdown-divider class="divider health-divider" />
<gl-deprecated-dropdown-divider class="divider health-divider" />
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="option in statusOptions"
:key="option.key"
@click="handleDropdownClick(option.key)"
......@@ -182,9 +182,9 @@ export default {
>
{{ option.value }}
</gl-button>
</gl-dropdown-item>
</gl-deprecated-dropdown-item>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</div>
<gl-loading-icon v-if="isFetching" :inline="true" />
......
ee/app/assets/javascripts/threat_monitoring/components/environment_picker.vue
View file @ 5ef5f413
<script>
import { mapActions, mapGetters, mapState } from 'vuex';
import { GlFormGroup, GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlFormGroup, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
export default {
components: {
GlFormGroup,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
},
computed: {
...mapState('threatMonitoring', ['environments', 'currentEnvironmentId']),
......@@ -26,7 +26,7 @@ export default {
:label-for="$options.environmentFilterId"
class="col-sm-6 col-md-4 col-lg-3 col-xl-2"
>
<gl-dropdown
<gl-deprecated-dropdown
:id="$options.environmentFilterId"
ref="environmentsDropdown"
class="mb-0 d-flex"
......@@ -34,13 +34,13 @@ export default {
:text="currentEnvironmentName"
:disabled="!canChangeEnvironment"
>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="environment in environments"
:key="environment.id"
ref="environmentsDropdownItem"
@click="setCurrentEnvironmentId(environment.id)"
>{{ environment.name }}</gl-dropdown-item
>{{ environment.name }}</gl-deprecated-dropdown-item
>
</gl-dropdown>
</gl-deprecated-dropdown>
</gl-form-group>
</template>
ee/app/assets/javascripts/vue_merge_request_widget/components/visual_review_app_link.vue
View file @ 5ef5f413
<script>
import {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlModal,
GlSearchBoxByType,
GlModalDirective,
......@@ -15,8 +15,8 @@ import { s__, sprintf } from '~/locale';
export default {
components: {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlModal,
GlSearchBoxByType,
Icon,
......@@ -201,7 +201,7 @@ export default {
<gl-deprecated-button @click="cancel">
{{ s__('VisualReviewApp|Cancel') }}
</gl-deprecated-button>
<gl-dropdown
<gl-deprecated-dropdown
v-if="shouldShowChanges"
dropup
right
......@@ -216,19 +216,19 @@ export default {
{{ s__('VisualReviewApp|Open review app') }}
<icon class="fgray" name="external-link" />
</template>
<gl-dropdown-item
<gl-deprecated-dropdown-item
v-for="change in filteredChanges"
:key="change.path"
:href="change.external_url"
data-track-event="open_review_app"
data-track-label="review_app"
>{{ change.path }}</gl-dropdown-item
>{{ change.path }}</gl-deprecated-dropdown-item
>
<div v-show="isSearchEmpty" class="text-secondary p-2">
{{ s__('VisualReviewApp|No review app found or available.') }}
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
<review-app-link
v-else
:display="viewAppDisplay"
......
ee/app/assets/javascripts/vue_shared/license_compliance/components/admin_license_management_row.vue
View file @ 5ef5f413
<script>
import { mapActions } from 'vuex';
import { GlDropdown, GlDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { getIssueStatusFromLicenseStatus } from 'ee/vue_shared/license_compliance/store/utils';
import { s__ } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
......@@ -15,8 +15,8 @@ const invisibleClass = 'invisible';
export default {
name: 'AdminLicenseManagementRow',
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlLoadingIcon,
Icon,
IssueStatusIcon,
......@@ -71,21 +71,21 @@ export default {
<div class="float-right">
<div class="d-flex">
<gl-loading-icon v-if="loading" class="js-loading-icon d-flex align-items-center mr-2" />
<gl-dropdown
<gl-deprecated-dropdown
:text="dropdownText"
:disabled="loading"
toggle-class="d-flex justify-content-between align-items-center"
right
>
<gl-dropdown-item @click="allowLicense(license)">
<gl-deprecated-dropdown-item @click="allowLicense(license)">
<icon :class="approveIconClass" name="mobile-issue-close" />
{{ $options[$options.LICENSE_APPROVAL_ACTION.ALLOW] }}
</gl-dropdown-item>
<gl-dropdown-item @click="denyLicense(license)">
</gl-deprecated-dropdown-item>
<gl-deprecated-dropdown-item @click="denyLicense(license)">
<icon :class="blacklistIconClass" name="mobile-issue-close" />
{{ $options[$options.LICENSE_APPROVAL_ACTION.DENY] }}
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
<button
:disabled="loading"
class="btn btn-blank js-remove-button"
......
ee/app/assets/javascripts/vue_shared/security_reports/components/split_button.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import Icon from '~/vue_shared/components/icon.vue';
export default {
components: {
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
Icon,
},
props: {
......@@ -37,7 +37,7 @@ export default {
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
v-if="selectedButton"
:disabled="disabled"
no-caret
......@@ -47,7 +47,11 @@ export default {
:text="selectedButton.name"
@click="handleClick"
>
<gl-dropdown-item v-for="button in buttons" :key="button.action" @click="setButton(button)">
<gl-deprecated-dropdown-item
v-for="button in buttons"
:key="button.action"
@click="setButton(button)"
>
<div class="media">
<div>
<icon v-if="selectedButton === button" class="gl-mr-2" name="mobile-issue-close" />
......@@ -58,6 +62,6 @@ export default {
<span>{{ button.tagline }}</span>
</div>
</div>
</gl-dropdown-item>
</gl-dropdown>
</gl-deprecated-dropdown-item>
</gl-deprecated-dropdown>
</template>
ee/app/assets/javascripts/vulnerabilities/components/vulnerability_state_dropdown.vue
View file @ 5ef5f413
<script>
import { GlDropdown, GlIcon, GlDeprecatedButton } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlIcon, GlDeprecatedButton } from '@gitlab/ui';
import { VULNERABILITY_STATE_OBJECTS } from '../constants';
export default {
states: Object.values(VULNERABILITY_STATE_OBJECTS),
components: { GlDropdown, GlIcon, GlDeprecatedButton },
components: { GlDeprecatedDropdown, GlIcon, GlDeprecatedButton },
props: {
// Initial vulnerability state from the parent. This is used to disable the Change Status button
......@@ -56,7 +56,7 @@ export default {
</script>
<template>
<gl-dropdown
<gl-deprecated-dropdown
ref="dropdown"
menu-class="p-0"
toggle-class="text-capitalize"
......@@ -96,5 +96,5 @@ export default {
{{ s__('VulnerabilityManagement|Change status') }}
</gl-deprecated-button>
</div>
</gl-dropdown>
</gl-deprecated-dropdown>
</template>
ee/spec/frontend/analytics/cycle_analytics/components/__snapshots__/labels_selector_spec.js.snap
View file @ 5ef5f413
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Value Stream Analytics LabelsSelector with no item selected will render the label selector 1`] = `
"<gl-dropdown-stub text=\\"\\" toggle-class=\\"overflow-hidden\\" class=\\"w-100\\">
<gl-dropdown-item-stub active=\\"true\\">Select a label
</gl-dropdown-item-stub>
"<gl-deprecated-dropdown-stub text=\\"\\" toggle-class=\\"overflow-hidden\\" class=\\"w-100\\">
<gl-deprecated-dropdown-item-stub active=\\"true\\">Select a label
</gl-deprecated-dropdown-item-stub>
<div class=\\"mb-3 px-3\\">
<gl-search-box-by-type-stub value=\\"\\" clearbuttontitle=\\"Clear\\" class=\\"mb-2\\"></gl-search-box-by-type-stub>
</div>
<div class=\\"mb-3 px-3\\">
<gl-dropdown-item-stub class=\\"\\">
<gl-deprecated-dropdown-item-stub class=\\"\\">
<!----> <span class=\\"d-inline-block dropdown-label-box\\" style=\\"background-color: rgb(255, 0, 0);\\"></span>
roses
</gl-dropdown-item-stub>
<gl-dropdown-item-stub class=\\"\\">
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub class=\\"\\">
<!----> <span class=\\"d-inline-block dropdown-label-box\\" style=\\"background-color: rgb(255, 255, 255);\\"></span>
some space
</gl-dropdown-item-stub>
<gl-dropdown-item-stub class=\\"\\">
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub class=\\"\\">
<!----> <span class=\\"d-inline-block dropdown-label-box\\" style=\\"background-color: rgb(0, 0, 255);\\"></span>
violets
</gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<div class=\\"text-center\\" style=\\"display: none;\\">
<gl-loading-icon-stub label=\\"Loading\\" size=\\"md\\" color=\\"orange\\" inline=\\"true\\"></gl-loading-icon-stub>
</div>
......@@ -27,29 +27,29 @@ exports[`Value Stream Analytics LabelsSelector with no item selected will render
No matching labels
</div>
</div>
</gl-dropdown-stub>"
</gl-deprecated-dropdown-stub>"
`;
exports[`Value Stream Analytics LabelsSelector with selectedLabelId set will render the label selector 1`] = `
"<gl-dropdown-stub text=\\"\\" toggle-class=\\"overflow-hidden\\" class=\\"w-100\\">
<gl-dropdown-item-stub>Select a label
</gl-dropdown-item-stub>
"<gl-deprecated-dropdown-stub text=\\"\\" toggle-class=\\"overflow-hidden\\" class=\\"w-100\\">
<gl-deprecated-dropdown-item-stub>Select a label
</gl-deprecated-dropdown-item-stub>
<div class=\\"mb-3 px-3\\">
<gl-search-box-by-type-stub value=\\"\\" clearbuttontitle=\\"Clear\\" class=\\"mb-2\\"></gl-search-box-by-type-stub>
</div>
<div class=\\"mb-3 px-3\\">
<gl-dropdown-item-stub class=\\"\\">
<gl-deprecated-dropdown-item-stub class=\\"\\">
<!----> <span class=\\"d-inline-block dropdown-label-box\\" style=\\"background-color: rgb(255, 0, 0);\\"></span>
roses
</gl-dropdown-item-stub>
<gl-dropdown-item-stub class=\\"\\">
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub class=\\"\\">
<!----> <span class=\\"d-inline-block dropdown-label-box\\" style=\\"background-color: rgb(255, 255, 255);\\"></span>
some space
</gl-dropdown-item-stub>
<gl-dropdown-item-stub active=\\"true\\" class=\\"\\">
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub active=\\"true\\" class=\\"\\">
<!----> <span class=\\"d-inline-block dropdown-label-box\\" style=\\"background-color: rgb(0, 0, 255);\\"></span>
violets
</gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<div class=\\"text-center\\" style=\\"display: none;\\">
<gl-loading-icon-stub label=\\"Loading\\" size=\\"md\\" color=\\"orange\\" inline=\\"true\\"></gl-loading-icon-stub>
</div>
......@@ -57,5 +57,5 @@ exports[`Value Stream Analytics LabelsSelector with selectedLabelId set will ren
No matching labels
</div>
</div>
</gl-dropdown-stub>"
</gl-deprecated-dropdown-stub>"
`;
ee/spec/frontend/analytics/cycle_analytics/components/labels_selector_spec.js
View file @ 5ef5f413
......@@ -11,7 +11,7 @@ import { groupLabels } from '../mock_data';
const selectedLabel = groupLabels[groupLabels.length - 1];
const findActiveItem = wrapper =>
wrapper
.findAll('gl-dropdown-item-stub')
.findAll('gl-deprecated-dropdown-item-stub')
.filter(d => d.attributes('active'))
.at(0);
......
ee/spec/frontend/analytics/cycle_analytics/components/tasks_by_type/tasks_by_type_filters_spec.js
View file @ 5ef5f413
......@@ -2,7 +2,7 @@ import Vuex from 'vuex';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { shallowMount, mount, createLocalVue } from '@vue/test-utils';
import { GlDropdownItem, GlSegmentedControl } from '@gitlab/ui';
import { GlDeprecatedDropdownItem, GlSegmentedControl } from '@gitlab/ui';
import createFlash from '~/flash';
import TasksByTypeFilters from 'ee/analytics/cycle_analytics/components/tasks_by_type/tasks_by_type_filters.vue';
import LabelsSelector from 'ee/analytics/cycle_analytics/components/labels_selector.vue';
......@@ -20,7 +20,7 @@ const selectedLabelIds = [groupLabels[0].id];
const findSubjectFilters = ctx => ctx.find(GlSegmentedControl);
const findSelectedSubjectFilters = ctx => findSubjectFilters(ctx).attributes('checked');
const findDropdownLabels = ctx => ctx.find(LabelsSelector).findAll(GlDropdownItem);
const findDropdownLabels = ctx => ctx.find(LabelsSelector).findAll(GlDeprecatedDropdownItem);
const selectLabelAtIndex = (ctx, index) => {
findDropdownLabels(ctx)
......
ee/spec/frontend/analytics/productivity_analytics/components/__snapshots__/metric_chart_spec.js.snap
View file @ 5ef5f413
......@@ -18,13 +18,13 @@ exports[`MetricChart component template when isLoading is false and chartData is
<div>
<!---->
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="mb-4 metric-dropdown"
menu-class="w-100 mw-100"
text="Please select a metric"
toggle-class="dropdown-menu-toggle w-100"
>
<gl-dropdown-item-stub
<gl-deprecated-dropdown-item-stub
active-class="is-active"
class="w-100"
>
......@@ -42,8 +42,8 @@ exports[`MetricChart component template when isLoading is false and chartData is
Time from last commit to merge
</span>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub
active-class="is-active"
class="w-100"
>
......@@ -61,8 +61,8 @@ exports[`MetricChart component template when isLoading is false and chartData is
Time from first comment to last commit
</span>
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
<!---->
......
ee/spec/frontend/analytics/productivity_analytics/components/__snapshots__/mr_table_spec.js.snap
View file @ 5ef5f413
......@@ -36,13 +36,13 @@ exports[`MergeRequestTable component matches the snapshot 1`] = `
Time to merge
</span>
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="w-100 metric-col"
menu-class="w-100 mw-100"
text="Time from first comment to last commit"
toggle-class="dropdown-menu-toggle w-100"
>
<gl-dropdown-item-stub
<gl-deprecated-dropdown-item-stub
active-class="is-active"
class="w-100"
>
......@@ -58,8 +58,8 @@ exports[`MergeRequestTable component matches the snapshot 1`] = `
Time from first commit until first comment
</span>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub
active-class="is-active"
class="w-100"
>
......@@ -75,8 +75,8 @@ exports[`MergeRequestTable component matches the snapshot 1`] = `
Time from first comment to last commit
</span>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub
active-class="is-active"
class="w-100"
>
......@@ -92,8 +92,8 @@ exports[`MergeRequestTable component matches the snapshot 1`] = `
Time from last commit to merge
</span>
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
</div>
</div>
</div>
......
ee/spec/frontend/analytics/productivity_analytics/components/app_spec.js
View file @ 5ef5f413
......@@ -11,8 +11,8 @@ import { TEST_HOST } from 'helpers/test_constants';
import {
GlEmptyState,
GlLoadingIcon,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlDeprecatedButton,
} from '@gitlab/ui';
import { GlColumnChart } from '@gitlab/ui/dist/charts';
......@@ -78,7 +78,7 @@ describe('ProductivityApp component', () => {
const findCommitBasedMetricChart = () => wrapper.find({ ref: 'commitBasedChart' });
const findScatterplotMetricChart = () => wrapper.find({ ref: 'scatterplot' });
const findMrTableSortSection = () => wrapper.find('.js-mr-table-sort');
const findSortFieldDropdown = () => findMrTableSortSection().find(GlDropdown);
const findSortFieldDropdown = () => findMrTableSortSection().find(GlDeprecatedDropdown);
const findSortOrderToggle = () => findMrTableSortSection().find(GlDeprecatedButton);
const findMrTableSection = () => wrapper.find('.js-mr-table');
const findMrTable = () => findMrTableSection().find(MergeRequestTable);
......@@ -430,7 +430,7 @@ describe('ProductivityApp component', () => {
it('should change the sort field', () => {
findSortFieldDropdown()
.findAll(GlDropdownItem)
.findAll(GlDeprecatedDropdownItem)
.at(0)
.vm.$emit('click');
......
ee/spec/frontend/analytics/productivity_analytics/components/metric_chart_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import MetricChart from 'ee/analytics/productivity_analytics/components/metric_chart.vue';
import { GlLoadingIcon, GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlLoadingIcon, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import Icon from '~/vue_shared/components/icon.vue';
describe('MetricChart component', () => {
......@@ -38,8 +38,8 @@ describe('MetricChart component', () => {
const findLoadingIndicator = () => wrapper.find(GlLoadingIcon);
const findNoDataSection = () => wrapper.find({ ref: 'noData' });
const findMetricDropdown = () => wrapper.find(GlDropdown);
const findMetricDropdownItems = () => findMetricDropdown().findAll(GlDropdownItem);
const findMetricDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findMetricDropdownItems = () => findMetricDropdown().findAll(GlDeprecatedDropdownItem);
const findChartSlot = () => wrapper.find({ ref: 'chart' });
describe('template', () => {
......
ee/spec/frontend/analytics/productivity_analytics/components/mr_table_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import MergeRequestTable from 'ee/analytics/productivity_analytics/components/mr_table.vue';
import MergeRequestTableRow from 'ee/analytics/productivity_analytics/components/mr_table_row.vue';
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { mockMergeRequests } from '../mock_data';
describe('MergeRequestTable component', () => {
......@@ -27,8 +27,8 @@ describe('MergeRequestTable component', () => {
const findMergeRequestTableRows = () => wrapper.findAll(MergeRequestTableRow);
const findTableHeader = () => wrapper.find('.table-row-header');
const findDropdown = () => wrapper.find(GlDropdown);
const findDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findDropdownItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findFirstDropdownItem = () => findDropdownItems().at(0);
beforeEach(() => {
......
ee/spec/frontend/analytics/shared/components/date_range_dropdown_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
import DateRangeDropdown from 'ee/analytics/shared/components/date_range_dropdown.vue';
describe('DateRangeDropdown component', () => {
......@@ -23,7 +23,7 @@ describe('DateRangeDropdown component', () => {
createComponent();
});
const findDropdownElements = () => wrapper.findAll(GlDropdownItem);
const findDropdownElements = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findFirstDropdownElement = () => findDropdownElements().at(0);
afterEach(() => {
......
ee/spec/frontend/boards/components/weight_select_spec.js
View file @ 5ef5f413
import { mount } from '@vue/test-utils';
import WeightSelect from 'ee/boards/components/weight_select.vue';
import { GlDeprecatedButton, GlDropdown } from '@gitlab/ui';
import { GlDeprecatedButton, GlDeprecatedDropdown } from '@gitlab/ui';
describe('WeightSelect', () => {
let wrapper;
const editButton = () => wrapper.find(GlDeprecatedButton);
const valueContainer = () => wrapper.find('.value');
const weightDropdown = () => wrapper.find(GlDropdown);
const weightDropdown = () => wrapper.find(GlDeprecatedDropdown);
const weightSelect = () => wrapper.find({ ref: 'weight-select' });
const defaultProps = {
......
ee/spec/frontend/dependencies/components/__snapshots__/dependencies_actions_spec.js.snap
View file @ 5ef5f413
......@@ -7,12 +7,12 @@ exports[`DependenciesActions component matches the snapshot 1`] = `
<div
class="btn-group flex-grow-1 mr-2"
>
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="flex-grow-1 text-center"
right=""
text="Severity"
>
<gl-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<span
class="d-flex"
>
......@@ -25,8 +25,8 @@ exports[`DependenciesActions component matches the snapshot 1`] = `
Component name
</span>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<span
class="d-flex"
>
......@@ -39,8 +39,8 @@ exports[`DependenciesActions component matches the snapshot 1`] = `
Packager
</span>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<span
class="d-flex"
>
......@@ -53,8 +53,8 @@ exports[`DependenciesActions component matches the snapshot 1`] = `
Severity
</span>
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
<gl-deprecated-button-stub
class="flex-grow-0 js-sort-order"
......
ee/spec/frontend/dependencies/components/dependencies_actions_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
import { TEST_HOST } from 'helpers/test_constants';
import createStore from 'ee/dependencies/store';
import { DEPENDENCY_LIST_TYPES } from 'ee/dependencies/store/constants';
......@@ -39,7 +39,7 @@ describe('DependenciesActions component', () => {
});
it('dispatches the right setSortField action on clicking each item in the dropdown', () => {
const dropdownItems = wrapper.findAll(GlDropdownItem).wrappers;
const dropdownItems = wrapper.findAll(GlDeprecatedDropdownItem).wrappers;
dropdownItems.forEach(item => {
// trigger() does not work on stubbed/shallow mounted components
......
ee/spec/frontend/geo_node_form/components/geo_node_form_namespaces_spec.js
View file @ 5ef5f413
import Vuex from 'vuex';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import { GlIcon, GlSearchBoxByType, GlDropdown } from '@gitlab/ui';
import { GlIcon, GlSearchBoxByType, GlDeprecatedDropdown } from '@gitlab/ui';
import GeoNodeFormNamespaces from 'ee/geo_node_form/components/geo_node_form_namespaces.vue';
import store from 'ee/geo_node_form/store';
import { MOCK_SYNC_NAMESPACES } from '../mock_data';
......@@ -41,7 +41,7 @@ describe('GeoNodeFormNamespaces', () => {
wrapper.destroy();
});
const findGlDropdown = () => wrapper.find(GlDropdown);
const findGlDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findGlDropdownSearch = () => findGlDropdown().find(GlSearchBoxByType);
const findDropdownItems = () => findGlDropdown().findAll('li');
const findDropdownItemsText = () => findDropdownItems().wrappers.map(w => w.text());
......
ee/spec/frontend/geo_node_form/components/geo_node_form_shards_spec.js
View file @ 5ef5f413
import { mount } from '@vue/test-utils';
import { GlIcon, GlDropdown } from '@gitlab/ui';
import { GlIcon, GlDeprecatedDropdown } from '@gitlab/ui';
import GeoNodeFormShards from 'ee/geo_node_form/components/geo_node_form_shards.vue';
import { MOCK_SYNC_SHARDS } from '../mock_data';
......@@ -32,7 +32,7 @@ describe('GeoNodeFormShards', () => {
wrapper.destroy();
});
const findGlDropdown = () => wrapper.find(GlDropdown);
const findGlDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findDropdownItems = () => findGlDropdown().findAll('li');
describe('template', () => {
......
ee/spec/frontend/geo_replicable/components/geo_replicable_filter_bar_spec.js
View file @ 5ef5f413
import Vuex from 'vuex';
import { createLocalVue, mount } from '@vue/test-utils';
import { GlDropdown, GlDropdownItem, GlSearchBoxByType, GlButton } from '@gitlab/ui';
import {
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlSearchBoxByType,
GlButton,
} from '@gitlab/ui';
import GeoReplicableFilterBar from 'ee/geo_replicable/components/geo_replicable_filter_bar.vue';
import createStore from 'ee/geo_replicable/store';
import { DEFAULT_SEARCH_DELAY } from 'ee/geo_replicable/constants';
......@@ -34,8 +39,8 @@ describe('GeoReplicableFilterBar', () => {
});
const findNavContainer = () => wrapper.find('nav');
const findGlDropdown = () => findNavContainer().find(GlDropdown);
const findGlDropdownItems = () => findNavContainer().findAll(GlDropdownItem);
const findGlDropdown = () => findNavContainer().find(GlDeprecatedDropdown);
const findGlDropdownItems = () => findNavContainer().findAll(GlDeprecatedDropdownItem);
const findDropdownItemsText = () => findGlDropdownItems().wrappers.map(w => w.text());
const findGlSearchBox = () => findNavContainer().find(GlSearchBoxByType);
const findGlButton = () => findNavContainer().find(GlButton);
......
ee/spec/frontend/licenses/components/cards/__snapshots__/license_card_spec.js.snap
View file @ 5ef5f413
......@@ -16,21 +16,21 @@ exports[`LicenseCard renders license card with a delete button and license body
</h4>
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="js-manage-license"
right=""
text="Manage"
>
<!---->
<gl-dropdown-item-stub
<gl-deprecated-dropdown-item-stub
class="js-delete-license text-danger"
>
Delete license
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
</div>
</div>
......
ee/spec/frontend/pages/admin/application_settings/ci_cd/ci_template_spec.js
View file @ 5ef5f413
import CiTemplate from 'ee/pages/admin/application_settings/ci_cd/ci_template';
import { setHTMLFixture } from 'helpers/fixtures';
import GLDropdown from '~/gl_dropdown'; // eslint-disable-line no-unused-vars
import '~/gl_dropdown';
const DROPDOWN_DATA = {
Instance: [{ name: 'test', id: 'test' }],
......
ee/spec/frontend/projects/settings/access_dropdown_spec.js
View file @ 5ef5f413
import $ from 'jquery';
import GLDropdown from '~/gl_dropdown'; // eslint-disable-line no-unused-vars
import '~/gl_dropdown';
import AccessDropdown from 'ee/projects/settings/access_dropdown';
import { LEVEL_TYPES } from 'ee/projects/settings/constants';
......
ee/spec/frontend/related_items_tree/components/create_issue_form_spec.js
View file @ 5ef5f413
......@@ -2,8 +2,8 @@ import { shallowMount, createLocalVue } from '@vue/test-utils';
import Vuex from 'vuex';
import {
GlDeprecatedButton,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlFormInput,
GlSearchBoxByType,
GlLoadingIcon,
......@@ -163,7 +163,7 @@ describe('CreateIssueForm', () => {
it('renders Projects dropdown field', () => {
const projectsDropdownLabel = wrapper.findAll('label').at(1);
const projectsDropdownButton = wrapper.find(GlDropdown);
const projectsDropdownButton = wrapper.find(GlDeprecatedDropdown);
expect(projectsDropdownLabel.text()).toBe('Project');
expect(projectsDropdownButton.props('text')).toBe('Select a project');
......@@ -173,8 +173,8 @@ describe('CreateIssueForm', () => {
wrapper.vm.$store.dispatch('receiveProjectsSuccess', mockProjects);
return wrapper.vm.$nextTick(() => {
const projectsDropdownButton = wrapper.find(GlDropdown);
const dropdownItems = projectsDropdownButton.findAll(GlDropdownItem);
const projectsDropdownButton = wrapper.find(GlDeprecatedDropdown);
const dropdownItems = projectsDropdownButton.findAll(GlDeprecatedDropdownItem);
expect(projectsDropdownButton.find(GlSearchBoxByType).exists()).toBe(true);
expect(projectsDropdownButton.find(GlLoadingIcon).exists()).toBe(true);
......@@ -195,7 +195,7 @@ describe('CreateIssueForm', () => {
const filteredMockProjects = mockProjects.filter(project => project.name === searchKey);
jest.spyOn(wrapper.vm, 'fetchProjects').mockImplementation(jest.fn());
wrapper.find(GlDropdown).trigger('click');
wrapper.find(GlDeprecatedDropdown).trigger('click');
wrapper.setData({
searchKey,
......@@ -207,7 +207,7 @@ describe('CreateIssueForm', () => {
wrapper.vm.$store.dispatch('receiveProjectsSuccess', filteredMockProjects);
})
.then(() => {
expect(wrapper.findAll(GlDropdownItem)).toHaveLength(1);
expect(wrapper.findAll(GlDeprecatedDropdownItem)).toHaveLength(1);
});
});
......@@ -216,7 +216,7 @@ describe('CreateIssueForm', () => {
const filteredMockProjects = mockProjects.filter(project => project.name === searchKey);
jest.spyOn(wrapper.vm, 'fetchProjects').mockImplementation(jest.fn());
wrapper.find(GlDropdown).trigger('click');
wrapper.find(GlDeprecatedDropdown).trigger('click');
wrapper.setData({
searchKey,
......
ee/spec/frontend/security_dashboard/components/filter_spec.js
View file @ 5ef5f413
......@@ -19,7 +19,7 @@ describe('Filter component', () => {
wrapper = mount(Filter, {
stubs: {
...stubChildren(Filter),
GlDropdown: false,
GlDeprecatedDropdown: false,
GlSearchBoxByType: false,
},
propsData,
......
ee/spec/frontend/security_dashboard/components/fuzzing_artifacts_download_spec.js
View file @ 5ef5f413
......@@ -2,7 +2,7 @@ import Vuex from 'vuex';
import FuzzingArtifactsDownload from 'ee/security_dashboard/components/fuzzing_artifacts_download.vue';
import createStore from 'ee/security_dashboard/store';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { GlButton, GlNewDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlButton, GlNewDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -60,11 +60,11 @@ describe('Filter component', () => {
it('should render a dropdown button with several items', () => {
expect(wrapper.find(GlButton).exists()).toBe(false);
expect(wrapper.find(GlNewDropdown).exists()).toBe(true);
expect(wrapper.findAll(GlDropdownItem).length).toBe(2);
expect(wrapper.findAll(GlDeprecatedDropdownItem).length).toBe(2);
});
it('should render with href set to the correct filepath for every element', () => {
const wrapperArray = wrapper.findAll(GlDropdownItem);
const wrapperArray = wrapper.findAll(GlDeprecatedDropdownItem);
wrapperArray.wrappers.forEach((_, index) => {
const href = `/api/v4/projects/${projectId}/jobs/artifacts/${
jobs[index].ref
......
ee/spec/frontend/sidebar/components/status/status_spec.js
View file @ 5ef5f413
import { GlDropdown, GlDropdownItem, GlLoadingIcon, GlTooltip } from '@gitlab/ui';
import {
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlLoadingIcon,
GlTooltip,
} from '@gitlab/ui';
import { mount, shallowMount } from '@vue/test-utils';
import Vue from 'vue';
import Status from 'ee/sidebar/components/status/status.vue';
......@@ -10,9 +15,9 @@ const getTooltipText = wrapper => wrapper.find(GlTooltip).text();
const getEditButton = wrapper => wrapper.find({ ref: 'editButton' });
const getDropdownElement = wrapper => wrapper.find(GlDropdown);
const getDropdownElement = wrapper => wrapper.find(GlDeprecatedDropdown);
const getRemoveStatusItem = wrapper => wrapper.find(GlDropdownItem);
const getRemoveStatusItem = wrapper => wrapper.find(GlDeprecatedDropdownItem);
describe('Status', () => {
let wrapper;
......@@ -215,7 +220,7 @@ describe('Status', () => {
});
it('hides form when a dropdown item is clicked', () => {
const dropdownItem = wrapper.findAll(GlDropdownItem).at(1);
const dropdownItem = wrapper.findAll(GlDeprecatedDropdownItem).at(1);
dropdownItem.vm.$emit('click');
......@@ -241,7 +246,7 @@ describe('Status', () => {
});
it('shows 4 dropdown items', () => {
expect(wrapper.findAll(GlDropdownItem)).toHaveLength(4);
expect(wrapper.findAll(GlDeprecatedDropdownItem)).toHaveLength(4);
});
// Test that "On track", "Needs attention", and "At risk" are displayed
......@@ -250,7 +255,7 @@ describe('Status', () => {
(statusText, index) => {
expect(
wrapper
.findAll(GlDropdownItem)
.findAll(GlDeprecatedDropdownItem)
.at(index + 1) // +1 in index to account for 1st item as `No status`
.text(),
).toContain(statusText);
......@@ -262,7 +267,7 @@ describe('Status', () => {
'emits onFormSubmit event with argument "%s" when user selects the option and submits form',
(status, index) => {
wrapper
.findAll(GlDropdownItem)
.findAll(GlDeprecatedDropdownItem)
.at(index + 1)
.vm.$emit('click', { preventDefault: () => null });
......
ee/spec/frontend/vue_mr_widget/components/visual_review_app_spec.js
View file @ 5ef5f413
import { mount } from '@vue/test-utils';
import VisualReviewAppLink from 'ee/vue_merge_request_widget/components/visual_review_app_link.vue';
import { GlDeprecatedButton, GlDropdown, GlModal } from '@gitlab/ui';
import { GlDeprecatedButton, GlDeprecatedDropdown, GlModal } from '@gitlab/ui';
import { mockTracking, triggerEvent } from 'helpers/tracking_helper';
import ModalCopyButton from '~/vue_shared/components/modal_copy_button.vue';
......@@ -132,7 +132,7 @@ describe('Visual Review App Link', () => {
it('with review app split dropdown', () => {
expect(
wrapper
.find(GlDropdown)
.find(GlDeprecatedDropdown)
.find(`a[href='${propsData.link}']`)
.exists(),
).toEqual(true);
......@@ -141,7 +141,7 @@ describe('Visual Review App Link', () => {
it('contains a list of changed pages', () => {
expect(
wrapper
.find(GlDropdown)
.find(GlDeprecatedDropdown)
.find(`a[href='${propsData.link}/example-path']`)
.exists(),
).toEqual(true);
......
ee/spec/frontend/vue_shared/security_reports/components/split_button_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import SplitButton from 'ee/vue_shared/security_reports/components/split_button.vue';
import Icon from '~/vue_shared/components/icon.vue';
......@@ -21,8 +21,8 @@ const buttons = [
describe('Split Button', () => {
let wrapper;
const findDropdown = () => wrapper.find(GlDropdown);
const findDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findDropdownItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
const createComponent = props => {
wrapper = shallowMount(SplitButton, {
......
spec/frontend/alert_management/components/alert_management_table_spec.js
View file @ 5ef5f413
......@@ -3,8 +3,8 @@ import {
GlTable,
GlAlert,
GlLoadingIcon,
GlDropdown,
GlDropdownItem,
GlDeprecatedDropdown,
GlDeprecatedDropdownItem,
GlIcon,
GlTabs,
GlTab,
......@@ -32,12 +32,12 @@ describe('AlertManagementTable', () => {
const findAlerts = () => wrapper.findAll('table tbody tr');
const findAlert = () => wrapper.find(GlAlert);
const findLoader = () => wrapper.find(GlLoadingIcon);
const findStatusDropdown = () => wrapper.find(GlDropdown);
const findStatusDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findStatusFilterTabs = () => wrapper.findAll(GlTab);
const findStatusTabs = () => wrapper.find(GlTabs);
const findStatusFilterBadge = () => wrapper.findAll(GlBadge);
const findDateFields = () => wrapper.findAll(TimeAgo);
const findFirstStatusOption = () => findStatusDropdown().find(GlDropdownItem);
const findFirstStatusOption = () => findStatusDropdown().find(GlDeprecatedDropdownItem);
const findAssignees = () => wrapper.findAll('[data-testid="assigneesField"]');
const findSeverityFields = () => wrapper.findAll('[data-testid="severityField"]');
const findSeverityColumnHeader = () => wrapper.findAll('th').at(0);
......
spec/frontend/alert_management/components/sidebar/alert_managment_sidebar_assignees_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import axios from 'axios';
import MockAdapter from 'axios-mock-adapter';
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
import SidebarAssignee from '~/alert_management/components/sidebar/sidebar_assignee.vue';
import SidebarAssignees from '~/alert_management/components/sidebar/sidebar_assignees.vue';
import AlertSetAssignees from '~/alert_management/graphql/mutations/alert_set_assignees.mutation.graphql';
......@@ -103,7 +103,7 @@ describe('Alert Details Sidebar Assignees', () => {
it('renders a unassigned option', () => {
wrapper.setData({ isDropdownSearching: false });
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find(GlDropdownItem).text()).toBe('Unassigned');
expect(wrapper.find(GlDeprecatedDropdownItem).text()).toBe('Unassigned');
});
});
......
spec/frontend/alert_management/components/sidebar/alert_sidebar_status_spec.js
View file @ 5ef5f413
import { mount } from '@vue/test-utils';
import { GlDropdown, GlDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem, GlLoadingIcon } from '@gitlab/ui';
import { trackAlertStatusUpdateOptions } from '~/alert_management/constants';
import AlertSidebarStatus from '~/alert_management/components/sidebar/sidebar_status.vue';
import updateAlertStatus from '~/alert_management/graphql/mutations/update_alert_status.mutation.graphql';
......@@ -10,8 +10,8 @@ const mockAlert = mockAlerts[0];
describe('Alert Details Sidebar Status', () => {
let wrapper;
const findStatusDropdown = () => wrapper.find(GlDropdown);
const findStatusDropdownItem = () => wrapper.find(GlDropdownItem);
const findStatusDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findStatusDropdownItem = () => wrapper.find(GlDeprecatedDropdownItem);
const findStatusLoadingIcon = () => wrapper.find(GlLoadingIcon);
function mountComponent({ data, sidebarCollapsed = true, loading = false, stubs = {} } = {}) {
......
spec/frontend/boards/components/boards_selector_spec.js
View file @ 5ef5f413
import { nextTick } from 'vue';
import { mount } from '@vue/test-utils';
import { GlDropdown, GlLoadingIcon } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlLoadingIcon } from '@gitlab/ui';
import { TEST_HOST } from 'spec/test_constants';
import BoardsSelector from '~/boards/components/boards_selector.vue';
import boardsStore from '~/boards/stores/boards_store';
......@@ -103,7 +103,7 @@ describe('BoardsSelector', () => {
});
// Emits gl-dropdown show event to simulate the dropdown is opened at initialization time
wrapper.find(GlDropdown).vm.$emit('show');
wrapper.find(GlDeprecatedDropdown).vm.$emit('show');
});
afterEach(() => {
......
spec/frontend/ci_variable_list/components/ci_enviroments_dropdown_spec.js
View file @ 5ef5f413
import Vuex from 'vuex';
import CiEnvironmentsDropdown from '~/ci_variable_list/components/ci_environments_dropdown.vue';
import { shallowMount, createLocalVue } from '@vue/test-utils';
import { GlDropdownItem, GlIcon } from '@gitlab/ui';
import { GlDeprecatedDropdownItem, GlIcon } from '@gitlab/ui';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -26,8 +26,8 @@ describe('Ci environments dropdown', () => {
});
};
const findAllDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findDropdownItemByIndex = index => wrapper.findAll(GlDropdownItem).at(index);
const findAllDropdownItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findDropdownItemByIndex = index => wrapper.findAll(GlDeprecatedDropdownItem).at(index);
const findActiveIconByIndex = index => wrapper.findAll(GlIcon).at(index);
afterEach(() => {
......
spec/frontend/clusters/components/fluentd_output_settings_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import FluentdOutputSettings from '~/clusters/components/fluentd_output_settings.vue';
import { APPLICATION_STATUS, FLUENTD } from '~/clusters/constants';
import { GlAlert, GlDropdown, GlFormCheckbox } from '@gitlab/ui';
import { GlAlert, GlDeprecatedDropdown, GlFormCheckbox } from '@gitlab/ui';
import eventHub from '~/clusters/event_hub';
const { UPDATING } = APPLICATION_STATUS;
......@@ -36,7 +36,7 @@ describe('FluentdOutputSettings', () => {
};
const findSaveButton = () => wrapper.find({ ref: 'saveBtn' });
const findCancelButton = () => wrapper.find({ ref: 'cancelBtn' });
const findProtocolDropdown = () => wrapper.find(GlDropdown);
const findProtocolDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findCheckbox = name =>
wrapper.findAll(GlFormCheckbox).wrappers.find(x => x.text() === name);
const findHost = () => wrapper.find('#fluentd-host');
......
spec/frontend/clusters/components/ingress_modsecurity_settings_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import IngressModsecuritySettings from '~/clusters/components/ingress_modsecurity_settings.vue';
import { APPLICATION_STATUS, INGRESS } from '~/clusters/constants';
import { GlAlert, GlToggle, GlDropdown } from '@gitlab/ui';
import { GlAlert, GlToggle, GlDeprecatedDropdown } from '@gitlab/ui';
import eventHub from '~/clusters/event_hub';
const { UPDATING } = APPLICATION_STATUS;
......@@ -31,7 +31,7 @@ describe('IngressModsecuritySettings', () => {
const findSaveButton = () => wrapper.find('.btn-success');
const findCancelButton = () => wrapper.find('[variant="secondary"]');
const findModSecurityToggle = () => wrapper.find(GlToggle);
const findModSecurityDropdown = () => wrapper.find(GlDropdown);
const findModSecurityDropdown = () => wrapper.find(GlDeprecatedDropdown);
describe('when ingress is installed', () => {
beforeEach(() => {
......
spec/frontend/clusters/components/knative_domain_editor_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
import KnativeDomainEditor from '~/clusters/components/knative_domain_editor.vue';
import LoadingButton from '~/vue_shared/components/loading_button.vue';
import { APPLICATION_STATUS } from '~/clusters/constants';
......@@ -113,7 +113,7 @@ describe('KnativeDomainEditor', () => {
createComponent({ knative: { ...knative, availableDomains: [newDomain] } });
jest.spyOn(wrapper.vm, 'selectDomain');
wrapper.find(GlDropdownItem).vm.$emit('click');
wrapper.find(GlDeprecatedDropdownItem).vm.$emit('click');
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.vm.selectDomain).toHaveBeenCalledWith(newDomain);
......
spec/frontend/clusters/services/crossplane_provider_stack_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdownItem, GlIcon } from '@gitlab/ui';
import { GlDeprecatedDropdownItem, GlIcon } from '@gitlab/ui';
import CrossplaneProviderStack from '~/clusters/components/crossplane_provider_stack.vue';
describe('CrossplaneProviderStack component', () => {
......@@ -37,7 +37,7 @@ describe('CrossplaneProviderStack component', () => {
createComponent({ crossplane });
});
const findDropdownElements = () => wrapper.findAll(GlDropdownItem);
const findDropdownElements = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findFirstDropdownElement = () => findDropdownElements().at(0);
afterEach(() => {
......
spec/frontend/confidential_merge_request/components/dropdown_spec.js
View file @ 5ef5f413
import { mount } from '@vue/test-utils';
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
import Dropdown from '~/confidential_merge_request/components/dropdown.vue';
let vm;
......@@ -30,7 +30,7 @@ describe('Confidential merge request project dropdown component', () => {
},
]);
expect(vm.findAll(GlDropdownItem).length).toBe(2);
expect(vm.findAll(GlDeprecatedDropdownItem).length).toBe(2);
});
it('renders selected project icon', () => {
......
spec/frontend/deploy_freeze/components/timezone_dropdown_spec.js
View file @ 5ef5f413
......@@ -4,7 +4,7 @@ import { shallowMount, createLocalVue } from '@vue/test-utils';
import createStore from '~/deploy_freeze/store';
import { mockTimezoneData } from '../mock_data';
import { GlDropdownItem, GlNewDropdown } from '@gitlab/ui';
import { GlDeprecatedDropdownItem, GlNewDropdown } from '@gitlab/ui';
const localVue = createLocalVue();
localVue.use(Vuex);
......@@ -30,8 +30,8 @@ describe('Deploy freeze timezone dropdown', () => {
wrapper.setData({ searchTerm });
};
const findAllDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findDropdownItemByIndex = index => wrapper.findAll(GlDropdownItem).at(index);
const findAllDropdownItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findDropdownItemByIndex = index => wrapper.findAll(GlDeprecatedDropdownItem).at(index);
afterEach(() => {
wrapper.destroy();
......
spec/frontend/design_management/components/upload/__snapshots__/design_version_dropdown_spec.js.snap
View file @ 5ef5f413
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`Design management design version dropdown component renders design version dropdown button 1`] = `
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="design-version-dropdown"
issueiid=""
projectpath=""
text="Showing Latest Version"
variant="link"
>
<gl-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<router-link-stub
class="d-flex js-version-link"
to="[object Object]"
......@@ -31,8 +31,8 @@ exports[`Design management design version dropdown component renders design vers
class="fa fa-check pull-right"
/>
</router-link-stub>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<router-link-stub
class="d-flex js-version-link"
to="[object Object]"
......@@ -51,19 +51,19 @@ exports[`Design management design version dropdown component renders design vers
<!---->
</router-link-stub>
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
`;
exports[`Design management design version dropdown component renders design version list 1`] = `
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="design-version-dropdown"
issueiid=""
projectpath=""
text="Showing Latest Version"
variant="link"
>
<gl-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<router-link-stub
class="d-flex js-version-link"
to="[object Object]"
......@@ -86,8 +86,8 @@ exports[`Design management design version dropdown component renders design vers
class="fa fa-check pull-right"
/>
</router-link-stub>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub>
<router-link-stub
class="d-flex js-version-link"
to="[object Object]"
......@@ -106,6 +106,6 @@ exports[`Design management design version dropdown component renders design vers
<!---->
</router-link-stub>
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
`;
spec/frontend/design_management/components/upload/design_version_dropdown_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import DesignVersionDropdown from '~/design_management/components/upload/design_version_dropdown.vue';
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import mockAllVersions from './mock_data/all_versions';
const LATEST_VERSION_ID = 3;
......@@ -75,7 +75,9 @@ describe('Design management design version dropdown component', () => {
createComponent();
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find(GlDropdown).attributes('text')).toBe('Showing Latest Version');
expect(wrapper.find(GlDeprecatedDropdown).attributes('text')).toBe(
'Showing Latest Version',
);
});
});
......@@ -83,7 +85,9 @@ describe('Design management design version dropdown component', () => {
createComponent({ maxVersions: 1 });
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find(GlDropdown).attributes('text')).toBe('Showing Latest Version');
expect(wrapper.find(GlDeprecatedDropdown).attributes('text')).toBe(
'Showing Latest Version',
);
});
});
......@@ -91,7 +95,7 @@ describe('Design management design version dropdown component', () => {
createComponent({ $route: designRouteFactory(PREVIOUS_VERSION_ID) });
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find(GlDropdown).attributes('text')).toBe(`Showing Version #1`);
expect(wrapper.find(GlDeprecatedDropdown).attributes('text')).toBe(`Showing Version #1`);
});
});
......@@ -99,7 +103,9 @@ describe('Design management design version dropdown component', () => {
createComponent({ $route: designRouteFactory(LATEST_VERSION_ID) });
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.find(GlDropdown).attributes('text')).toBe('Showing Latest Version');
expect(wrapper.find(GlDeprecatedDropdown).attributes('text')).toBe(
'Showing Latest Version',
);
});
});
......@@ -107,7 +113,9 @@ describe('Design management design version dropdown component', () => {
createComponent();
return wrapper.vm.$nextTick().then(() => {
expect(wrapper.findAll(GlDropdownItem)).toHaveLength(wrapper.vm.allVersions.length);
expect(wrapper.findAll(GlDeprecatedDropdownItem)).toHaveLength(
wrapper.vm.allVersions.length,
);
});
});
});
......
spec/frontend/error_tracking/components/error_tracking_list_spec.js
View file @ 5ef5f413
import { createLocalVue, mount } from '@vue/test-utils';
import Vuex from 'vuex';
import { GlEmptyState, GlLoadingIcon, GlFormInput, GlPagination, GlDropdown } from '@gitlab/ui';
import {
GlEmptyState,
GlLoadingIcon,
GlFormInput,
GlPagination,
GlDeprecatedDropdown,
} from '@gitlab/ui';
import stubChildren from 'helpers/stub_children';
import ErrorTrackingList from '~/error_tracking/components/error_tracking_list.vue';
import ErrorTrackingActions from '~/error_tracking/components/error_tracking_actions.vue';
......@@ -18,19 +24,19 @@ describe('ErrorTrackingList', () => {
const findErrorListTable = () => wrapper.find('table');
const findErrorListRows = () => wrapper.findAll('tbody tr');
const dropdownsArray = () => wrapper.findAll(GlDropdown);
const dropdownsArray = () => wrapper.findAll(GlDeprecatedDropdown);
const findRecentSearchesDropdown = () =>
dropdownsArray()
.at(0)
.find(GlDropdown);
.find(GlDeprecatedDropdown);
const findStatusFilterDropdown = () =>
dropdownsArray()
.at(1)
.find(GlDropdown);
.find(GlDeprecatedDropdown);
const findSortDropdown = () =>
dropdownsArray()
.at(2)
.find(GlDropdown);
.find(GlDeprecatedDropdown);
const findLoadingIcon = () => wrapper.find(GlLoadingIcon);
const findPagination = () => wrapper.find(GlPagination);
const findErrorActions = () => wrapper.find(ErrorTrackingActions);
......@@ -128,8 +134,8 @@ describe('ErrorTrackingList', () => {
mountComponent({
stubs: {
GlTable: false,
GlDropdown: false,
GlDropdownItem: false,
GlDeprecatedDropdown: false,
GlDeprecatedDropdownItem: false,
GlLink: false,
},
});
......@@ -199,8 +205,8 @@ describe('ErrorTrackingList', () => {
mountComponent({
stubs: {
GlTable: false,
GlDropdown: false,
GlDropdownItem: false,
GlDeprecatedDropdown: false,
GlDeprecatedDropdownItem: false,
},
});
});
......@@ -335,8 +341,8 @@ describe('ErrorTrackingList', () => {
beforeEach(() => {
mountComponent({
stubs: {
GlDropdown: false,
GlDropdownItem: false,
GlDeprecatedDropdown: false,
GlDeprecatedDropdownItem: false,
},
});
});
......
spec/frontend/error_tracking_settings/components/project_dropdown_spec.js
View file @ 5ef5f413
import { pick, clone } from 'lodash';
import Vuex from 'vuex';
import { createLocalVue, shallowMount } from '@vue/test-utils';
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import ProjectDropdown from '~/error_tracking_settings/components/project_dropdown.vue';
import { defaultProps, projectList, staleProject } from '../mock';
......@@ -43,7 +43,7 @@ describe('error tracking settings project dropdown', () => {
describe('empty project list', () => {
it('renders the dropdown', () => {
expect(wrapper.find('#project-dropdown').exists()).toBeTruthy();
expect(wrapper.find(GlDropdown).exists()).toBeTruthy();
expect(wrapper.find(GlDeprecatedDropdown).exists()).toBeTruthy();
});
it('shows helper text', () => {
......@@ -58,8 +58,8 @@ describe('error tracking settings project dropdown', () => {
});
it('does not contain any dropdown items', () => {
expect(wrapper.find(GlDropdownItem).exists()).toBeFalsy();
expect(wrapper.find(GlDropdown).props('text')).toBe('No projects available');
expect(wrapper.find(GlDeprecatedDropdownItem).exists()).toBeFalsy();
expect(wrapper.find(GlDeprecatedDropdown).props('text')).toBe('No projects available');
});
});
......@@ -72,12 +72,12 @@ describe('error tracking settings project dropdown', () => {
it('renders the dropdown', () => {
expect(wrapper.find('#project-dropdown').exists()).toBeTruthy();
expect(wrapper.find(GlDropdown).exists()).toBeTruthy();
expect(wrapper.find(GlDeprecatedDropdown).exists()).toBeTruthy();
});
it('contains a number of dropdown items', () => {
expect(wrapper.find(GlDropdownItem).exists()).toBeTruthy();
expect(wrapper.findAll(GlDropdownItem).length).toBe(2);
expect(wrapper.find(GlDeprecatedDropdownItem).exists()).toBeTruthy();
expect(wrapper.findAll(GlDeprecatedDropdownItem).length).toBe(2);
});
});
......
spec/frontend/logs/components/environment_logs_spec.js
View file @ 5ef5f413
import { GlSprintf, GlIcon, GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlSprintf, GlIcon, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import EnvironmentLogs from '~/logs/components/environment_logs.vue';
......@@ -124,7 +124,7 @@ describe('EnvironmentLogs', () => {
expect(wrapper.isVueInstance()).toBe(true);
expect(wrapper.isEmpty()).toBe(false);
expect(findEnvironmentsDropdown().is(GlDropdown)).toBe(true);
expect(findEnvironmentsDropdown().is(GlDeprecatedDropdown)).toBe(true);
expect(findSimpleFilters().exists()).toBe(true);
expect(findLogControlButtons().exists()).toBe(true);
......@@ -167,7 +167,7 @@ describe('EnvironmentLogs', () => {
it('displays a disabled environments dropdown', () => {
expect(findEnvironmentsDropdown().attributes('disabled')).toBe('true');
expect(findEnvironmentsDropdown().findAll(GlDropdownItem).length).toBe(0);
expect(findEnvironmentsDropdown().findAll(GlDeprecatedDropdownItem).length).toBe(0);
});
it('does not update buttons state', () => {
......@@ -244,7 +244,7 @@ describe('EnvironmentLogs', () => {
});
it('populates environments dropdown', () => {
const items = findEnvironmentsDropdown().findAll(GlDropdownItem);
const items = findEnvironmentsDropdown().findAll(GlDeprecatedDropdownItem);
expect(findEnvironmentsDropdown().props('text')).toBe(mockEnvName);
expect(items.length).toBe(mockEnvironments.length);
mockEnvironments.forEach((env, i) => {
......@@ -254,7 +254,7 @@ describe('EnvironmentLogs', () => {
});
it('dropdown has one environment selected', () => {
const items = findEnvironmentsDropdown().findAll(GlDropdownItem);
const items = findEnvironmentsDropdown().findAll(GlDeprecatedDropdownItem);
mockEnvironments.forEach((env, i) => {
const item = items.at(i);
......@@ -289,7 +289,7 @@ describe('EnvironmentLogs', () => {
describe('when user clicks', () => {
it('environment name, trace is refreshed', () => {
const items = findEnvironmentsDropdown().findAll(GlDropdownItem);
const items = findEnvironmentsDropdown().findAll(GlDeprecatedDropdownItem);
const index = 1; // any env
expect(dispatch).not.toHaveBeenCalledWith(`${module}/showEnvironment`, expect.anything());
......
spec/frontend/logs/components/log_simple_filters_spec.js
View file @ 5ef5f413
import { GlIcon, GlDropdownItem } from '@gitlab/ui';
import { GlIcon, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import { createStore } from '~/logs/stores';
import { mockPods, mockPodName } from '../mock_data';
......@@ -17,7 +17,7 @@ describe('LogSimpleFilters', () => {
const findPodsNoPodsText = () => wrapper.find({ ref: 'noPodsMsg' });
const findPodsDropdownItems = () =>
findPodsDropdown()
.findAll(GlDropdownItem)
.findAll(GlDeprecatedDropdownItem)
.filter(item => !item.is('[disabled]'));
const mockPodsLoading = () => {
......
spec/frontend/monitoring/components/__snapshots__/dashboard_template_spec.js.snap
View file @ 5ef5f413
......@@ -33,7 +33,7 @@ exports[`Dashboard template matches the default snapshot 1`] = `
<div
class="mb-2 pr-2 d-flex d-sm-block"
>
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
class="flex-grow-1"
data-qa-selector="environments_dropdown"
id="monitor-environments-dropdown"
......@@ -44,15 +44,15 @@ exports[`Dashboard template matches the default snapshot 1`] = `
<div
class="d-flex flex-column overflow-hidden"
>
<gl-dropdown-header-stub
<gl-deprecated-dropdown-header-stub
class="monitor-environment-dropdown-header text-center"
>
Environment
</gl-dropdown-header-stub>
</gl-deprecated-dropdown-header-stub>
<gl-dropdown-divider-stub />
<gl-deprecated-dropdown-divider-stub />
<gl-search-box-by-type-stub
class="m-2"
......@@ -72,7 +72,7 @@ exports[`Dashboard template matches the default snapshot 1`] = `
</div>
</div>
</gl-dropdown-stub>
</gl-deprecated-dropdown-stub>
</div>
<div
......
spec/frontend/monitoring/components/dashboard_header_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { createStore } from '~/monitoring/stores';
import * as types from '~/monitoring/stores/mutation_types';
import { GlDropdownItem, GlSearchBoxByType, GlLoadingIcon } from '@gitlab/ui';
import { GlDeprecatedDropdownItem, GlSearchBoxByType, GlLoadingIcon } from '@gitlab/ui';
import DashboardHeader from '~/monitoring/components/dashboard_header.vue';
import DuplicateDashboardModal from '~/monitoring/components/duplicate_dashboard_modal.vue';
import CreateDashboardModal from '~/monitoring/components/create_dashboard_modal.vue';
......@@ -27,7 +27,7 @@ describe('Dashboard header', () => {
let wrapper;
const findEnvsDropdown = () => wrapper.find({ ref: 'monitorEnvironmentsDropdown' });
const findEnvsDropdownItems = () => findEnvsDropdown().findAll(GlDropdownItem);
const findEnvsDropdownItems = () => findEnvsDropdown().findAll(GlDeprecatedDropdownItem);
const findEnvsDropdownSearch = () => findEnvsDropdown().find(GlSearchBoxByType);
const findEnvsDropdownSearchMsg = () => wrapper.find({ ref: 'monitorEnvironmentsDropdownMsg' });
const findEnvsDropdownLoadingIcon = () => findEnvsDropdown().find(GlLoadingIcon);
......
spec/frontend/monitoring/components/dashboards_dropdown_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdownItem, GlIcon } from '@gitlab/ui';
import { GlDeprecatedDropdownItem, GlIcon } from '@gitlab/ui';
import DashboardsDropdown from '~/monitoring/components/dashboards_dropdown.vue';
......@@ -38,8 +38,8 @@ describe('DashboardsDropdown', () => {
});
}
const findItems = () => wrapper.findAll(GlDropdownItem);
const findItemAt = i => wrapper.findAll(GlDropdownItem).at(i);
const findItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findItemAt = i => wrapper.findAll(GlDeprecatedDropdownItem).at(i);
const findSearchInput = () => wrapper.find({ ref: 'monitorDashboardsDropdownSearch' });
const findNoItemsMsg = () => wrapper.find({ ref: 'monitorDashboardsDropdownMsg' });
const findStarredListDivider = () => wrapper.find({ ref: 'starredListDivider' });
......
spec/frontend/monitoring/components/variables/dropdown_field_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import DropdownField from '~/monitoring/components/variables/dropdown_field.vue';
describe('Custom variable component', () => {
......@@ -23,8 +23,8 @@ describe('Custom variable component', () => {
});
};
const findDropdown = () => wrapper.find(GlDropdown);
const findDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findDropdownItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
it('renders dropdown element when all necessary props are passed', () => {
createShallowWrapper();
......
spec/frontend/pages/projects/graphs/__snapshots__/code_coverage_spec.js.snap
View file @ 5ef5f413
......@@ -9,10 +9,10 @@ exports[`Code Coverage when fetching data is successful matches the snapshot 1`]
<!---->
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
text="rspec"
>
<gl-dropdown-item-stub
<gl-deprecated-dropdown-item-stub
value="rspec"
>
<div
......@@ -32,8 +32,8 @@ exports[`Code Coverage when fetching data is successful matches the snapshot 1`]
</span>
</div>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub
value="cypress"
>
<div
......@@ -49,8 +49,8 @@ exports[`Code Coverage when fetching data is successful matches the snapshot 1`]
</span>
</div>
</gl-dropdown-item-stub>
<gl-dropdown-item-stub
</gl-deprecated-dropdown-item-stub>
<gl-deprecated-dropdown-item-stub
value="karma"
>
<div
......@@ -66,8 +66,8 @@ exports[`Code Coverage when fetching data is successful matches the snapshot 1`]
</span>
</div>
</gl-dropdown-item-stub>
</gl-dropdown-stub>
</gl-deprecated-dropdown-item-stub>
</gl-deprecated-dropdown-stub>
</div>
<gl-area-chart-stub
......
spec/frontend/pages/projects/graphs/code_coverage_spec.js
View file @ 5ef5f413
import MockAdapter from 'axios-mock-adapter';
import { shallowMount } from '@vue/test-utils';
import { GlAlert, GlIcon, GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlAlert, GlIcon, GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { GlAreaChart } from '@gitlab/ui/dist/charts';
import axios from '~/lib/utils/axios_utils';
......@@ -17,7 +17,7 @@ describe('Code Coverage', () => {
const findAlert = () => wrapper.find(GlAlert);
const findAreaChart = () => wrapper.find(GlAreaChart);
const findAllDropdownItems = () => wrapper.findAll(GlDropdownItem);
const findAllDropdownItems = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findFirstDropdownItem = () => findAllDropdownItems().at(0);
const findSecondDropdownItem = () => findAllDropdownItems().at(1);
......@@ -124,7 +124,7 @@ describe('Code Coverage', () => {
});
it('renders the dropdown with all custom names as options', () => {
expect(wrapper.contains(GlDropdown)).toBeDefined();
expect(wrapper.contains(GlDeprecatedDropdown)).toBeDefined();
expect(findAllDropdownItems()).toHaveLength(codeCoverageMockData.length);
expect(findFirstDropdownItem().text()).toBe(codeCoverageMockData[0].group_name);
});
......
spec/frontend/pages/projects/pipeline_schedules/shared/components/timezone_dropdown_spec.js
View file @ 5ef5f413
import $ from 'jquery';
import GLDropdown from '~/gl_dropdown'; // eslint-disable-line no-unused-vars
import '~/gl_dropdown';
import TimezoneDropdown, {
formatUtcOffset,
formatTimezone,
......
spec/frontend/registry/explorer/components/list_page/cli_commands_spec.js
View file @ 5ef5f413
import Vuex from 'vuex';
import { mount, createLocalVue } from '@vue/test-utils';
import { GlDropdown, GlFormGroup, GlFormInputGroup } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlFormGroup, GlFormInputGroup } from '@gitlab/ui';
import Tracking from '~/tracking';
import * as getters from '~/registry/explorer/stores/getters';
import QuickstartDropdown from '~/registry/explorer/components/list_page/cli_commands.vue';
......@@ -23,7 +23,7 @@ describe('cli_commands', () => {
let wrapper;
let store;
const findDropdownButton = () => wrapper.find(GlDropdown);
const findDropdownButton = () => wrapper.find(GlDeprecatedDropdown);
const findFormGroups = () => wrapper.findAll(GlFormGroup);
const mountComponent = () => {
......
spec/frontend/repository/components/breadcrumbs_spec.js
View file @ 5ef5f413
import { shallowMount, RouterLinkStub } from '@vue/test-utils';
import { GlDropdown } from '@gitlab/ui';
import { GlDeprecatedDropdown } from '@gitlab/ui';
import Breadcrumbs from '~/repository/components/breadcrumbs.vue';
let vm;
......@@ -61,7 +61,7 @@ describe('Repository breadcrumbs component', () => {
vm.setData({ userPermissions: { forkProject: false, createMergeRequestIn: false } });
return vm.vm.$nextTick(() => {
expect(vm.find(GlDropdown).exists()).toBe(false);
expect(vm.find(GlDeprecatedDropdown).exists()).toBe(false);
});
});
......@@ -71,7 +71,7 @@ describe('Repository breadcrumbs component', () => {
vm.setData({ userPermissions: { forkProject: true, createMergeRequestIn: true } });
return vm.vm.$nextTick(() => {
expect(vm.find(GlDropdown).exists()).toBe(true);
expect(vm.find(GlDeprecatedDropdown).exists()).toBe(true);
});
});
});
spec/frontend/vue_mr_widget/components/states/mr_widget_commit_message_dropdown_spec.js
View file @ 5ef5f413
import { shallowMount } from '@vue/test-utils';
import { GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdownItem } from '@gitlab/ui';
import CommitMessageDropdown from '~/vue_merge_request_widget/components/states/commit_message_dropdown.vue';
const commits = [
......@@ -39,7 +39,7 @@ describe('Commits message dropdown component', () => {
wrapper.destroy();
});
const findDropdownElements = () => wrapper.findAll(GlDropdownItem);
const findDropdownElements = () => wrapper.findAll(GlDeprecatedDropdownItem);
const findFirstDropdownElement = () => findDropdownElements().at(0);
it('should have 3 elements in dropdown list', () => {
......
spec/frontend/vue_shared/components/__snapshots__/split_button_spec.js.snap
View file @ 5ef5f413
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`SplitButton renders actionItems 1`] = `
<gl-dropdown-stub
<gl-deprecated-dropdown-stub
menu-class="dropdown-menu-selectable "
split="true"
text="professor"
variant="secondary"
>
<gl-dropdown-item-stub
<gl-deprecated-dropdown-item-stub
active="true"
active-class="is-active"
>
......@@ -18,10 +18,10 @@ exports[`SplitButton renders actionItems 1`] = `
<div>
very symphonic
</div>
</gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<gl-dropdown-divider-stub />
<gl-dropdown-item-stub
<gl-deprecated-dropdown-divider-stub />
<gl-deprecated-dropdown-item-stub
active-class="is-active"
>
<strong>
......@@ -31,8 +31,8 @@ exports[`SplitButton renders actionItems 1`] = `
<div>
warp drive
</div>
</gl-dropdown-item-stub>
</gl-deprecated-dropdown-item-stub>
<!---->
</gl-dropdown-stub>
</gl-deprecated-dropdown-stub>
`;
spec/frontend/vue_shared/components/split_button_spec.js
View file @ 5ef5f413
import { GlDropdown, GlDropdownItem } from '@gitlab/ui';
import { GlDeprecatedDropdown, GlDeprecatedDropdownItem } from '@gitlab/ui';
import { shallowMount } from '@vue/test-utils';
import SplitButton from '~/vue_shared/components/split_button.vue';
......@@ -25,10 +25,10 @@ describe('SplitButton', () => {
});
};
const findDropdown = () => wrapper.find(GlDropdown);
const findDropdown = () => wrapper.find(GlDeprecatedDropdown);
const findDropdownItem = (index = 0) =>
findDropdown()
.findAll(GlDropdownItem)
.findAll(GlDeprecatedDropdownItem)
.at(index);
const selectItem = index => {
findDropdownItem(index).vm.$emit('click');
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7