diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2017-08-03 21:27:33 +0300 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2017-08-03 22:00:03 +0300 |
commit | 9e4164d417d1f145627a1eff9791f08dcbfc655b (patch) | |
tree | 3561257c81892e9cd70e3c2b010612a001fe04b2 | |
parent | b5b562a3bf22df0e40955e50ad9d42114624bda5 (diff) |
Keep the replies when the user leaves the page
7 files changed, 45 insertions, 21 deletions
diff --git a/app/assets/javascripts/autosave.js b/app/assets/javascripts/autosave.js index cfab6c40b34..6000c56665b 100644 --- a/app/assets/javascripts/autosave.js +++ b/app/assets/javascripts/autosave.js @@ -2,6 +2,11 @@ import AccessorUtilities from './lib/utils/accessor'; window.Autosave = (function() { + /** + * + * @param {*} field the textarea + * @param {Array} key Array with: ['Note', type, id, ] + */ function Autosave(field, key) { this.field = field; this.isLocalStorageAvailable = AccessorUtilities.isLocalStorageAccessSafe(); diff --git a/app/assets/javascripts/notes/components/issue_comment_form.vue b/app/assets/javascripts/notes/components/issue_comment_form.vue index b7b7140d772..2ef2af5bbac 100644 --- a/app/assets/javascripts/notes/components/issue_comment_form.vue +++ b/app/assets/javascripts/notes/components/issue_comment_form.vue @@ -1,5 +1,5 @@ <script> - /* global Flash */ + /* global Flash, Autosave */ import { mapActions, mapGetters } from 'vuex'; import userAvatarLink from '../../vue_shared/components/user_avatar/user_avatar_link.vue'; @@ -7,6 +7,7 @@ import issueNoteSignedOutWidget from './issue_note_signed_out_widget.vue'; import eventHub from '../event_hub'; import * as constants from '../constants'; + import '../../autosave'; export default { data() { @@ -153,15 +154,17 @@ } } }, + initAutoSave() { + return new Autosave($(this.$refs.textarea), ['Note', 'Issue', this.getIssueData.id]); + }, }, mounted() { - eventHub.$on('issueStateChanged', (isClosed) => { + // jQuery is needed here because it is a custom event being dispatched with jQuery. + $(document).on('issuable:change', (e, isClosed) => { this.issueState = isClosed ? constants.CLOSED : constants.REOPENED; }); - }, - destroyed() { - eventHub.$off('issueStateChanged'); + this.initAutoSave(); }, }; </script> diff --git a/app/assets/javascripts/notes/components/issue_discussion.vue b/app/assets/javascripts/notes/components/issue_discussion.vue index d4754178933..7952dfacc13 100644 --- a/app/assets/javascripts/notes/components/issue_discussion.vue +++ b/app/assets/javascripts/notes/components/issue_discussion.vue @@ -1,5 +1,5 @@ <script> - /* global Flash */ + /* global Flash, Autosave */ import { mapActions, mapGetters } from 'vuex'; import { SYSTEM_NOTE } from '../constants'; import issueNote from './issue_note.vue'; @@ -11,6 +11,7 @@ import issueNoteForm from './issue_note_form.vue'; import placeholderNote from './issue_placeholder_note.vue'; import placeholderSystemNote from './issue_placeholder_system_note.vue'; + import '../../autosave'; export default { props: { @@ -107,6 +108,19 @@ }) .catch(() => Flash('Something went wrong while adding your reply. Please try again.')); }, + initAutoSave() { + return new Autosave($(this.$refs.noteForm.$refs.textarea), ['Note', 'Issue', this.note.id]); + }, + }, + mounted() { + if (this.isReplying) { + this.initAutoSave(); + } + }, + updated() { + if (this.isReplying) { + this.initAutoSave(); + } }, }; </script> diff --git a/app/assets/javascripts/notes/components/issue_note.vue b/app/assets/javascripts/notes/components/issue_note.vue index 05bf1d2bca0..a41d646c033 100644 --- a/app/assets/javascripts/notes/components/issue_note.vue +++ b/app/assets/javascripts/notes/components/issue_note.vue @@ -39,7 +39,6 @@ return { 'is-editing': this.isEditing, 'disabled-content': this.isDeleting, - //'js-my-note': this.author.id === this.currentUserId, target: this.targetNoteHash === this.noteAnchorId, }; }, diff --git a/app/assets/javascripts/notes/components/issue_note_body.vue b/app/assets/javascripts/notes/components/issue_note_body.vue index 29ac6859840..61990340391 100644 --- a/app/assets/javascripts/notes/components/issue_note_body.vue +++ b/app/assets/javascripts/notes/components/issue_note_body.vue @@ -1,8 +1,10 @@ <script> + /* global Autosave */ import issueNoteEditedText from './issue_note_edited_text.vue'; import issueNoteAwardsList from './issue_note_awards_list.vue'; import issueNoteForm from './issue_note_form.vue'; import TaskList from '../../task_list'; + import '../../autosave'; export default { props: { @@ -49,13 +51,22 @@ formCancelHandler(shouldConfirm, isDirty) { this.$emit('cancelFormEdition', shouldConfirm, isDirty); }, + initAutoSave() { + return new Autosave($(this.$refs.noteForm.$refs.textarea), ['Note', 'Issue', this.note.id]); + }, }, mounted() { this.renderGFM(); this.initTaskList(); + if (this.isEditing) { + this.initAutoSave(); + } }, updated() { this.initTaskList(); + if (this.isEditing) { + this.initAutoSave(); + } }, }; </script> diff --git a/app/assets/javascripts/notes/components/issue_notes_app.vue b/app/assets/javascripts/notes/components/issue_notes_app.vue index 14b7afe1287..4c0351f701b 100644 --- a/app/assets/javascripts/notes/components/issue_notes_app.vue +++ b/app/assets/javascripts/notes/components/issue_notes_app.vue @@ -4,7 +4,6 @@ import { mapGetters, mapActions } from 'vuex'; import store from '../stores/'; import * as constants from '../constants'; - import eventHub from '../event_hub'; import issueNote from './issue_note.vue'; import issueDiscussion from './issue_discussion.vue'; import issueSystemNote from './issue_system_note.vue'; @@ -96,17 +95,6 @@ this.poll(); }, - bindEventHubListeners() { - this.$el.parentElement.addEventListener('toggleAward', (event) => { - const { awardName, noteId } = event.detail; - this.actionToggleAward({ awardName, noteId }); - }); - - // JQuery is needed here because it is a custom event being dispatched with jQuery. - $(document).on('issuable:change', (e, isClosed) => { - eventHub.$emit('issueStateChanged', isClosed); - }); - }, checkLocationHash() { const hash = gl.utils.getLocationHash(); const $el = $(`#${hash}`); @@ -125,7 +113,11 @@ mounted() { this.fetchNotes(); this.initPolling(); - this.bindEventHubListeners(); + + this.$el.parentElement.addEventListener('toggleAward', (event) => { + const { awardName, noteId } = event.detail; + this.actionToggleAward({ awardName, noteId }); + }); }, }; </script> diff --git a/app/controllers/concerns/notes_actions.rb b/app/controllers/concerns/notes_actions.rb index 0f90137ad3d..1d0587aad3a 100644 --- a/app/controllers/concerns/notes_actions.rb +++ b/app/controllers/concerns/notes_actions.rb @@ -179,7 +179,7 @@ module NotesActions def set_polling_interval_header return unless noteable.is_a?(Issue) - Gitlab::PollingInterval.set_header(response, interval: 3_000) + Gitlab::PollingInterval.set_header(response, interval: 6_000) end def noteable |