Show quick actions link when editing comments

This change fixes a bug where only "Markdown is supported" instead of
"Markdown" and "quick actions are supported" links are shown when
editing issue descriptions and comments

Changelog: fixed

app/assets/javascripts/diffs/components/diff_content.vue

@@ -170,7 +170,6 @@ export default {
           <note-form
             v-if="diffFileCommentForm"
             ref="noteForm"
-            :is-editing="false"
             :save-button-title="__('Comment')"
             class="diff-comment-form new-note discussion-form discussion-form-container"
             @handleFormUpdateAddToReview="addToReview"

app/assets/javascripts/diffs/components/diff_line_note_form.vue

@@ -221,7 +221,6 @@ export default {
     </div>
     <note-form
       ref="noteForm"
-      :is-editing="false"
       :line-code="line.line_code"
       :line="line"
       :lines="commentLines"

app/assets/javascripts/issues/show/components/fields/description.vue

 <script>
 import markdownField from '~/vue_shared/components/markdown/field.vue';
+import { helpPagePath } from '~/helpers/help_page_helper';
 import updateMixin from '../../mixins/update';
 
 export default {
@@ -31,6 +32,11 @@ export default {
       default: true,
     },
   },
+  computed: {
+    quickActionsDocsPath() {
+      return helpPagePath('user/project/quick_actions');
+    },
+  },
   mounted() {
     this.$refs.textarea.focus();
   },
@@ -43,6 +49,7 @@ export default {
     <markdown-field
       :markdown-preview-path="markdownPreviewPath"
       :markdown-docs-path="markdownDocsPath"
+      :quick-actions-docs-path="quickActionsDocsPath"
       :can-attach-file="canAttachFile"
       :enable-autocomplete="enableAutocomplete"
       :textarea-value="formState.description"

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

@@ -174,7 +174,6 @@ export default {
     <note-form
       v-if="isEditing"
       ref="noteForm"
-      :is-editing="isEditing"
       :note-body="noteBody"
       :note-id="note.id"
       :line="line"

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

@@ -41,10 +41,6 @@ export default {
       required: false,
       default: () => ({}),
     },
-    isEditing: {
-      type: Boolean,
-      required: true,
-    },
     lineCode: {
       type: String,
       required: false,
@@ -184,7 +180,7 @@ export default {
       return this.getNotesDataByProp('markdownDocsPath');
     },
     quickActionsDocsPath() {
-      return !this.isEditing ? this.getNotesDataByProp('quickActionsDocsPath') : undefined;
+      return this.getNotesDataByProp('quickActionsDocsPath');
     },
     currentUserId() {
       return this.getUserDataByProp('id');
@@ -348,7 +344,7 @@ export default {
               ref="textarea"
               v-model="updatedNoteBody"
               :disabled="isSubmitting"
-              :data-supports-quick-actions="!isEditing"
+              data-supports-quick-actions="true"
               name="note[note]"
               class="note-textarea js-gfm-input js-note-text js-autosize markdown-area js-vue-issue-note-form"
               data-qa-selector="reply_field"

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

@@ -307,7 +307,6 @@ export default {
                     v-if="isReplying"
                     ref="noteForm"
                     :discussion="discussion"
-                    :is-editing="false"
                     :line="diffLine"
                     save-button-title="Comment"
                     :autosave-key="autosaveKey"

spec/frontend/issues/show/components/fields/description_spec.js

@@ -14,6 +14,7 @@ describe('Description field component', () => {
       propsData: {
         markdownPreviewPath: '/',
         markdownDocsPath: '/',
+        quickActionsDocsPath: '/',
         formState: {
           description,
         },

spec/frontend/notes/components/note_form_spec.js

@@ -81,7 +81,6 @@ describe('issue_note_form component', () => {
     it('should show conflict message if note changes outside the component', async () => {
       wrapper.setProps({
         ...props,
-        isEditing: true,
         noteBody: 'Foo',
       });
 
@@ -111,6 +110,12 @@ describe('issue_note_form component', () => {
       );
     });
 
+    it('should set data-supports-quick-actions to enable autocomplete', () => {
+      const textarea = wrapper.find('textarea');
+
+      expect(textarea.attributes('data-supports-quick-actions')).toBe('true');
+    });
+
     it('should link to markdown docs', () => {
       const { markdownDocsPath } = notesDataMock;
       const markdownField = wrapper.find(MarkdownField);
@@ -171,7 +176,6 @@ describe('issue_note_form component', () => {
       it('should be possible to cancel', async () => {
         wrapper.setProps({
           ...props,
-          isEditing: true,
         });
         await nextTick();
 
@@ -185,7 +189,6 @@ describe('issue_note_form component', () => {
       it('should be possible to update the note', async () => {
         wrapper.setProps({
           ...props,
-          isEditing: true,
         });
         await nextTick();
 

spec/frontend/notes/components/noteable_discussion_spec.js

@@ -86,7 +86,6 @@ describe('noteable_discussion component', () => {
       const noteFormProps = noteForm.props();
 
       expect(noteFormProps.discussion).toBe(discussionMock);
-      expect(noteFormProps.isEditing).toBe(false);
       expect(noteFormProps.line).toBe(null);
       expect(noteFormProps.saveButtonTitle).toBe('Comment');
       expect(noteFormProps.autosaveKey).toBe(`Note/Issue/${discussionMock.id}/Reply`);

spec/frontend/notes/components/notes_app_spec.js

@@ -298,16 +298,18 @@ describe('note_app', () => {
 
       await nextTick();
       expect(wrapper.find(`.edit-note a[href="${markdownDocsPath}"]`).text().trim()).toEqual(
-        'Markdown is supported',
+        'Markdown',
       );
     });
 
-    it('should not render quick actions docs url', async () => {
+    it('should render quick actions docs url', async () => {
       wrapper.find('.js-note-edit').trigger('click');
       const { quickActionsDocsPath } = mockData.notesDataMock;
 
       await nextTick();
-      expect(wrapper.find(`.edit-note a[href="${quickActionsDocsPath}"]`).exists()).toBe(false);
+      expect(wrapper.find(`.edit-note a[href="${quickActionsDocsPath}"]`).text().trim()).toEqual(
+        'quick actions',
+      );
     });
   });