Backport of draft-design-improvements changes

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

@@ -48,13 +48,19 @@ export default {
       required: false,
       default: '',
     },
+    resolveDiscussion: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
   },
   data() {
     return {
       updatedNoteBody: this.noteBody,
       conflictWhileEditing: false,
       isSubmitting: false,
-      isResolving: false,
+      isResolving: this.resolveDiscussion,
+      isUnresolving: !this.resolveDiscussion,
       resolveAsThread: true,
     };
   },
@@ -149,7 +155,7 @@ export default {
   <div ref="editNoteForm" class="note-edit-form current-note-edit-form js-discussion-note-form">
     <div v-if="conflictWhileEditing" class="js-conflict-edit-warning alert alert-danger">
       This comment has changed since you started editing, please review the
-      <a :href="noteHash" target="_blank" rel="noopener noreferrer"> updated comment </a> to ensure
+      <a :href="noteHash" target="_blank" rel="noopener noreferrer">updated comment</a> to ensure
       information is not lost.
     </div>
     <div class="flash-container timeline-content"></div>
@@ -174,22 +180,20 @@ export default {
           v-model="updatedNoteBody"
           :data-supports-quick-actions="!isEditing"
           name="note[note]"
-          class="note-textarea js-gfm-input js-note-text
-js-autosize markdown-area js-vue-issue-note-form js-vue-textarea qa-reply-input"
+          class="note-textarea js-gfm-input js-note-text js-autosize markdown-area js-vue-issue-note-form js-vue-textarea qa-reply-input"
           aria-label="Description"
           placeholder="Write a comment or drag your files here…"
           @keydown.meta.enter="handleUpdate();"
           @keydown.ctrl.enter="handleUpdate();"
           @keydown.up="editMyLastNote();"
           @keydown.esc="cancelHandler(true);"
-        >
-        </textarea>
+        ></textarea>
       </markdown-field>
       <div class="note-form-actions clearfix">
         <button
           :disabled="isDisabled"
           type="button"
-          class="js-vue-issue-save btn btn-success js-comment-button "
+          class="js-vue-issue-save btn btn-success js-comment-button"
           @click="handleUpdate();"
         >
           {{ saveButtonTitle }}

app/assets/javascripts/notes/mixins/resolvable.js

@@ -36,7 +36,7 @@ export default {
       const discussion = this.resolveAsThread;
       const endpoint = discussion ? this.discussion.resolve_path : `${this.note.path}/resolve`;
 
-      this.toggleResolveNote({ endpoint, isResolved, discussion })
+      return this.toggleResolveNote({ endpoint, isResolved, discussion })
         .then(() => {
           this.isResolving = false;
         })