Skip to content

fix(comments): keep expanded list after show/hide moderation#960

Merged
imaegoo merged 1 commit into
twikoojs:mainfrom
wyf027:fix/preserve-expanded-comments-on-moderation
May 28, 2026
Merged

fix(comments): keep expanded list after show/hide moderation#960
imaegoo merged 1 commit into
twikoojs:mainfrom
wyf027:fix/preserve-expanded-comments-on-moderation

Conversation

@wyf027

@wyf027 wyf027 commented May 25, 2026

Copy link
Copy Markdown
Contributor

Summary

When an admin shows/hides or tops/untops a comment from the public comment list, update that comment in place instead of reloading the entire comment list.

Problem

Fixes #527. Moderation actions emitted load, which triggered initComments and reset the list to the first page, collapsing comments the user had already expanded.

Test plan

  • Expand more comments on a page with many comments
  • Show or hide a pending comment from the inline admin controls
  • Confirm previously expanded comments stay loaded

Summary by Sourcery

Bug Fixes:

  • 在执行显示/隐藏或置顶/取消置顶等审核操作时,保留当前评论列表的状态,包括已展开的评论。
Original summary in English

Summary by Sourcery

Bug Fixes:

  • Preserve the current comment list state, including expanded comments, when performing moderation actions such as show/hide or top/untop.

Spam/top toggles on a comment emitted `load`, which re-ran
`initComments` and replaced the in-memory list with the first page only.
Update the moderated comment locally instead of reloading all comments.

Fixes #527

Co-authored-by: Cursor <cursoragent@cursor.com>
@sourcery-ai

sourcery-ai Bot commented May 25, 2026

Copy link
Copy Markdown
Contributor
审阅者指南(在小型 PR 上折叠)

审阅者指南

更新 TkComment 的审核行为,使其修改现有的评论对象,而不是触发 reload 事件,从而避免在执行审核操作后整个评论列表被重新初始化并折叠。

更新后的 TkComment 审核行为流程图

flowchart LR
  A[管理员使用行内审核控件] --> B[TkComment 接收审核结果集]
  B --> C["Object.assign(comment, set) 更新现有评论"]
  C --> D[UI 就地反映更新后的评论]
  D --> E[评论列表保持在当前页并维持展开状态]
  B -.-> F[不会触发 load 事件]
  F -.-> G[评论列表不会被重新初始化]
Loading

文件级改动

变更 详情 文件
在原位更新被审核的评论,而不是在管理员操作后重新加载评论列表。
  • 将审核更新之后触发的 load 事件替换为:将更新字段就地合并到现有的评论对象中
  • 确保组件在结束加载状态时,保留当前分页和已展开的评论
src/client/view/components/TkComment.vue

与关联问题的对照评估

问题 目标 是否解决 说明
#527 确保在执行审核操作(例如显示待审核评论)时,不会重新加载或折叠已展开的评论列表,而是只在原位更新目标评论。

提示与命令

与 Sourcery 交互

  • 触发新审查: 在 pull request 中评论 @sourcery-ai review
  • 继续讨论: 直接回复 Sourcery 的审查评论。
  • 从审查评论生成 GitHub issue: 在回复某条审查评论时让 Sourcery 从该评论创建一个 issue。你也可以回复该评论 @sourcery-ai issue 来从中创建 issue。
  • 生成 pull request 标题: 在 pull request 标题中的任意位置写入 @sourcery-ai,即可随时生成标题。你也可以在 pull request 中评论 @sourcery-ai title 来(重新)生成标题。
  • 生成 pull request 摘要: 在 pull request 正文中的任意位置写入 @sourcery-ai summary,即可在你想要的位置生成 PR 摘要。你也可以在 pull request 中评论 @sourcery-ai summary 来(重新)生成摘要。
  • 生成审阅者指南: 在 pull request 中评论 @sourcery-ai guide,即可随时(重新)生成审阅者指南。
  • 解决所有 Sourcery 评论: 在 pull request 中评论 @sourcery-ai resolve,即可标记解决所有 Sourcery 评论。如果你已经处理完所有评论且不想再看到它们,这会很有用。
  • 忽略所有 Sourcery 审查: 在 pull request 中评论 @sourcery-ai dismiss,即可忽略所有现有的 Sourcery 审查。特别适合你想从头开始一次新的审查时使用——别忘了再评论 @sourcery-ai review 来触发新的审查!

