diff options
Diffstat (limited to 'app/assets/javascripts/sidebar')
15 files changed, 41 insertions, 91 deletions
diff --git a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue index d9c5edc91f1..f98aa0dc77d 100644 --- a/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue +++ b/app/assets/javascripts/sidebar/components/assignees/assignee_title.vue @@ -53,7 +53,7 @@ export default { class="js-sidebar-dropdown-toggle edit-link btn gl-text-gray-900! gl-ml-auto hide-collapsed btn-default btn-sm gl-button btn-default-tertiary float-right" href="#" data-test-id="edit-link" - data-track-event="click_edit_button" + data-track-action="click_edit_button" data-track-label="right_sidebar" data-track-property="assignee" > diff --git a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue index 1dd05d3886e..1b28ba2afd1 100644 --- a/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue +++ b/app/assets/javascripts/sidebar/components/assignees/sidebar_assignees_widget.vue @@ -3,7 +3,6 @@ import { GlDropdownItem } from '@gitlab/ui'; import { cloneDeep } from 'lodash'; import Vue from 'vue'; import createFlash from '~/flash'; -import { getIdFromGraphQLId } from '~/graphql_shared/utils'; import { IssuableType } from '~/issue_show/constants'; import { __, n__ } from '~/locale'; import SidebarAssigneesRealtime from '~/sidebar/components/assignees/assignees_realtime.vue'; @@ -173,7 +172,7 @@ export default { }) .then(({ data }) => { this.$emit('assignees-updated', { - id: getIdFromGraphQLId(data.issuableSetAssignees.issuable.id), + id: data.issuableSetAssignees.issuable.id, assignees: data.issuableSetAssignees.issuable.assignees.nodes, }); return data; diff --git a/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue b/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue index 55179947756..9fdf941579d 100644 --- a/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue +++ b/app/assets/javascripts/sidebar/components/labels/sidebar_labels.vue @@ -144,16 +144,11 @@ export default { v-if="glFeatures.labelsWidget" class="block labels js-labels-block" :allow-label-remove="allowLabelEdit" - :allow-label-create="allowLabelCreate" - :allow-label-edit="allowLabelEdit" :allow-multiselect="true" - :allow-scoped-labels="allowScopedLabels" :footer-create-label-title="__('Create project label')" :footer-manage-label-title="__('Manage project labels')" :labels-create-title="__('Create project label')" - :labels-fetch-path="labelsFetchPath" :labels-filter-base-path="projectIssuesPath" - :labels-manage-path="labelsManagePath" :labels-select-in-progress="isLabelsSelectInProgress" :selected-labels="selectedLabels" :variant="$options.variant" diff --git a/app/assets/javascripts/sidebar/components/lock/issuable_lock_form.vue b/app/assets/javascripts/sidebar/components/lock/issuable_lock_form.vue index 19543d0927a..cb49f329f7e 100644 --- a/app/assets/javascripts/sidebar/components/lock/issuable_lock_form.vue +++ b/app/assets/javascripts/sidebar/components/lock/issuable_lock_form.vue @@ -93,7 +93,7 @@ export default { class="float-right lock-edit btn gl-text-gray-900! gl-ml-auto hide-collapsed btn-default btn-sm gl-button btn-default-tertiary gl-mr-n2" href="#" data-testid="edit-link" - data-track-event="click_edit_button" + data-track-action="click_edit_button" data-track-label="right_sidebar" data-track-property="lock_issue" @click.prevent="toggleForm" diff --git a/app/assets/javascripts/sidebar/components/participants/sidebar_participants_widget.vue b/app/assets/javascripts/sidebar/components/participants/sidebar_participants_widget.vue index 39f72b251c7..a09138a708b 100644 --- a/app/assets/javascripts/sidebar/components/participants/sidebar_participants_widget.vue +++ b/app/assets/javascripts/sidebar/components/participants/sidebar_participants_widget.vue @@ -56,6 +56,11 @@ export default { return this.$apollo.queries.participants.loading; }, }, + methods: { + toggleSidebar() { + this.$emit('toggleSidebar'); + }, + }, }; </script> @@ -66,5 +71,6 @@ export default { :number-of-less-participants="7" :lazy="false" class="block participants" + @toggleSidebar="toggleSidebar" /> </template> diff --git a/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue b/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue index 1243603805a..367dcdb961b 100644 --- a/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue +++ b/app/assets/javascripts/sidebar/components/reviewers/reviewer_title.vue @@ -40,7 +40,7 @@ export default { v-if="editable" class="js-sidebar-dropdown-toggle edit-link btn gl-text-gray-900! gl-ml-auto hide-collapsed btn-default btn-sm gl-button btn-default-tertiary float-right" href="#" - data-track-event="click_edit_button" + data-track-action="click_edit_button" data-track-label="right_sidebar" data-track-property="reviewer" > diff --git a/app/assets/javascripts/sidebar/components/sidebar_dropdown_widget.vue b/app/assets/javascripts/sidebar/components/sidebar_dropdown_widget.vue index 8ccc0102c3d..8f4d5406da8 100644 --- a/app/assets/javascripts/sidebar/components/sidebar_dropdown_widget.vue +++ b/app/assets/javascripts/sidebar/components/sidebar_dropdown_widget.vue @@ -369,6 +369,7 @@ export default { :text="dropdownText" :loading="loading" class="gl-w-full" + toggle-class="gl-max-w-100" @shown="setFocus" > <gl-search-box-by-type ref="search" v-model="searchTerm" /> diff --git a/app/assets/javascripts/sidebar/components/sidebar_editable_item.vue b/app/assets/javascripts/sidebar/components/sidebar_editable_item.vue index 89aa03fd954..22adbd79ef6 100644 --- a/app/assets/javascripts/sidebar/components/sidebar_editable_item.vue +++ b/app/assets/javascripts/sidebar/components/sidebar_editable_item.vue @@ -136,7 +136,7 @@ export default { size="small" class="gl-text-gray-900! gl-ml-auto hide-collapsed gl-mr-n2" data-testid="edit-button" - :data-track-event="tracking.event" + :data-track-action="tracking.event" :data-track-label="tracking.label" :data-track-property="tracking.property" data-qa-selector="edit_link" diff --git a/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue b/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue index 33c6ac6e2ba..db2197ec65e 100644 --- a/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue +++ b/app/assets/javascripts/sidebar/components/time_tracking/spent_only_pane.vue @@ -1,5 +1,4 @@ <script> -/* eslint-disable vue/no-v-html */ import { sprintf, s__ } from '~/locale'; export default { @@ -27,5 +26,5 @@ export default { </script> <template> - <div data-testid="spentOnlyPane" v-html="timeSpent"></div> + <div data-testid="spentOnlyPane" v-html="timeSpent /* eslint-disable-line vue/no-v-html */"></div> </template> diff --git a/app/assets/javascripts/sidebar/mount_sidebar.js b/app/assets/javascripts/sidebar/mount_sidebar.js index 031472a7d20..10ab80f4ec2 100644 --- a/app/assets/javascripts/sidebar/mount_sidebar.js +++ b/app/assets/javascripts/sidebar/mount_sidebar.js @@ -1,7 +1,6 @@ import $ from 'jquery'; import Vue from 'vue'; import VueApollo from 'vue-apollo'; -import createFlash from '~/flash'; import { TYPE_ISSUE, TYPE_MERGE_REQUEST } from '~/graphql_shared/constants'; import { convertToGraphQLId } from '~/graphql_shared/utils'; import initInviteMembersModal from '~/invite_members/init_invite_members_modal'; @@ -13,7 +12,6 @@ import { isInIncidentPage, parseBoolean, } from '~/lib/utils/common_utils'; -import { __ } from '~/locale'; import CollapsedAssigneeList from '~/sidebar/components/assignees/collapsed_assignee_list.vue'; import SidebarAssigneesWidget from '~/sidebar/components/assignees/sidebar_assignees_widget.vue'; import SidebarConfidentialityWidget from '~/sidebar/components/confidential/sidebar_confidentiality_widget.vue'; @@ -258,6 +256,8 @@ export function mountSidebarLabels() { allowScopedLabels: parseBoolean(el.dataset.allowScopedLabels), initiallySelectedLabels: JSON.parse(el.dataset.selectedLabels), variant: DropdownVariant.Sidebar, + canUpdate: parseBoolean(el.dataset.canEdit), + isClassicSidebar: true, }, render: (createElement) => createElement(SidebarLabels), }); @@ -361,10 +361,10 @@ function mountReferenceComponent() { }); } -function mountLockComponent() { +function mountLockComponent(store) { const el = document.getElementById('js-lock-entry-point'); - if (!el) { + if (!el || !store) { return; } @@ -373,37 +373,20 @@ function mountLockComponent() { const dataNode = document.getElementById('js-lock-issue-data'); const initialData = JSON.parse(dataNode.innerHTML); - let importStore; - if (isInIssuePage() || isInIncidentPage()) { - importStore = import(/* webpackChunkName: 'notesStore' */ '~/notes/stores').then( - ({ store }) => store, - ); - } else { - importStore = import(/* webpackChunkName: 'mrNotesStore' */ '~/mr_notes/stores').then( - (store) => store.default, - ); - } - - importStore - .then( - (store) => - new Vue({ - el, - store, - provide: { - fullPath, - }, - render: (createElement) => - createElement(IssuableLockForm, { - props: { - isEditable: initialData.is_editable, - }, - }), - }), - ) - .catch(() => { - createFlash({ message: __('Failed to load sidebar lock status') }); - }); + // eslint-disable-next-line no-new + new Vue({ + el, + store, + provide: { + fullPath, + }, + render: (createElement) => + createElement(IssuableLockForm, { + props: { + isEditable: initialData.is_editable, + }, + }), + }); } function mountParticipantsComponent() { @@ -535,7 +518,7 @@ function mountCopyEmailComponent() { const isAssigneesWidgetShown = (isInIssuePage() || isInDesignPage()) && gon.features.issueAssigneesWidget; -export function mountSidebar(mediator) { +export function mountSidebar(mediator, store) { initInviteMembersModal(); initInviteMembersTrigger(); @@ -546,11 +529,12 @@ export function mountSidebar(mediator) { mountAssigneesComponentDeprecated(mediator); } mountReviewersComponent(mediator); + mountSidebarLabels(); mountMilestoneSelect(); mountConfidentialComponent(mediator); mountDueDateComponent(mediator); mountReferenceComponent(mediator); - mountLockComponent(); + mountLockComponent(store); mountParticipantsComponent(); mountSubscriptionsComponent(); mountCopyEmailComponent(); diff --git a/app/assets/javascripts/sidebar/services/sidebar_service.js b/app/assets/javascripts/sidebar/services/sidebar_service.js index ace2a163adc..cea26acd101 100644 --- a/app/assets/javascripts/sidebar/services/sidebar_service.js +++ b/app/assets/javascripts/sidebar/services/sidebar_service.js @@ -22,7 +22,6 @@ export default class SidebarService { constructor(endpointMap) { if (!SidebarService.singleton) { this.endpoint = endpointMap.endpoint; - this.toggleSubscriptionEndpoint = endpointMap.toggleSubscriptionEndpoint; this.moveIssueEndpoint = endpointMap.moveIssueEndpoint; this.projectsAutocompleteEndpoint = endpointMap.projectsAutocompleteEndpoint; this.fullPath = endpointMap.fullPath; @@ -75,10 +74,6 @@ export default class SidebarService { }); } - toggleSubscription() { - return axios.post(this.toggleSubscriptionEndpoint); - } - moveIssue(moveToProjectId) { return axios.post(this.moveIssueEndpoint, { move_to_project_id: moveToProjectId, diff --git a/app/assets/javascripts/sidebar/sidebar_bundle.js b/app/assets/javascripts/sidebar/sidebar_bundle.js index 063e3313a3c..1be670f7590 100644 --- a/app/assets/javascripts/sidebar/sidebar_bundle.js +++ b/app/assets/javascripts/sidebar/sidebar_bundle.js @@ -1,9 +1,9 @@ -import { mountSidebar, getSidebarOptions } from './mount_sidebar'; +import { mountSidebar, getSidebarOptions } from 'ee_else_ce/sidebar/mount_sidebar'; import Mediator from './sidebar_mediator'; -export default () => { +export default (store) => { const mediator = new Mediator(getSidebarOptions()); mediator.fetch(); - mountSidebar(mediator); + mountSidebar(mediator, store); }; diff --git a/app/assets/javascripts/sidebar/sidebar_mediator.js b/app/assets/javascripts/sidebar/sidebar_mediator.js index 0a5e44a9b95..9144e3b08db 100644 --- a/app/assets/javascripts/sidebar/sidebar_mediator.js +++ b/app/assets/javascripts/sidebar/sidebar_mediator.js @@ -17,7 +17,6 @@ export default class SidebarMediator { this.store = new Store(options); this.service = new Service({ endpoint: options.endpoint, - toggleSubscriptionEndpoint: options.toggleSubscriptionEndpoint, moveIssueEndpoint: options.moveIssueEndpoint, projectsAutocompleteEndpoint: options.projectsAutocompleteEndpoint, fullPath: options.fullPath, @@ -85,22 +84,6 @@ export default class SidebarMediator { this.store.setAssigneeData(data); this.store.setReviewerData(data); this.store.setTimeTrackingData(data); - this.store.setParticipantsData(data); - this.store.setSubscriptionsData(data); - } - - toggleSubscription() { - this.store.setFetchingState('subscriptions', true); - return this.service - .toggleSubscription() - .then(() => { - this.store.setSubscribedState(!this.store.subscribed); - this.store.setFetchingState('subscriptions', false); - }) - .catch((err) => { - this.store.setFetchingState('subscriptions', false); - throw err; - }); } fetchAutocompleteProjects(searchTerm) { diff --git a/app/assets/javascripts/sidebar/stores/sidebar_store.js b/app/assets/javascripts/sidebar/stores/sidebar_store.js index 3c108b06eab..94c54fc0980 100644 --- a/app/assets/javascripts/sidebar/stores/sidebar_store.js +++ b/app/assets/javascripts/sidebar/stores/sidebar_store.js @@ -22,8 +22,6 @@ export default class SidebarStore { this.isFetching = { assignees: true, reviewers: true, - participants: true, - subscriptions: true, }; this.isLoading = {}; this.autocompleteProjects = []; @@ -63,18 +61,6 @@ export default class SidebarStore { this.humanTotalTimeSpent = data.human_total_time_spent; } - setParticipantsData(data) { - this.isFetching.participants = false; - this.participants = data.participants || []; - } - - setSubscriptionsData(data) { - this.projectEmailsDisabled = data.project_emails_disabled || false; - this.subscribeDisabledDescription = data.subscribe_disabled_description; - this.isFetching.subscriptions = false; - this.subscribed = data.subscribed || false; - } - setFetchingState(key, value) { this.isFetching[key] = value; } diff --git a/app/assets/javascripts/sidebar/track_invite_members.js b/app/assets/javascripts/sidebar/track_invite_members.js index eab15578f0f..45a3366197b 100644 --- a/app/assets/javascripts/sidebar/track_invite_members.js +++ b/app/assets/javascripts/sidebar/track_invite_members.js @@ -2,10 +2,12 @@ import $ from 'jquery'; import Tracking from '~/tracking'; export default function initTrackInviteMembers(userDropdown) { - const { trackEvent, trackLabel } = userDropdown.querySelector('.js-invite-members-track').dataset; + const { trackAction, trackLabel } = userDropdown.querySelector( + '.js-invite-members-track', + ).dataset; $(userDropdown).on('shown.bs.dropdown', () => { - Tracking.event(undefined, trackEvent, { + Tracking.event(undefined, trackAction, { label: trackLabel, }); }); |