refactor(frontend): extract placeholder detection utility with unit tests (follow-up to #3764) by MeloMei · Pull Request #3783 · bytedance/deer-flow · GitHub
Skip to content

refactor(frontend): extract placeholder detection utility with unit tests (follow-up to #3764)#3783

Open
MeloMei wants to merge 4 commits into
bytedance:mainfrom
MeloMei:refactor-placeholder-utility
Open

refactor(frontend): extract placeholder detection utility with unit tests (follow-up to #3764)#3783
MeloMei wants to merge 4 commits into
bytedance:mainfrom
MeloMei:refactor-placeholder-utility

Conversation

@MeloMei

@MeloMei MeloMei commented Jun 25, 2026

Copy link
Copy Markdown

Follow-up to #3764.

Summary

  • Extract the inline findSuggestionTemplatePlaceholder() function and SUGGESTION_TEMPLATE_PLACEHOLDER_PATTERN constant from input-box.tsx into a standalone core/suggestions/placeholders.ts module
  • Add 10 unit tests for the extracted utility (8 for findSuggestionTemplatePlaceholder range detection + 2 for hasUnreplacedPlaceholder boolean wrapper)
  • Replace SuggestionList's raw textareaRef prop with an onSelectPlaceholder callback for better component decoupling
  • Change toast.error to toast.warning for placeholder validation (amber vs red — it's a validation hint, not an error)

Why

#3764 introduced an inline findSuggestionTemplatePlaceholder at the top of input-box.tsx. This works fine, but:

  1. Not testable in isolation — the function lives inside a 1300-line component file. Extracting it to core/suggestions/ makes it independently unit-testable and reusable.
  2. SuggestionList receives a raw textareaRef — this couples the child to the parent's DOM ref type and leaks implementation details. A callback prop (onSelectPlaceholder) inverts control properly: the child signals intent, the parent decides how.
  3. toast.error overstates severity — an unfilled placeholder is a validation hint (user needs to act), not a system error. toast.warning communicates this better.

Changes

File Change
frontend/src/core/suggestions/placeholders.ts New: extracted module with findSuggestionTemplatePlaceholder and hasUnreplacedPlaceholder
frontend/src/components/workspace/input-box.tsx Import from extracted module, callback prop for SuggestionList, toast.warning
frontend/tests/unit/core/suggestions/placeholders.test.ts New: 10 unit tests

Test Plan

Copilot AI review requested due to automatic review settings June 25, 2026 09:58

Copilot AI 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.

Copilot was unable to review this pull request because the user who requested the review has reached their quota limit.

@github-actions github-actions Bot added area:frontend Next.js frontend under frontend/ risk:medium Medium risk: regular code changes size/M PR changes 100-300 lines labels Jun 25, 2026
@CLAassistant

CLAassistant commented Jun 25, 2026

Copy link
Copy Markdown

CLA assistant check
Thank you for your submission! We really appreciate it. Like many open source projects, we ask that you all sign our Contributor License Agreement before we can accept your contribution.
2 out of 3 committers have signed the CLA.

✅ Huixin615
✅ WillemJiang
❌ MeloMei
You have signed the CLA already but the status is still pending? Let us recheck it.

@WillemJiang

Copy link
Copy Markdown
Collaborator

@WillemJiang WillemJiang added question Further information is requested reviewing A maintainer is reviewing this PR labels Jun 25, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:frontend Next.js frontend under frontend/ question Further information is requested reviewing A maintainer is reviewing this PR risk:medium Medium risk: regular code changes size/M PR changes 100-300 lines

Projects

None yet

Development

Successfully merging this pull request may close these issues.

5 participants