diff options
Diffstat (limited to 'app/assets/javascripts/notes/components/comment_form.vue')
-rw-r--r-- | app/assets/javascripts/notes/components/comment_form.vue | 85 |
1 files changed, 13 insertions, 72 deletions
diff --git a/app/assets/javascripts/notes/components/comment_form.vue b/app/assets/javascripts/notes/components/comment_form.vue index 2ebebd76e1e..4e31fdcd4f0 100644 --- a/app/assets/javascripts/notes/components/comment_form.vue +++ b/app/assets/javascripts/notes/components/comment_form.vue @@ -1,14 +1,5 @@ <script> -import { - GlAlert, - GlButton, - GlIcon, - GlFormCheckbox, - GlTooltipDirective, - GlDropdown, - GlDropdownItem, - GlDropdownDivider, -} from '@gitlab/ui'; +import { GlAlert, GlButton, GlIcon, GlFormCheckbox, GlTooltipDirective } from '@gitlab/ui'; import Autosize from 'autosize'; import $ from 'jquery'; import { mapActions, mapGetters, mapState } from 'vuex'; @@ -34,6 +25,7 @@ import { COMMENT_FORM } from '../i18n'; import issuableStateMixin from '../mixins/issuable_state'; import CommentFieldLayout from './comment_field_layout.vue'; +import CommentTypeDropdown from './comment_type_dropdown.vue'; import discussionLockedWidget from './discussion_locked_widget.vue'; import noteSignedOutWidget from './note_signed_out_widget.vue'; @@ -42,8 +34,6 @@ const { UNPROCESSABLE_ENTITY } = httpStatusCodes; export default { name: 'CommentForm', i18n: COMMENT_FORM, - noteTypeComment: constants.COMMENT, - noteTypeDiscussion: constants.DISCUSSION, components: { noteSignedOutWidget, discussionLockedWidget, @@ -53,10 +43,8 @@ export default { TimelineEntryItem, GlIcon, CommentFieldLayout, + CommentTypeDropdown, GlFormCheckbox, - GlDropdown, - GlDropdownItem, - GlDropdownDivider, }, directives: { GlTooltip: GlTooltipDirective, @@ -88,12 +76,6 @@ export default { 'hasDrafts', ]), ...mapState(['isToggleStateButtonLoading']), - isNoteTypeComment() { - return this.noteType === constants.COMMENT; - }, - isNoteTypeDiscussion() { - return this.noteType === constants.DISCUSSION; - }, noteableDisplayName() { return splitCamelCase(this.noteableType).toLowerCase(); }, @@ -105,15 +87,8 @@ export default { ? this.$options.i18n.comment : this.$options.i18n.startThread; }, - startDiscussionDescription() { - return this.getNoteableData.noteableType === constants.MERGE_REQUEST_NOTEABLE_TYPE - ? this.$options.i18n.discussionThatNeedsResolution - : this.$options.i18n.discussion; - }, - commentDescription() { - return sprintf(this.$options.i18n.submitButton.commentHelp, { - noteableDisplayName: this.noteableDisplayName, - }); + discussionsRequireResolution() { + return this.getNoteableData.noteableType === constants.MERGE_REQUEST_NOTEABLE_TYPE; }, isOpen() { return this.openState === constants.OPENED || this.openState === constants.REOPENED; @@ -314,15 +289,6 @@ export default { this.autosave.reset(); }, - setNoteType(type) { - this.noteType = type; - }, - setNoteTypeToComment() { - this.setNoteType(constants.COMMENT); - }, - setNoteTypeToDiscussion() { - this.setNoteType(constants.DISCUSSION); - }, editCurrentUserLastNote() { if (this.note === '') { const lastNote = this.getCurrentUserLastNote; @@ -448,40 +414,15 @@ export default { class="gl-text-gray-500" /> </gl-form-checkbox> - <gl-dropdown - split - :text="commentButtonTitle" - class="gl-mr-3 js-comment-button js-comment-submit-button comment-type-dropdown" - category="primary" - variant="confirm" + <comment-type-dropdown + v-model="noteType" + class="gl-mr-3" :disabled="disableSubmitButton" - data-testid="comment-button" - data-qa-selector="comment_button" - :data-track-label="trackingLabel" - data-track-event="click_button" - @click="handleSave()" - > - <gl-dropdown-item - is-check-item - :is-checked="isNoteTypeComment" - :selected="isNoteTypeComment" - @click="setNoteTypeToComment" - > - <strong>{{ $options.i18n.submitButton.comment }}</strong> - <p class="gl-m-0">{{ commentDescription }}</p> - </gl-dropdown-item> - <gl-dropdown-divider /> - <gl-dropdown-item - is-check-item - :is-checked="isNoteTypeDiscussion" - :selected="isNoteTypeDiscussion" - data-qa-selector="discussion_menu_item" - @click="setNoteTypeToDiscussion" - > - <strong>{{ $options.i18n.submitButton.startThread }}</strong> - <p class="gl-m-0">{{ startDiscussionDescription }}</p> - </gl-dropdown-item> - </gl-dropdown> + :tracking-label="trackingLabel" + :noteable-display-name="noteableDisplayName" + :discussions-require-resolution="discussionsRequireResolution" + @click="handleSave" + /> </template> <gl-button v-if="canToggleIssueState" |