diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-19 04:45:44 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-09-19 04:45:44 +0300 |
commit | 85dc423f7090da0a52c73eb66faf22ddb20efff9 (patch) | |
tree | 9160f299afd8c80c038f08e1545be119f5e3f1e1 /app/assets/javascripts/groups/components | |
parent | 15c2c8c66dbe422588e5411eee7e68f1fa440bb8 (diff) |
Add latest changes from gitlab-org/gitlab@13-4-stable-ee
Diffstat (limited to 'app/assets/javascripts/groups/components')
7 files changed, 91 insertions, 13 deletions
diff --git a/app/assets/javascripts/groups/components/app.vue b/app/assets/javascripts/groups/components/app.vue index 0b401f4d732..871f5c9a845 100644 --- a/app/assets/javascripts/groups/components/app.vue +++ b/app/assets/javascripts/groups/components/app.vue @@ -2,6 +2,7 @@ /* global Flash */ import $ from 'jquery'; +import 'vendor/jquery.scrollTo'; import { GlLoadingIcon } from '@gitlab/ui'; import { s__, sprintf } from '~/locale'; import DeprecatedModal from '~/vue_shared/components/deprecated_modal.vue'; diff --git a/app/assets/javascripts/groups/components/group_item.vue b/app/assets/javascripts/groups/components/group_item.vue index be90ba12678..44349b33386 100644 --- a/app/assets/javascripts/groups/components/group_item.vue +++ b/app/assets/javascripts/groups/components/group_item.vue @@ -1,4 +1,5 @@ <script> +/* eslint-disable vue/no-v-html */ import { GlLoadingIcon, GlBadge } from '@gitlab/ui'; import { visitUrl } from '../../lib/utils/url_utility'; import tooltip from '../../vue_shared/directives/tooltip'; diff --git a/app/assets/javascripts/groups/components/invite_members_banner.vue b/app/assets/javascripts/groups/components/invite_members_banner.vue new file mode 100644 index 00000000000..da7adab1d86 --- /dev/null +++ b/app/assets/javascripts/groups/components/invite_members_banner.vue @@ -0,0 +1,76 @@ +<script> +import { GlBanner } from '@gitlab/ui'; +import { s__ } from '~/locale'; +import { parseBoolean, setCookie, getCookie } from '~/lib/utils/common_utils'; +import Tracking from '~/tracking'; + +const trackingMixin = Tracking.mixin(); + +export default { + components: { + GlBanner, + }, + mixins: [trackingMixin], + inject: ['svgPath', 'inviteMembersPath', 'isDismissedKey', 'trackLabel'], + data() { + return { + isDismissed: parseBoolean(getCookie(this.isDismissedKey)), + tracking: { + label: this.trackLabel, + }, + }; + }, + created() { + this.$nextTick(() => { + this.addTrackingAttributesToButton(); + }); + }, + mounted() { + this.trackOnShow(); + }, + methods: { + handleClose() { + setCookie(this.isDismissedKey, true); + this.isDismissed = true; + this.track(this.$options.dismissEvent); + }, + trackOnShow() { + if (!this.isDismissed) this.track(this.$options.displayEvent); + }, + addTrackingAttributesToButton() { + if (this.$refs.banner === undefined) return; + + const button = this.$refs.banner.$el.querySelector(`[href='${this.inviteMembersPath}']`); + + if (button) { + button.setAttribute('data-track-event', this.$options.buttonClickEvent); + button.setAttribute('data-track-label', this.trackLabel); + } + }, + }, + i18n: { + title: s__('InviteMembersBanner|Collaborate with your team'), + body: s__( + "InviteMembersBanner|We noticed that you haven't invited anyone to this group. Invite your colleagues so you can discuss issues, collaborate on merge requests, and share your knowledge.", + ), + button_text: s__('InviteMembersBanner|Invite your colleagues'), + }, + displayEvent: 'invite_members_banner_displayed', + buttonClickEvent: 'invite_members_banner_button_clicked', + dismissEvent: 'invite_members_banner_dismissed', +}; +</script> + +<template> + <gl-banner + v-if="!isDismissed" + ref="banner" + :title="$options.i18n.title" + :button-text="$options.i18n.button_text" + :svg-path="svgPath" + :button-link="inviteMembersPath" + @close="handleClose" + > + <p>{{ $options.i18n.body }}</p> + </gl-banner> +</template> diff --git a/app/assets/javascripts/groups/components/item_actions.vue b/app/assets/javascripts/groups/components/item_actions.vue index ac4c12dda24..5487e25066e 100644 --- a/app/assets/javascripts/groups/components/item_actions.vue +++ b/app/assets/javascripts/groups/components/item_actions.vue @@ -1,12 +1,12 @@ <script> +import { GlIcon } from '@gitlab/ui'; import tooltip from '~/vue_shared/directives/tooltip'; -import icon from '~/vue_shared/components/icon.vue'; import eventHub from '../event_hub'; import { COMMON_STR } from '../constants'; export default { components: { - icon, + GlIcon, }, directives: { tooltip, @@ -56,7 +56,7 @@ export default { class="leave-group btn btn-xs no-expand gl-text-gray-500 gl-ml-5" @click.prevent="onLeaveGroup" > - <icon name="leave" class="position-top-0" /> + <gl-icon name="leave" class="position-top-0" /> </a> <a v-if="group.canEdit" @@ -68,7 +68,7 @@ export default { data-placement="bottom" class="edit-group btn btn-xs no-expand gl-text-gray-500 gl-ml-5" > - <icon name="settings" class="position-top-0 align-middle" /> + <gl-icon name="settings" class="position-top-0 align-middle" /> </a> </div> </template> diff --git a/app/assets/javascripts/groups/components/item_caret.vue b/app/assets/javascripts/groups/components/item_caret.vue index cd3e3de4cb4..e23b0fa7413 100644 --- a/app/assets/javascripts/groups/components/item_caret.vue +++ b/app/assets/javascripts/groups/components/item_caret.vue @@ -1,9 +1,9 @@ <script> -import icon from '~/vue_shared/components/icon.vue'; +import { GlIcon } from '@gitlab/ui'; export default { components: { - icon, + GlIcon, }, props: { isGroupOpen: { @@ -21,5 +21,5 @@ export default { </script> <template> - <span class="folder-caret gl-mr-2"> <icon :size="10" :name="iconClass" /> </span> + <span class="folder-caret gl-mr-2"> <gl-icon :size="10" :name="iconClass" /> </span> </template> diff --git a/app/assets/javascripts/groups/components/item_stats_value.vue b/app/assets/javascripts/groups/components/item_stats_value.vue index 27b1c632643..18efd8c6823 100644 --- a/app/assets/javascripts/groups/components/item_stats_value.vue +++ b/app/assets/javascripts/groups/components/item_stats_value.vue @@ -1,10 +1,10 @@ <script> +import { GlIcon } from '@gitlab/ui'; import tooltip from '~/vue_shared/directives/tooltip'; -import icon from '~/vue_shared/components/icon.vue'; export default { components: { - icon, + GlIcon, }, directives: { tooltip, @@ -57,6 +57,6 @@ export default { :title="title" data-container="body" > - <icon :name="iconName" /> <span v-if="isValuePresent" class="stat-value"> {{ value }} </span> + <gl-icon :name="iconName" /> <span v-if="isValuePresent" class="stat-value"> {{ value }} </span> </span> </template> diff --git a/app/assets/javascripts/groups/components/item_type_icon.vue b/app/assets/javascripts/groups/components/item_type_icon.vue index ae69fbd7bde..c3787c2df21 100644 --- a/app/assets/javascripts/groups/components/item_type_icon.vue +++ b/app/assets/javascripts/groups/components/item_type_icon.vue @@ -1,10 +1,10 @@ <script> -import icon from '~/vue_shared/components/icon.vue'; +import { GlIcon } from '@gitlab/ui'; import { ITEM_TYPE } from '../constants'; export default { components: { - icon, + GlIcon, }, props: { itemType: { @@ -29,5 +29,5 @@ export default { </script> <template> - <span class="item-type-icon"> <icon :name="iconClass" /> </span> + <span class="item-type-icon"> <gl-icon :name="iconClass" /> </span> </template> |