diff --git a/app/assets/javascripts/lib/utils/autosave.js b/app/assets/javascripts/lib/utils/autosave.js index 551035024a9b81ca128ceb05a7639b1d00013ef9..023c336db02f4d9af90fd105dbde701c707ff7d8 100644 --- a/app/assets/javascripts/lib/utils/autosave.js +++ b/app/assets/javascripts/lib/utils/autosave.js @@ -1,3 +1,5 @@ +import { capitalizeFirstCharacter } from '~/lib/utils/text_utility'; + export const clearDraft = autosaveKey => { try { window.localStorage.removeItem(`autosave/${autosaveKey}`); @@ -25,3 +27,6 @@ export const updateDraft = (autosaveKey, text) => { console.error(e); } }; + +export const getDiscussionReplyKey = (noteableType, discussionId) => + ['Note', capitalizeFirstCharacter(noteableType), discussionId, 'Reply'].join('/'); diff --git a/app/assets/javascripts/notes/components/noteable_discussion.vue b/app/assets/javascripts/notes/components/noteable_discussion.vue index e6abe233e49137398f407b920b5e1c9a40e67dc7..c4baec19f57d717814a4b37aebc833db5c01c008 100644 --- a/app/assets/javascripts/notes/components/noteable_discussion.vue +++ b/app/assets/javascripts/notes/components/noteable_discussion.vue @@ -4,6 +4,7 @@ import { mapActions, mapGetters } from 'vuex'; import { GlTooltipDirective } from '@gitlab/ui'; import { truncateSha } from '~/lib/utils/text_utility'; import { s__, __, sprintf } from '~/locale'; +import { getDiscussionReplyKey } from '~/lib/utils/autosave'; import systemNote from '~/vue_shared/components/notes/system_note.vue'; import icon from '~/vue_shared/components/icon.vue'; import diffLineNoteFormMixin from 'ee_else_ce/notes/mixins/diff_line_note_form'; @@ -108,6 +109,9 @@ export default { author() { return this.firstNote.author; }, + autosaveKey() { + return getDiscussionReplyKey(this.firstNote.noteable_type, this.discussion.id); + }, canReply() { return this.getNoteableData.current_user.can_create_note; }, @@ -517,6 +521,7 @@ Please check your network connection and try again.`; :is-editing="false" :line="diffLine" save-button-title="Comment" + :autosave-key="autosaveKey" @handleFormUpdateAddToReview="addReplyToReview" @handleFormUpdate="saveReply" @cancelForm="cancelReplyForm" diff --git a/changelogs/unreleased/winh-toggle-comment-draft.yml b/changelogs/unreleased/winh-toggle-comment-draft.yml new file mode 100644 index 0000000000000000000000000000000000000000..6b4aad55a052c55e7e6823197fc3c0ac6e1ab5ed --- /dev/null +++ b/changelogs/unreleased/winh-toggle-comment-draft.yml @@ -0,0 +1,5 @@ +--- +title: Display draft when toggling replies +merge_request: 25563 +author: +type: fixed diff --git a/spec/javascripts/notes/components/noteable_discussion_spec.js b/spec/javascripts/notes/components/noteable_discussion_spec.js index bd94dfb9285bee23aac50a8b3cba1d597a240aa2..3304c79cdb7a2cfef858eaa781e1b3f6499822a8 100644 --- a/spec/javascripts/notes/components/noteable_discussion_spec.js +++ b/spec/javascripts/notes/components/noteable_discussion_spec.js @@ -84,6 +84,7 @@ describe('noteable_discussion component', () => { expect(noteFormProps.isEditing).toBe(false); expect(noteFormProps.line).toBe(null); expect(noteFormProps.saveButtonTitle).toBe('Comment'); + expect(noteFormProps.autosaveKey).toBe(`Note/Issue/${discussionMock.id}/Reply`); }) .then(done) .catch(done.fail);