自定义你的体验

访问你的 控制面板 以:

  • 启用或禁用审查功能,例如 Sourcery 生成的 pull request 摘要、审阅者指南等。
  • 更改审查语言。
  • 添加、删除或编辑自定义审查说明。
  • 调整其他审查设置。

获取帮助

Original review guide in English
Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Updates TkComment moderation behavior to mutate the existing comment object instead of emitting a reload event, preventing the entire comment list from being reinitialized and collapsed after moderation actions.

Flow diagram for updated TkComment moderation behavior

flowchart LR
  A[Admin uses inline moderation control] --> B[TkComment receives moderation result set]
  B --> C["Object.assign(comment, set) updates existing comment"]
  C --> D[UI reflects updated comment in place]
  D --> E[Comment list stays on current page and remains expanded]
  B -.-> F[No load event emitted]
  F -.-> G[Comment list is not reinitialized]
Loading

File-Level Changes

Change Details Files
Update moderated comment in place instead of reloading the comment list after admin actions.
  • Replace the load event emission after a moderation update with an in-place merge of the updated fields into the existing comment object
  • Ensure the component stops the loading state while preserving current pagination and expanded comments
src/client/view/components/TkComment.vue

Assessment against linked issues

Issue Objective Addressed Explanation
#527 Ensure that performing moderation actions (e.g., showing a pending comment) does not reload or collapse the expanded comments list, but instead updates only the targeted comment in place.

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

@sourcery-ai sourcery-ai Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - 我在这里给出了一些高层次的反馈:

  • 直接使用 Object.assign 修改 this.comment(一个 prop)会破坏 Vue 的单向数据流;建议通过触发更新事件或使用 store/action,让父组件拥有并更新 comment 的状态。
  • 移除 load 事件的触发后,任何依赖该事件的父级监听器或后续逻辑现在都会被跳过;请确认是否仍然应该触发一个更有针对性的事件(例如 moderatedupdated),以便在就地修改之外继续保持父组件的状态同步。
给 AI Agent 的提示词
Please address the comments from this code review:

## Overall Comments
- Directly mutating `this.comment` (a prop) with `Object.assign` can break Vue’s one-way data flow; consider emitting an update event or using a store/action so the parent owns and updates the comment state.
- By removing the `load` event emission, any parent listeners or follow-up logic tied to that event are now skipped; verify whether a more targeted event (e.g., `moderated` or `updated`) should still be emitted to keep the parent in sync beyond just the in-place mutation.

Sourcery 对开源项目免费——如果你觉得我们的评审有帮助,欢迎分享 ✨
帮我变得更有用!请在每条评论上点 👍 或 👎,我会根据你的反馈改进后续的评审。
Original comment in English

Hey - I've left some high level feedback:

  • Directly mutating this.comment (a prop) with Object.assign can break Vue’s one-way data flow; consider emitting an update event or using a store/action so the parent owns and updates the comment state.
  • By removing the load event emission, any parent listeners or follow-up logic tied to that event are now skipped; verify whether a more targeted event (e.g., moderated or updated) should still be emitted to keep the parent in sync beyond just the in-place mutation.
Prompt for AI Agents
Please address the comments from this code review:

## Overall Comments
- Directly mutating `this.comment` (a prop) with `Object.assign` can break Vue’s one-way data flow; consider emitting an update event or using a store/action so the parent owns and updates the comment state.
- By removing the `load` event emission, any parent listeners or follow-up logic tied to that event are now skipped; verify whether a more targeted event (e.g., `moderated` or `updated`) should still be emitted to keep the parent in sync beyond just the in-place mutation.

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

@imaegoo imaegoo merged commit 89c5392 into twikoojs:main May 28, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

【bug】当展开更多评论后,博主对审核评论点击 [显示] 会导致展开的评论折叠

2 participants