diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-04-11 21:08:31 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-04-11 21:08:31 +0300 |
commit | 1a2f754734eb189e371e25e685413808f69a7f2c (patch) | |
tree | 2c97884971f36d9026600897b74364d2e212a109 /app/assets/javascripts/sidebar | |
parent | f1ce71c88c407709987dd4a7b40bdb7596b6baa2 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/sidebar')
4 files changed, 60 insertions, 40 deletions
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 1eff4db3970..06876546fa4 100644 --- a/app/assets/javascripts/sidebar/components/lock/issuable_lock_form.vue +++ b/app/assets/javascripts/sidebar/components/lock/issuable_lock_form.vue @@ -1,8 +1,9 @@ <script> import { GlIcon, GlTooltipDirective, GlOutsideDirective as Outside } from '@gitlab/ui'; import { mapGetters, mapActions } from 'vuex'; -import { TYPE_ISSUE, TYPE_MERGE_REQUEST } from '~/issues/constants'; +import { TYPE_ISSUE } from '~/issues/constants'; import { __, sprintf } from '~/locale'; +import { capitalizeFirstCharacter } from '~/lib/utils/text_utility'; import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import { createAlert } from '~/alert'; import toast from '~/vue_shared/plugins/global_toast'; @@ -45,10 +46,8 @@ export default { }, computed: { ...mapGetters(['getNoteableData']), - isMergeRequest() { - return ( - this.getNoteableData.targetType === TYPE_MERGE_REQUEST && this.glFeatures.movedMrSidebar - ); + isMovedMrSidebar() { + return this.glFeatures.movedMrSidebar; }, issuableDisplayName() { const isInIssuePage = this.getNoteableData.targetType === TYPE_ISSUE; @@ -60,7 +59,6 @@ export default { lockStatus() { return this.isLocked ? this.$options.locked : this.$options.unlocked; }, - tooltipLabel() { return this.isLocked ? __('Locked') : __('Unlocked'); }, @@ -89,8 +87,13 @@ export default { fullPath: this.fullPath, }) .then(() => { - if (this.isMergeRequest) { - toast(this.isLocked ? __('Merge request locked.') : __('Merge request unlocked.')); + if (this.isMovedMrSidebar) { + toast( + sprintf(__('%{issuableDisplayName} %{lockStatus}.'), { + issuableDisplayName: capitalizeFirstCharacter(this.issuableDisplayName), + lockStatus: this.isLocked ? __('locked') : __('unlocked'), + }), + ); } }) .catch(() => { @@ -113,14 +116,14 @@ export default { </script> <template> - <li v-if="isMergeRequest" class="gl-dropdown-item"> - <button type="button" class="dropdown-item" @click="toggleLocked"> + <li v-if="isMovedMrSidebar" class="gl-dropdown-item"> + <button type="button" class="dropdown-item" data-testid="issuable-lock" @click="toggleLocked"> <span class="gl-dropdown-item-text-wrapper"> <template v-if="isLocked"> - {{ __('Unlock merge request') }} + {{ sprintf(__('Unlock %{issuableType}'), { issuableType: issuableDisplayName }) }} </template> <template v-else> - {{ __('Lock merge request') }} + {{ sprintf(__('Lock %{issuableType}'), { issuableType: issuableDisplayName }) }} </template> </span> </button> diff --git a/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue b/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue index a3710d9534e..23570a374f0 100644 --- a/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue +++ b/app/assets/javascripts/sidebar/components/reviewers/uncollapsed_reviewer_list.vue @@ -58,6 +58,9 @@ export default { approvedByTooltipTitle(user) { return sprintf(s__('MergeRequest|Approved by @%{username}'), user); }, + reviewedButNotApprovedTooltip(user) { + return sprintf(s__('MergeRequest|Reviewed by @%{username} but not yet approved'), user); + }, toggleShowLess() { this.showLess = !this.showLess; }, @@ -105,35 +108,37 @@ export default { {{ user.name }} </div> </reviewer-avatar-link> - <gl-icon - v-if="user.mergeRequestInteraction.approved" - v-gl-tooltip.left - :size="16" - :title="approvedByTooltipTitle(user)" - name="status-success" - class="float-right gl-my-2 gl-ml-auto gl-text-green-500 gl-flex-shrink-0" - data-testid="re-approved" - /> - <gl-icon - v-if="loadingStates[user.id] === $options.SUCCESS_STATE" - :size="24" - name="check" - class="float-right gl-py-2 gl-mr-2 gl-text-green-500" - data-testid="re-request-success" - /> <gl-button - v-else-if="user.mergeRequestInteraction.canUpdate && user.mergeRequestInteraction.reviewed" + v-if="user.mergeRequestInteraction.canUpdate && user.mergeRequestInteraction.reviewed" v-gl-tooltip.left :title="$options.i18n.reRequestReview" :aria-label="$options.i18n.reRequestReview" :loading="loadingStates[user.id] === $options.LOADING_STATE" - class="float-right gl-text-gray-500!" + class="float-right gl-text-gray-500! gl-mr-2" size="small" icon="redo" variant="link" data-testid="re-request-button" @click="reRequestReview(user.id)" /> + <gl-icon + v-if="user.mergeRequestInteraction.approved" + v-gl-tooltip.left + :size="16" + :title="approvedByTooltipTitle(user)" + name="status-success" + class="float-right gl-my-2 gl-ml-auto gl-text-green-500 gl-flex-shrink-0" + data-testid="approved" + /> + <gl-icon + v-else-if="user.mergeRequestInteraction.reviewed" + v-gl-tooltip.left + :size="16" + :title="reviewedButNotApprovedTooltip(user)" + name="dotted-circle" + class="float-right gl-my-2 gl-ml-auto gl-text-gray-400 gl-flex-shrink-0" + data-testid="reviewed-not-approved" + /> </div> </div> </template> diff --git a/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue b/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue index 344fa880131..f2b960ed02c 100644 --- a/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue +++ b/app/assets/javascripts/sidebar/components/subscriptions/sidebar_subscriptions_widget.vue @@ -1,12 +1,7 @@ <script> import { GlDropdownForm, GlIcon, GlLoadingIcon, GlToggle, GlTooltipDirective } from '@gitlab/ui'; import { createAlert } from '~/alert'; -import { - TYPE_EPIC, - TYPE_MERGE_REQUEST, - WORKSPACE_GROUP, - WORKSPACE_PROJECT, -} from '~/issues/constants'; +import { TYPE_EPIC, WORKSPACE_GROUP, WORKSPACE_PROJECT } from '~/issues/constants'; import { isLoggedIn } from '~/lib/utils/common_utils'; import { __, sprintf } from '~/locale'; import glFeatureFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; @@ -91,8 +86,8 @@ export default { }, }, computed: { - isMergeRequest() { - return this.issuableType === TYPE_MERGE_REQUEST && this.glFeatures.movedMrSidebar; + isMovedMrSidebar() { + return this.glFeatures.movedMrSidebar; }, isLoading() { return this.$apollo.queries?.subscribed?.loading || this.loading; @@ -148,7 +143,7 @@ export default { }); } - if (this.isMergeRequest) { + if (this.isMovedMrSidebar) { toast(subscribed ? __('Notifications turned on.') : __('Notifications turned off.')); } }, @@ -187,7 +182,7 @@ export default { </script> <template> - <gl-dropdown-form v-if="isMergeRequest" class="gl-dropdown-item"> + <gl-dropdown-form v-if="isMovedMrSidebar" class="gl-dropdown-item"> <div class="gl-px-5 gl-pb-2 gl-pt-1"> <gl-toggle :value="subscribed" diff --git a/app/assets/javascripts/sidebar/mount_sidebar.js b/app/assets/javascripts/sidebar/mount_sidebar.js index 2c56dc34701..1542c2e441d 100644 --- a/app/assets/javascripts/sidebar/mount_sidebar.js +++ b/app/assets/javascripts/sidebar/mount_sidebar.js @@ -17,6 +17,7 @@ import { __ } from '~/locale'; import { apolloProvider } from '~/graphql_shared/issuable_client'; import Translate from '~/vue_shared/translate'; import UserSelect from '~/vue_shared/components/user_select/user_select.vue'; +import NewHeaderActionsPopover from '~/issues/show/components/new_header_actions_popover.vue'; import CollapsedAssigneeList from './components/assignees/collapsed_assignee_list.vue'; import SidebarAssignees from './components/assignees/sidebar_assignees.vue'; import SidebarAssigneesWidget from './components/assignees/sidebar_assignees_widget.vue'; @@ -787,6 +788,21 @@ export function mountAssigneesDropdown() { }); } +function mountNewIssuePopover() { + const el = document.querySelector('.js-sidebar-header-popover'); + + if (!el) { + return null; + } + + return new Vue({ + el, + name: 'NewHeaderActionsPopover', + render: (createElement) => + createElement(NewHeaderActionsPopover, { props: { issueType: TYPE_MERGE_REQUEST } }), + }); +} + const isAssigneesWidgetShown = (isInIssuePage() || isInDesignPage() || isInMRPage()) && gon.features.issueAssigneesWidget; @@ -814,6 +830,7 @@ export function mountSidebar(mediator, store) { mountSidebarSeverityWidget(); mountSidebarEscalationStatus(); mountMoveIssueButton(); + mountNewIssuePopover(); } export { getSidebarOptions }; |