From ff62915ddfa2492ab3889d8465b530c1d57f59dd Mon Sep 17 00:00:00 2001 From: Dessalines <dessalines@users.noreply.github.com> Date: Mon, 7 Aug 2023 12:53:21 -0400 Subject: [PATCH] Fix comment insertion from context views. Fixes #2030 (#2031) --- src/shared/components/post/post.tsx | 40 +++++++++++++-------- src/shared/utils/app/build-comments-tree.ts | 4 +++ 2 files changed, 30 insertions(+), 14 deletions(-) diff --git a/src/shared/components/post/post.tsx b/src/shared/components/post/post.tsx index 49e7348..77fe780 100644 --- a/src/shared/components/post/post.tsx +++ b/src/shared/components/post/post.tsx @@ -389,15 +389,19 @@ export class Post extends Component<any, PostState> { onMarkPostAsRead={this.handleMarkPostAsRead} /> <div ref={this.state.commentSectionRef} className="mb-2" /> - <CommentForm - node={res.post_view.post.id} - disabled={res.post_view.post.locked} - allLanguages={this.state.siteRes.all_languages} - siteLanguages={this.state.siteRes.discussion_languages} - containerClass="post-comment-container" - onUpsertComment={this.handleCreateComment} - finished={this.state.finished.get(0)} - /> + + {/* Only show the top level comment form if its not a context view */} + {!this.state.commentId && ( + <CommentForm + node={res.post_view.post.id} + disabled={res.post_view.post.locked} + allLanguages={this.state.siteRes.all_languages} + siteLanguages={this.state.siteRes.discussion_languages} + containerClass="post-comment-container" + onUpsertComment={this.handleCreateComment} + finished={this.state.finished.get(0)} + /> + )} <div className="d-block d-md-none"> <button className="btn btn-secondary d-inline-block mb-2 me-3" @@ -1034,13 +1038,21 @@ export class Post extends Component<any, PostState> { createAndUpdateComments(res: RequestState<CommentResponse>) { this.setState(s => { if (s.commentsRes.state === "success" && res.state === "success") { - s.commentsRes.data.comments.unshift(res.data.comment_view); + // The comment must be inserted not at the very beginning of the list, + // because the buildCommentsTree needs a correct path ordering. + // It should be inserted right after its parent is found + const comments = s.commentsRes.data.comments; + const newComment = res.data.comment_view; + const newCommentParentId = getCommentParentId(newComment.comment); + + const foundCommentParentIndex = comments.findIndex( + c => c.comment.id === newCommentParentId, + ); + + comments.splice(foundCommentParentIndex + 1, 0, newComment); // Set finished for the parent - s.finished.set( - getCommentParentId(res.data.comment_view.comment) ?? 0, - true, - ); + s.finished.set(newCommentParentId ?? 0, true); } return s; }); diff --git a/src/shared/utils/app/build-comments-tree.ts b/src/shared/utils/app/build-comments-tree.ts index 2b47e39..2ff44e0 100644 --- a/src/shared/utils/app/build-comments-tree.ts +++ b/src/shared/utils/app/build-comments-tree.ts @@ -32,6 +32,10 @@ export default function buildCommentsTree( } } + // This should not be sorted on the front end, in order to preserve the + // back end sorts. However, the parent ids must be sorted, so make sure + // When adding new comments to trees, that they're inserted right after + // their parent index. This is done in post.tsx for (const comment_view of comments) { const child = map.get(comment_view.comment.id); if (child) { -- 2.44.1