frontend-code-review

前端代码审查

意图

每当用户要求审查前端代码时（尤其是 .tsx、.ts 或 .js 文件），都使用此技能。支持两种审查模式：

1. 待提交更改审查——检查计划提交的暂存区／工作树文件，并在提交前标记违反检查清单的情况。
2. 指定文件审查——审查用户指定的文件，并报告相关的检查清单问题。

对每个适用的文件和模式，都遵循以下检查清单。

检查清单

请参阅 references/code-quality.md 和 references/performance.md，了解按类别划分的动态检查清单——将其视为应遵循的权威规则集。

为每条违规规则标注紧急程度，以便后续审查者确定修复优先级。

审查流程

1. 打开相关组件／模块。收集与类名、React Flow 钩子、属性记忆化和样式相关的代码行。
2. 对于审查要点中的每条规则，指出代码偏离规则之处，并摘录有代表性的代码片段。
3. 按照以下模板撰写审查部分。先按 紧急 标记分组，再按类别顺序（代码质量、性能、业务逻辑）排列违规项。

必需输出

调用时，回复必须严格遵循以下两个模板之一：

模板 A（存在问题）

# Code review
Found <N> urgent issues need to be fixed:

## 1 <brief description of bug>
FilePath: <path> line <line>
<relevant code snippet or pointer>


### Suggested fix
<brief description of suggested fix>

---
... (repeat for each urgent issue) ...

Found <M> suggestions for improvement:

## 1 <brief description of suggestion>
FilePath: <path> line <line>
<relevant code snippet or pointer>


### Suggested fix
<brief description of suggested fix>

---

... (repeat for each suggestion) ...

如果没有紧急问题，请省略该部分。如果没有改进建议，请省略该部分。

如果问题数量超过 10 条，请总结为“10+ 个紧急问题”或“10+ 条改进建议”，并且只输出前 10 条。

不要压缩各部分之间的空行；请按原样保留，以便于阅读。

如果使用模板 A（即存在需要修复的问题），且至少有一项问题需要修改代码，请在结构化输出后追加一个简短的后续问题，询问用户是否希望你应用建议的修复。例如：“你希望我使用‘建议的修复’部分来处理这些问题吗？”

模板 B（没有问题）

## Code review
No issues found.