Replace tooltip directive with gl-tooltip directive in badges, cycle analytics, and diffs
This commit is contained in:
parent
62e0877d5a
commit
02e7497166
|
@ -1,17 +1,16 @@
|
||||||
<script>
|
<script>
|
||||||
import Icon from '~/vue_shared/components/icon.vue';
|
import Icon from '~/vue_shared/components/icon.vue';
|
||||||
import Tooltip from '~/vue_shared/directives/tooltip';
|
import Tooltip from '~/vue_shared/directives/tooltip';
|
||||||
import { GlLoadingIcon } from '@gitlab/ui';
|
import { GlLoadingIcon, GlTooltipDirective } from '@gitlab-org/gitlab-ui';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Badge',
|
name: 'Badge',
|
||||||
components: {
|
components: {
|
||||||
Icon,
|
Icon,
|
||||||
Tooltip,
|
|
||||||
GlLoadingIcon,
|
GlLoadingIcon,
|
||||||
},
|
},
|
||||||
directives: {
|
directives: {
|
||||||
Tooltip,
|
GlTooltip: GlTooltipDirective,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
imageUrl: {
|
imageUrl: {
|
||||||
|
@ -93,7 +92,7 @@ export default {
|
||||||
|
|
||||||
<button
|
<button
|
||||||
v-show="hasError"
|
v-show="hasError"
|
||||||
v-tooltip
|
v-gl-tooltip
|
||||||
:title="s__('Badges|Reload badge image')"
|
:title="s__('Badges|Reload badge image')"
|
||||||
class="btn btn-transparent btn-sm text-primary"
|
class="btn btn-transparent btn-sm text-primary"
|
||||||
type="button"
|
type="button"
|
||||||
|
|
|
@ -1,9 +1,9 @@
|
||||||
<script>
|
<script>
|
||||||
import tooltip from '../../vue_shared/directives/tooltip';
|
import { GlTooltipDirective } from '@gitlab-org/gitlab-ui';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
directives: {
|
directives: {
|
||||||
tooltip,
|
GlTooltip: GlTooltipDirective,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
count: {
|
count: {
|
||||||
|
@ -16,13 +16,12 @@ export default {
|
||||||
<template>
|
<template>
|
||||||
<span v-if="count === 50" class="events-info float-right">
|
<span v-if="count === 50" class="events-info float-right">
|
||||||
<i
|
<i
|
||||||
v-tooltip
|
v-gl-tooltip.top
|
||||||
:title="
|
:title="
|
||||||
n__('Limited to showing %d event at most', 'Limited to showing %d events at most', 50)
|
n__('Limited to showing %d event at most', 'Limited to showing %d events at most', 50)
|
||||||
"
|
"
|
||||||
class="fa fa-warning"
|
class="fa fa-warning"
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
data-placement="top"
|
|
||||||
>
|
>
|
||||||
</i>
|
</i>
|
||||||
{{ n__('Showing %d event', 'Showing %d events', 50) }}
|
{{ n__('Showing %d event', 'Showing %d events', 50) }}
|
||||||
|
|
|
@ -1,5 +1,4 @@
|
||||||
<script>
|
<script>
|
||||||
import tooltip from '~/vue_shared/directives/tooltip';
|
|
||||||
import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';
|
import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link.vue';
|
||||||
import Icon from '~/vue_shared/components/icon.vue';
|
import Icon from '~/vue_shared/components/icon.vue';
|
||||||
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
|
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
|
||||||
|
@ -21,9 +20,6 @@ import CommitPipelineStatus from '~/projects/tree/components/commit_pipeline_sta
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
export default {
|
export default {
|
||||||
directives: {
|
|
||||||
tooltip,
|
|
||||||
},
|
|
||||||
components: {
|
components: {
|
||||||
UserAvatarLink,
|
UserAvatarLink,
|
||||||
Icon,
|
Icon,
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
<script>
|
<script>
|
||||||
import { mapActions, mapGetters, mapState } from 'vuex';
|
import { mapActions, mapGetters, mapState } from 'vuex';
|
||||||
import Tooltip from '@gitlab/ui/dist/directives/tooltip';
|
import { GlTooltipDirective } from '@gitlab-org/gitlab-ui';
|
||||||
import { __ } from '~/locale';
|
import { __ } from '~/locale';
|
||||||
import { getParameterValues, mergeUrlParams } from '~/lib/utils/url_utility';
|
import { getParameterValues, mergeUrlParams } from '~/lib/utils/url_utility';
|
||||||
import Icon from '~/vue_shared/components/icon.vue';
|
import Icon from '~/vue_shared/components/icon.vue';
|
||||||
|
@ -12,7 +12,7 @@ export default {
|
||||||
Icon,
|
Icon,
|
||||||
},
|
},
|
||||||
directives: {
|
directives: {
|
||||||
Tooltip,
|
GlTooltip: GlTooltipDirective,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
mergeRequestDiffs: {
|
mergeRequestDiffs: {
|
||||||
|
@ -75,7 +75,7 @@ export default {
|
||||||
<div class="mr-version-controls">
|
<div class="mr-version-controls">
|
||||||
<div class="mr-version-menus-container content-block">
|
<div class="mr-version-menus-container content-block">
|
||||||
<button
|
<button
|
||||||
v-tooltip.hover
|
v-gl-tooltip.hover
|
||||||
type="button"
|
type="button"
|
||||||
class="btn btn-default append-right-8 js-toggle-tree-list"
|
class="btn btn-default append-right-8 js-toggle-tree-list"
|
||||||
:class="{
|
:class="{
|
||||||
|
|
|
@ -4,7 +4,7 @@ import { mapActions, mapGetters } from 'vuex';
|
||||||
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
|
import ClipboardButton from '~/vue_shared/components/clipboard_button.vue';
|
||||||
import Icon from '~/vue_shared/components/icon.vue';
|
import Icon from '~/vue_shared/components/icon.vue';
|
||||||
import FileIcon from '~/vue_shared/components/file_icon.vue';
|
import FileIcon from '~/vue_shared/components/file_icon.vue';
|
||||||
import Tooltip from '~/vue_shared/directives/tooltip';
|
import { GlTooltipDirective } from '@gitlab-org/gitlab-ui';
|
||||||
import { truncateSha } from '~/lib/utils/text_utility';
|
import { truncateSha } from '~/lib/utils/text_utility';
|
||||||
import { __, s__, sprintf } from '~/locale';
|
import { __, s__, sprintf } from '~/locale';
|
||||||
import EditButton from './edit_button.vue';
|
import EditButton from './edit_button.vue';
|
||||||
|
@ -17,7 +17,7 @@ export default {
|
||||||
FileIcon,
|
FileIcon,
|
||||||
},
|
},
|
||||||
directives: {
|
directives: {
|
||||||
Tooltip,
|
GlTooltip: GlTooltipDirective,
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
discussionPath: {
|
discussionPath: {
|
||||||
|
@ -161,23 +161,22 @@ export default {
|
||||||
/>
|
/>
|
||||||
<span v-if="diffFile.renamed_file">
|
<span v-if="diffFile.renamed_file">
|
||||||
<strong
|
<strong
|
||||||
v-tooltip
|
v-gl-tooltip
|
||||||
:title="diffFile.old_path"
|
:title="diffFile.old_path"
|
||||||
class="file-title-name"
|
class="file-title-name"
|
||||||
data-container="body"
|
|
||||||
v-html="diffFile.old_path_html"
|
v-html="diffFile.old_path_html"
|
||||||
></strong>
|
></strong>
|
||||||
→
|
→
|
||||||
<strong
|
<strong
|
||||||
v-tooltip
|
v-gl-tooltip
|
||||||
:title="diffFile.new_path"
|
:title="diffFile.new_path"
|
||||||
class="file-title-name"
|
class="file-title-name"
|
||||||
data-container="body"
|
|
||||||
v-html="diffFile.new_path_html"
|
v-html="diffFile.new_path_html"
|
||||||
></strong>
|
></strong>
|
||||||
</span>
|
</span>
|
||||||
|
|
||||||
<strong v-else v-tooltip :title="filePath" class="file-title-name" data-container="body">
|
<strong v-else v-gl-tooltip :title="filePath" class="file-title-name" data-container="body">
|
||||||
{{ filePath }}
|
{{ filePath }}
|
||||||
</strong>
|
</strong>
|
||||||
</a>
|
</a>
|
||||||
|
@ -233,7 +232,7 @@ export default {
|
||||||
|
|
||||||
<a
|
<a
|
||||||
v-if="diffFile.external_url"
|
v-if="diffFile.external_url"
|
||||||
v-tooltip
|
v-gl-tooltip
|
||||||
:href="diffFile.external_url"
|
:href="diffFile.external_url"
|
||||||
:title="`View on ${diffFile.formatted_external_url}`"
|
:title="`View on ${diffFile.formatted_external_url}`"
|
||||||
target="_blank"
|
target="_blank"
|
||||||
|
|
|
@ -1,5 +1,5 @@
|
||||||
<script>
|
<script>
|
||||||
import tooltip from '../directives/tooltip';
|
import { GlTooltipDirective } from '@gitlab-org/gitlab-ui';
|
||||||
import timeagoMixin from '../mixins/timeago';
|
import timeagoMixin from '../mixins/timeago';
|
||||||
import '../../lib/utils/datetime_utility';
|
import '../../lib/utils/datetime_utility';
|
||||||
|
|
||||||
|
@ -9,7 +9,7 @@ import '../../lib/utils/datetime_utility';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
directives: {
|
directives: {
|
||||||
tooltip,
|
GlTooltip: GlTooltipDirective,
|
||||||
},
|
},
|
||||||
mixins: [timeagoMixin],
|
mixins: [timeagoMixin],
|
||||||
props: {
|
props: {
|
||||||
|
@ -34,11 +34,10 @@ export default {
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<time
|
<time
|
||||||
v-tooltip
|
v-gl-tooltip="{ placement: tooltipPlacement }"
|
||||||
:class="cssClass"
|
:class="cssClass"
|
||||||
:title="tooltipTitle(time)"
|
:title="tooltipTitle(time)"
|
||||||
:data-placement="tooltipPlacement"
|
:data-placement="tooltipPlacement"
|
||||||
data-container="body"
|
|
||||||
v-text="timeFormated(time)"
|
v-text="timeFormated(time)"
|
||||||
>
|
>
|
||||||
</time>
|
</time>
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
---
|
||||||
|
title: Replace tooltip directive with gl-tooltip diretive in badges, cycle analytics, and diffs
|
||||||
|
merge_request: 22770
|
||||||
|
author: George Tsiolis
|
||||||
|
type: performance
|
Loading…
Reference in New Issue