fix: save draft based on the comment id, not on reply id (#1220)

vas3k · Jun 27, 2024 · 0979869 · 0979869
1 parent bb7cb42
commit 0979869
Show file tree

Hide file tree

Showing 3 changed files with 12 additions and 6 deletions.
diff --git a/frontend/html/comments/types/reply.html b/frontend/html/comments/types/reply.html
@@ -88,7 +88,7 @@
             {% endif %}
 
             {% if me and me.is_active_membership and comment.post.is_commentable %}
-                <span class="comment-footer-button" v-on:click="showReplyForm('{{ reply_to.id }}', '{{ comment.author.slug }}')">
+                <span class="comment-footer-button" v-on:click="showReplyForm('{{ reply_to.id }}', '{{ comment.author.slug }}', '{{ comment.id }}')">
                     <i class="fas fa-reply"></i>&nbsp;ответить
                 </span>
             {% endif %}

diff --git a/frontend/static/js/components/ReplyContainer.vue b/frontend/static/js/components/ReplyContainer.vue
@@ -30,6 +30,7 @@
 export default {
     name: 'ReplyContainer',
     props: {
+        // type { commentId: string, username: string, draftKey?: string }
         replyTo: {
             type: Object
         },
@@ -65,7 +66,7 @@ export default {
         replyTo: async function(newReplyTo, oldReplyTo) {
             this.replyTo = newReplyTo;
             if (oldReplyTo) {
-                this.saveDraft(oldReplyTo.commentId);
+                this.saveDraft(getDraftKey(oldReplyTo));
             }
         }
     },
@@ -76,9 +77,10 @@ export default {
             const newCommentEl = this.$el.querySelector(`#comment-${this.replyTo.commentId}`)
             newCommentEl.after(replyForm)
             const editor = this.getEditor()
+            const draftKey = getDraftKey(this.replyTo)
 
-            if (this.replyTo.commentId in this.drafts) {
-                const text = this.drafts[this.replyTo.commentId]
+            if (draftKey in this.drafts) {
+                const text = this.drafts[draftKey]
                 const textarea = replyForm.querySelector("textarea")
                 textarea.value = text
                 editor.setValue(text)
@@ -139,4 +141,8 @@ export default {
         }
     }
 }
+
+function getDraftKey(replyTo) {
+    return replyTo?.draftKey || replyTo?.commentId
+}
 </script>
diff --git a/frontend/static/js/main.js b/frontend/static/js/main.js
@@ -76,8 +76,8 @@ new Vue({
                 window.scrollBy(0, commentPosition.top);
             }
         },
-        showReplyForm(commentId, username) {
-            this.replyTo = { commentId, username }
+        showReplyForm(commentId, username, draftKey) {
+            this.replyTo = { commentId, username, draftKey }
         },
     },
 });