diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-07-19 17:16:28 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-07-19 17:16:28 +0300 |
commit | e4384360a16dd9a19d4d2d25d0ef1f2b862ed2a6 (patch) | |
tree | 2fcdfa7dcdb9db8f5208b2562f4b4e803d671243 /app/assets/javascripts/issues/show/components | |
parent | ffda4e7bcac36987f936b4ba515995a6698698f0 (diff) |
Add latest changes from gitlab-org/gitlab@16-2-stable-eev16.2.0-rc42
Diffstat (limited to 'app/assets/javascripts/issues/show/components')
5 files changed, 64 insertions, 84 deletions
diff --git a/app/assets/javascripts/issues/show/components/fields/description.vue b/app/assets/javascripts/issues/show/components/fields/description.vue index c8ea8fb7ab2..a1463d0e911 100644 --- a/app/assets/javascripts/issues/show/components/fields/description.vue +++ b/app/assets/javascripts/issues/show/components/fields/description.vue @@ -1,14 +1,13 @@ <script> import { __ } from '~/locale'; -import MarkdownField from '~/vue_shared/components/markdown/field.vue'; -import { helpPagePath } from '~/helpers/help_page_helper'; import MarkdownEditor from '~/vue_shared/components/markdown/markdown_editor.vue'; import glFeaturesFlagMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; +import { trackSavedUsingEditor } from '~/vue_shared/components/markdown/tracking'; +import { ISSUE_NOTEABLE_TYPE } from '~/notes/constants'; import updateMixin from '../../mixins/update'; export default { components: { - MarkdownField, MarkdownEditor, }, mixins: [updateMixin, glFeaturesFlagMixin()], @@ -47,8 +46,8 @@ export default { }; }, computed: { - quickActionsDocsPath() { - return helpPagePath('user/project/quick_actions'); + autocompleteDataSources() { + return gl.GfmAutoComplete?.dataSources; }, }, mounted() { @@ -58,6 +57,10 @@ export default { focus() { this.$refs.textarea?.focus(); }, + saveIssuable() { + trackSavedUsingEditor(this.$refs.markdownEditor.isContentEditorActive, ISSUE_NOTEABLE_TYPE); + this.updateIssuable(); + }, }, }; </script> @@ -66,45 +69,21 @@ export default { <div class="common-note-form"> <label class="sr-only" for="issue-description">{{ __('Description') }}</label> <markdown-editor - v-if="glFeatures.contentEditorOnIssues" + ref="markdownEditor" + :enable-content-editor="Boolean(glFeatures.contentEditorOnIssues)" class="gl-mt-3" :value="value" :render-markdown-path="markdownPreviewPath" :markdown-docs-path="markdownDocsPath" :form-field-props="formFieldProps" - :quick-actions-docs-path="quickActionsDocsPath" :enable-autocomplete="enableAutocomplete" + :autocomplete-data-sources="autocompleteDataSources" supports-quick-actions autofocus + data-qa-selector="description_field" @input="$emit('input', $event)" - @keydown.meta.enter="updateIssuable" - @keydown.ctrl.enter="updateIssuable" + @keydown.meta.enter="saveIssuable" + @keydown.ctrl.enter="saveIssuable" /> - <markdown-field - v-else - class="gl-mt-3" - :markdown-preview-path="markdownPreviewPath" - :markdown-docs-path="markdownDocsPath" - :quick-actions-docs-path="quickActionsDocsPath" - :can-attach-file="canAttachFile" - :enable-autocomplete="enableAutocomplete" - :textarea-value="value" - > - <template #textarea> - <textarea - v-bind="formFieldProps" - ref="textarea" - :value="value" - class="note-textarea js-gfm-input js-autosize markdown-area" - data-qa-selector="description_field" - dir="auto" - data-supports-quick-actions="true" - @input="$emit('input', $event.target.value)" - @keydown.meta.enter="updateIssuable" - @keydown.ctrl.enter="updateIssuable" - > - </textarea> - </template> - </markdown-field> </div> </template> diff --git a/app/assets/javascripts/issues/show/components/form.vue b/app/assets/javascripts/issues/show/components/form.vue index c9e21b296e4..831248d9603 100644 --- a/app/assets/javascripts/issues/show/components/form.vue +++ b/app/assets/javascripts/issues/show/components/form.vue @@ -1,6 +1,5 @@ <script> import { GlAlert } from '@gitlab/ui'; -import ConvertDescriptionModal from 'ee_component/issues/show/components/convert_description_modal.vue'; import { getDraft, updateDraft, getLockVersion, clearDraft } from '~/lib/utils/autosave'; import { convertToGraphQLId } from '~/graphql_shared/utils'; import { TYPENAME_ISSUE, TYPENAME_USER } from '~/graphql_shared/constants'; @@ -16,7 +15,6 @@ import LockedWarning from './locked_warning.vue'; export default { components: { - ConvertDescriptionModal, DescriptionField, DescriptionTemplateField, EditActions, @@ -175,9 +173,6 @@ export default { updateDraft(this.descriptionAutosaveKey, description, this.formState.lock_version); } }, - setDescription(desc) { - this.formData.description = desc; - }, }, }; </script> @@ -219,14 +214,6 @@ export default { :project-namespace="projectNamespace" /> </div> - - <convert-description-modal - v-if="issueId && glFeatures.generateDescriptionAi" - class="gl-pl-5 gl-md-pl-0" - :resource-id="resourceId" - :user-id="userId" - @contentGenerated="setDescription" - /> </div> <description-field diff --git a/app/assets/javascripts/issues/show/components/header_actions.vue b/app/assets/javascripts/issues/show/components/header_actions.vue index a36b0c46927..719f252781d 100644 --- a/app/assets/javascripts/issues/show/components/header_actions.vue +++ b/app/assets/javascripts/issues/show/components/header_actions.vue @@ -13,7 +13,7 @@ import * as Sentry from '@sentry/browser'; import { mapActions, mapGetters, mapState } from 'vuex'; import { createAlert, VARIANT_SUCCESS } from '~/alert'; import { EVENT_ISSUABLE_VUE_APP_CHANGE } from '~/issuable/constants'; -import { STATUS_CLOSED, TYPE_INCIDENT, TYPE_ISSUE, IssuableTypeText } from '~/issues/constants'; +import { STATUS_CLOSED, TYPE_ISSUE, IssuableTypeText } from '~/issues/constants'; import { ISSUE_STATE_EVENT_CLOSE, ISSUE_STATE_EVENT_REOPEN, @@ -22,7 +22,7 @@ import { import { capitalizeFirstCharacter } from '~/lib/utils/text_utility'; import { getCookie, parseBoolean, setCookie, isLoggedIn } from '~/lib/utils/common_utils'; import { visitUrl } from '~/lib/utils/url_utility'; -import { s__, __, sprintf } from '~/locale'; +import { __, sprintf } from '~/locale'; import eventHub from '~/notes/event_hub'; import Tracking from '~/tracking'; import toast from '~/vue_shared/plugins/global_toast'; @@ -172,12 +172,9 @@ export default { return this.openState === STATUS_CLOSED; }, issueTypeText() { - const issueTypeTexts = { - [TYPE_ISSUE]: s__('HeaderAction|issue'), - [TYPE_INCIDENT]: s__('HeaderAction|incident'), - }; + const { issueType } = this; - return issueTypeTexts[this.issueType] ?? this.issueType; + return IssuableTypeText[issueType] ?? issueType; }, buttonText() { return this.isClosed @@ -192,11 +189,11 @@ export default { }, dropdownText() { return sprintf(__('%{issueType} actions'), { - issueType: capitalizeFirstCharacter(this.issueType), + issueType: capitalizeFirstCharacter(this.issueTypeText), }); }, newIssueTypeText() { - return sprintf(__('New related %{issueType}'), { issueType: this.issueType }); + return sprintf(__('New related %{issueType}'), { issueType: this.issueTypeText }); }, showToggleIssueStateButton() { const canClose = !this.isClosed && this.canUpdateIssue; @@ -217,7 +214,7 @@ export default { }, copyMailAddressText() { return sprintf(__('Copy %{issueType} email address'), { - issueType: IssuableTypeText[this.issueType], + issueType: this.issueTypeText, }); }, isMrSidebarMoved() { @@ -429,7 +426,7 @@ export default { </gl-button> <gl-button - v-if="showToggleIssueStateButton" + v-if="showToggleIssueStateButton && !glFeatures.moveCloseIntoDropdown" class="gl-display-none gl-sm-display-inline-flex!" :data-qa-selector="qaSelector" :loading="isToggleStateButtonLoading" @@ -465,7 +462,12 @@ export default { <gl-dropdown-divider /> </template> - + <gl-dropdown-item + v-if="showToggleIssueStateButton && glFeatures.moveCloseIntoDropdown" + @click="toggleIssueState" + > + {{ buttonText }} + </gl-dropdown-item> <gl-dropdown-item v-if="canCreateIssue && isUserSignedIn" :href="newIssuePath"> {{ newIssueTypeText }} </gl-dropdown-item> @@ -495,6 +497,7 @@ export default { >{{ copyMailAddressText }}</gl-dropdown-item > </template> + <gl-dropdown-divider v-if="showToggleIssueStateButton || canDestroyIssue || canReportSpam" /> <gl-dropdown-item v-if="canReportSpam" :href="submitAsSpamPath" @@ -503,8 +506,14 @@ export default { > {{ __('Submit as spam') }} </gl-dropdown-item> + <gl-dropdown-item + v-if="!isIssueAuthor && isUserSignedIn" + data-testid="report-abuse-item" + @click="toggleReportAbuseDrawer(true)" + > + {{ $options.i18n.reportAbuse }} + </gl-dropdown-item> <template v-if="canDestroyIssue"> - <gl-dropdown-divider /> <gl-dropdown-item v-gl-modal="$options.deleteModalId" variant="danger" @@ -514,13 +523,6 @@ export default { {{ deleteButtonText }} </gl-dropdown-item> </template> - <gl-dropdown-item - v-if="!isIssueAuthor && isUserSignedIn" - data-testid="report-abuse-item" - @click="toggleReportAbuseDrawer(true)" - > - {{ $options.i18n.reportAbuse }} - </gl-dropdown-item> </gl-dropdown> <new-header-actions-popover v-if="isMrSidebarMoved" :issue-type="issueType" /> diff --git a/app/assets/javascripts/issues/show/components/incidents/timeline_events_form.vue b/app/assets/javascripts/issues/show/components/incidents/timeline_events_form.vue index 8267c0130a3..2a59b7a2042 100644 --- a/app/assets/javascripts/issues/show/components/incidents/timeline_events_form.vue +++ b/app/assets/javascripts/issues/show/components/incidents/timeline_events_form.vue @@ -229,7 +229,7 @@ export default { <template #textarea> <textarea v-model="timelineText" - class="note-textarea js-gfm-input js-autosize markdown-area" + class="note-textarea note-textarea-rounded-bottom js-gfm-input js-autosize markdown-area gl-bordered" data-testid="input-note" dir="auto" data-supports-quick-actions="false" diff --git a/app/assets/javascripts/issues/show/components/incidents/timeline_events_item.vue b/app/assets/javascripts/issues/show/components/incidents/timeline_events_item.vue index d33f3146d64..b776822bd9a 100644 --- a/app/assets/javascripts/issues/show/components/incidents/timeline_events_item.vue +++ b/app/assets/javascripts/issues/show/components/incidents/timeline_events_item.vue @@ -1,5 +1,5 @@ <script> -import { GlDropdown, GlDropdownItem, GlIcon, GlSprintf, GlBadge } from '@gitlab/ui'; +import { GlDisclosureDropdown, GlIcon, GlSprintf, GlBadge } from '@gitlab/ui'; import SafeHtml from '~/vue_shared/directives/safe_html'; import { formatDate } from '~/lib/utils/datetime_utility'; import { timelineItemI18n } from './constants'; @@ -9,8 +9,7 @@ export default { name: 'IncidentTimelineEventListItem', i18n: timelineItemI18n, components: { - GlDropdown, - GlDropdownItem, + GlDisclosureDropdown, GlIcon, GlSprintf, GlBadge, @@ -45,6 +44,25 @@ export default { canEditEvent() { return this.action === 'comment'; }, + items() { + const items = []; + + if (this.canEditEvent) { + items.push({ + text: this.$options.i18n.edit, + action: () => { + this.$emit('edit'); + }, + }); + } + items.push({ + text: this.$options.i18n.delete, + action: () => { + this.$emit('delete'); + }, + }); + return items; + }, }, methods: { getEventIcon, @@ -76,22 +94,16 @@ export default { </div> <div v-safe-html="noteHtml" class="md"></div> </div> - <gl-dropdown + <gl-disclosure-dropdown v-if="canUpdateTimelineEvent" - right - class="event-note-actions gl-ml-auto gl-align-self-start" + placement="right" + class="event-note-actions gl-align-self-start" icon="ellipsis_v" text-sr-only - :text="$options.i18n.moreActions" + :toggle-text="$options.i18n.moreActions" category="tertiary" no-caret - > - <gl-dropdown-item v-if="canEditEvent" @click="$emit('edit')"> - {{ $options.i18n.edit }} - </gl-dropdown-item> - <gl-dropdown-item @click="$emit('delete')"> - {{ $options.i18n.delete }} - </gl-dropdown-item> - </gl-dropdown> + :items="items" + /> </div> </template> |