[ci skip] Disable slash commands in edit mode

app/assets/javascripts/notes/components/issue_comment_form.vue

@@ -30,7 +30,7 @@
       issueNoteSignedOutWidget,
     },
     computed: {
-       ...mapGetters([
+      ...mapGetters([
         'getCurrentUserLastNote',
       ]),
       isLoggedIn() {
@@ -62,7 +62,7 @@
     },
     methods: {
       ...mapActions([
-        'saveNote'
+        'saveNote',
       ]),
       handleSave(withIssueAction) {
         if (this.note.length) {
@@ -89,7 +89,7 @@
                 if (res.errors.commands_only) {
                   this.discard();
                 } else {
-                  return Flash('Something went wrong while adding your comment. Please try again.');
+                  Flash('Something went wrong while adding your comment. Please try again.');
                 }
               } else {
                 this.discard();
@@ -104,7 +104,7 @@
           if (this.isIssueOpen) {
             this.issueState = constants.CLOSED;
           } else {
-            this.issueState =constants.REOPENED;
+            this.issueState = constants.REOPENED;
           }
 
           gl.issueData.state = this.issueState;
@@ -149,7 +149,7 @@
 
     destroyed() {
       eventHub.$off('issueStateChanged');
-    }
+    },
   };
 </script>
 
@@ -182,7 +182,6 @@
                   id="note-body"
                   name="note[note]"
                   class="note-textarea js-gfm-input markdown-area"
-                  data-supports-slash-commands="true"
                   data-supports-quick-actions="true"
                   aria-label="Description"
                   v-model="note"

app/assets/javascripts/notes/components/issue_discussion.vue

@@ -50,7 +50,7 @@
     methods: {
       ...mapActions([
         'saveNote',
-        'toggleDiscussion'
+        'toggleDiscussion',
       ]),
       componentName(note) {
         if (note.isPlaceholderNote) {
@@ -83,7 +83,7 @@
 
         this.isReplying = false;
       },
-      saveReply(note) {
+      saveReply(noteText) {
         const replyData = {
           endpoint: this.newNotePath,
           flashContainer: this.$el,
@@ -91,7 +91,7 @@
             in_reply_to_discussion_id: this.note.reply_id,
             target_type: 'issue',
             target_id: this.discussion.noteable_id,
-            note: { note: note },
+            note: { note: noteText },
             full_data: true,
           },
         };
@@ -162,6 +162,7 @@
                     v-if="isReplying"
                     saveButtonTitle="Comment"
                     :discussion="note"
+                    :is-editing="false"
                     @handleFormUpdate="saveReply"
                     @cancelFormEdition="cancelReplyForm"
                     ref="noteForm"

app/assets/javascripts/notes/components/issue_note_actions.vue

 <script>
+  import { mapGetters } from 'vuex';
   import emojiSmiling from 'icons/_emoji_slightly_smiling_face.svg';
   import emojiSmile from 'icons/_emoji_smile.svg';
   import emojiSmiley from 'icons/_emoji_smiley.svg';
@@ -53,13 +54,15 @@
         emojiSmiling,
         emojiSmile,
         emojiSmiley,
-        currentUserId: window.gon.current_user_id,
       };
     },
     components: {
       loadingIcon,
     },
     computed: {
+      ...mapGetters([
+        'getUserDataByProp',
+      ]),
       shouldShowActionsDropdown() {
         return this.currentUserId && (this.canEdit || this.canReportAsAbuse);
       },
@@ -67,8 +70,11 @@
         return this.currentUserId;
       },
       isAuthoredByCurrentUser() {
-        return this.authorId === this.currentUserId
+        return this.authorId === this.currentUserId;
       },
+      currentUserId() {
+        return this.getUserDataByProp('id');
+      }
     },
   };
 </script>

app/assets/javascripts/notes/components/issue_note_body.vue

@@ -73,6 +73,7 @@
       ref="noteForm"
       @handleFormUpdate="handleFormUpdate"
       @cancelFormEdition="formCancelHandler"
+      :is-editing="isEditing"
       :note-body="noteBody"
       :note-id="note.id"
       />

app/assets/javascripts/notes/components/issue_note_form.vue

@@ -22,17 +22,16 @@
       discussion: {
         type: Object,
         required: false,
-      }
+      },
+      isEditing: {
+        type: Boolean,
+        required: true,
+      },
     },
     data() {
-      const { getIssueData, getNotesData } =  this.$store.getters;
-
       return {
         initialNote: this.noteBody,
         note: this.noteBody,
-        markdownPreviewUrl: getIssueData.preview_note_path,
-        markdownDocsUrl: getNotesData.markdownDocs,
-        quickActionsDocsUrl: getNotesData.quickActionsDocs,
         conflictWhileEditing: false,
       };
     },
@@ -42,10 +41,25 @@
     computed: {
       ...mapGetters([
         'getDiscussionLastNote',
+        'getIssueDataByProp',
+        'getNotesDataByProp',
+        'getUserDataByProp',
       ]),
       noteHash() {
         return `#note_${this.noteId}`;
       },
+      markdownPreviewUrl() {
+        return this.getIssueDataByProp('preview_note_path');
+      },
+      markdownDocsUrl() {
+        return this.getNotesDataByProp('markdownDocs');
+      },
+      quickActionsDocsUrl() {
+        return this.getNotesDataByProp('quickActionsDocs');
+      },
+      currentUserId() {
+        return this.getUserDataByProp('id');
+      }
     },
     methods: {
       handleUpdate() {
@@ -53,7 +67,7 @@
       },
       editMyLastNote() {
         if (this.note === '') {
-          const lastNoteInDiscussion = this.getDiscussionLastNote(this.discussion, window.gon.current_user_id);
+          const lastNoteInDiscussion = this.getDiscussionLastNote(this.discussion, this.currentUserId);
 
           if (lastNoteInDiscussion) {
             eventHub.$emit('enterEditMode', {
@@ -105,8 +119,7 @@
           id="note-body"
           name="note[note]"
           class="note-textarea js-gfm-input js-autosize markdown-area"
-          data-supports-slash-commands="true"
-          data-supports-quick-actions="true"
+          :data-supports-quick-actions="!isEditing"
           aria-label="Description"
           v-model="note"
           ref="textarea"

app/assets/javascripts/notes/components/issue_notes_app.vue

 <script>
   /* global Flash */
 
-  import Vue from 'vue';
-  import { mapGetters, mapActions, mapMutations } from 'vuex';
+  import { mapGetters, mapActions } from 'vuex';
   import store from '../stores/';
-  import * as constants from '../constants'
+  import * as constants from '../constants';
   import eventHub from '../event_hub';
   import issueNote from './issue_note.vue';
   import issueDiscussion from './issue_discussion.vue';

app/assets/javascripts/notes/stores/getters.js

@@ -8,7 +8,7 @@ export const getIssueData = state => state.issueData;
 export const getIssueDataByProp = state => prop => state.issueData[prop];
 
 export const getUserData = state => state.userData;
-export const getUserDataByProp = state => prop => state.notesData[prop];
+export const getUserDataByProp = state => prop => state.userData[prop];
 
 export const notesById = state => state.notes.reduce((acc, note) => {
   note.notes.every(n => Object.assign(acc, { [n.id]: n }));

app/assets/javascripts/notes/stores/mutations.js

@@ -59,26 +59,26 @@ export default {
   },
 
   [types.SET_NOTES_DATA](state, data) {
-    state.notesData = data;
+    Object.assign(state, { notesData: data });
   },
 
   [types.SET_ISSUE_DATA](state, data) {
-    state.issueData = data;
+    Object.assign(state, { issueData: data });
   },
 
   [types.SET_USER_DATA](state, data) {
-    state.userData = data;
+    Object.assign(state, { userData: data });
   },
-  [types.SET_INITAL_NOTES](state, notes) {
-    state.notes = notes;
+  [types.SET_INITAL_NOTES](state, notesData) {
+    Object.assign(state, { notes: notesData });
   },
 
   [types.SET_LAST_FETCHED_AT](state, fetchedAt) {
-    state.lastFetchedAt = fetchedAt;
+    Object.assign(state, { lastFetchedAt: fetchedAt });
   },
 
   [types.SET_TARGET_NOTE_HASH](state, hash) {
-    state.targetNoteHash = hash;
+    Object.assign(state, { targetNoteHash: hash });
   },
 
   [types.SHOW_PLACEHOLDER_NOTE](state, data) {