diff options
Diffstat (limited to 'app/assets/javascripts/error_tracking/components')
4 files changed, 62 insertions, 63 deletions
diff --git a/app/assets/javascripts/error_tracking/components/error_details.vue b/app/assets/javascripts/error_tracking/components/error_details.vue index 52444d2c493..3d1fdc4f168 100644 --- a/app/assets/javascripts/error_tracking/components/error_details.vue +++ b/app/assets/javascripts/error_tracking/components/error_details.vue @@ -1,6 +1,5 @@ <script> import { mapActions, mapGetters, mapState } from 'vuex'; -import createFlash from '~/flash'; import { GlButton, GlFormInput, @@ -9,10 +8,11 @@ import { GlBadge, GlAlert, GlSprintf, - GlDropdown, - GlDropdownItem, - GlDropdownDivider, + GlDeprecatedDropdown, + GlDeprecatedDropdownItem, + GlDeprecatedDropdownDivider, } from '@gitlab/ui'; +import { deprecatedCreateFlash as createFlash } from '~/flash'; import { __, sprintf, n__ } from '~/locale'; import Icon from '~/vue_shared/components/icon.vue'; import TooltipOnTruncate from '~/vue_shared/components/tooltip_on_truncate.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> diff --git a/app/assets/javascripts/error_tracking/components/error_tracking_actions.vue b/app/assets/javascripts/error_tracking/components/error_tracking_actions.vue index 0e3fd70b17b..db61957d452 100644 --- a/app/assets/javascripts/error_tracking/components/error_tracking_actions.vue +++ b/app/assets/javascripts/error_tracking/components/error_tracking_actions.vue @@ -1,5 +1,5 @@ <script> -import { GlDeprecatedButton, GlIcon, GlButtonGroup, GlTooltipDirective } from '@gitlab/ui'; +import { GlButton, GlIcon, GlButtonGroup, GlTooltipDirective } from '@gitlab/ui'; import { __ } from '~/locale'; const IGNORED = 'ignored'; @@ -10,7 +10,7 @@ const statusValidation = [IGNORED, RESOLVED, UNRESOLVED]; export default { components: { - GlDeprecatedButton, + GlButton, GlIcon, GlButtonGroup, }, @@ -44,37 +44,37 @@ export default { <template> <div> - <gl-button-group class="flex-column flex-md-row ml-0 ml-md-n4"> - <gl-deprecated-button + <gl-button-group class="gl-flex-direction-column flex-md-row gl-ml-0 ml-md-n4"> + <gl-button :key="ignoreBtn.status" :ref="`${ignoreBtn.title.toLowerCase()}Error`" v-gl-tooltip.hover - class="d-block mb-2 mb-md-0 w-100" + class="gl-display-block gl-mb-4 mb-md-0 gl-w-full" :title="ignoreBtn.title" @click="$emit('update-issue-status', { errorId: error.id, status: ignoreBtn.status })" > - <gl-icon class="d-none d-md-inline m-0" :name="ignoreBtn.icon" :size="12" /> + <gl-icon class="gl-display-none d-md-inline gl-m-0" :name="ignoreBtn.icon" :size="12" /> <span class="d-md-none">{{ ignoreBtn.title }}</span> - </gl-deprecated-button> - <gl-deprecated-button + </gl-button> + <gl-button :key="resolveBtn.status" :ref="`${resolveBtn.title.toLowerCase()}Error`" v-gl-tooltip.hover - class="d-block mb-2 mb-md-0 w-100" + class="gl-display-block gl-mb-4 mb-md-0 gl-w-full" :title="resolveBtn.title" @click="$emit('update-issue-status', { errorId: error.id, status: resolveBtn.status })" > - <gl-icon class="d-none d-md-inline m-0" :name="resolveBtn.icon" :size="12" /> + <gl-icon class="gl-display-none d-md-inline gl-m-0" :name="resolveBtn.icon" :size="12" /> <span class="d-md-none">{{ resolveBtn.title }}</span> - </gl-deprecated-button> + </gl-button> </gl-button-group> - <gl-deprecated-button + <gl-button :href="detailsLink" - category="secondary" + category="primary" variant="info" - class="d-block d-md-none mb-2 mb-md-0" + class="gl-display-block d-md-none gl-mb-4 mb-md-0" > {{ __('More details') }} - </gl-deprecated-button> + </gl-button> </div> </template> diff --git a/app/assets/javascripts/error_tracking/components/error_tracking_list.vue b/app/assets/javascripts/error_tracking/components/error_tracking_list.vue index 62a73e21096..da41dc4c9d9 100644 --- a/app/assets/javascripts/error_tracking/components/error_tracking_list.vue +++ b/app/assets/javascripts/error_tracking/components/error_tracking_list.vue @@ -2,22 +2,22 @@ import { mapActions, mapState } from 'vuex'; import { GlEmptyState, - GlDeprecatedButton, + GlButton, GlIcon, GlLink, GlLoadingIcon, GlTable, GlFormInput, - GlDropdown, - GlDropdownItem, - GlDropdownDivider, + GlDeprecatedDropdown, + GlDeprecatedDropdownItem, + GlDeprecatedDropdownDivider, GlTooltipDirective, GlPagination, } from '@gitlab/ui'; +import { isEmpty } from 'lodash'; import AccessorUtils from '~/lib/utils/accessor'; import TimeAgo from '~/vue_shared/components/time_ago_tooltip.vue'; import { __ } from '~/locale'; -import { isEmpty } from 'lodash'; import ErrorTrackingActions from './error_tracking_actions.vue'; import Tracking from '~/tracking'; import { trackErrorListViewsOptions, trackErrorStatusUpdateOptions } from '../utils'; @@ -71,10 +71,10 @@ export default { }, components: { GlEmptyState, - GlDeprecatedButton, - GlDropdown, - GlDropdownItem, - GlDropdownDivider, + GlButton, + 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" @@ -267,27 +267,26 @@ export default { /> </div> <div class="gl-search-box-by-type-right-icons"> - <gl-deprecated-button + <gl-button v-if="errorSearchQuery.length > 0" v-gl-tooltip.hover :title="__('Clear')" class="clear-search text-secondary" name="clear" + icon="close" @click="errorSearchQuery = ''" - > - <gl-icon name="close" :size="12" /> - </gl-deprecated-button> + /> </div> </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)" @@ -300,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)" @@ -322,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"> diff --git a/app/assets/javascripts/error_tracking/components/stacktrace_entry.vue b/app/assets/javascripts/error_tracking/components/stacktrace_entry.vue index c22f34b5a8d..c6825d7af45 100644 --- a/app/assets/javascripts/error_tracking/components/stacktrace_entry.vue +++ b/app/assets/javascripts/error_tracking/components/stacktrace_entry.vue @@ -99,7 +99,7 @@ export default { <gl-sprintf v-if="errorFn" :message="__('%{spanStart}in%{spanEnd} %{errorFn}')"> <template #span="{content}"> - <span class="gl-text-gray-400">{{ content }} </span> + <span class="gl-text-gray-200">{{ content }} </span> </template> <template #errorFn> <strong>{{ errorFn }} </strong> @@ -108,7 +108,7 @@ export default { <gl-sprintf :message="__('%{spanStart}at line%{spanEnd} %{errorLine}%{errorColumn}')"> <template #span="{content}"> - <span class="gl-text-gray-400">{{ content }} </span> + <span class="gl-text-gray-200">{{ content }} </span> </template> <template #errorLine> <strong>{{ errorLine }}</strong> |