feat(app): hint slash commands in prompt placeholder

[Astro-Han]

Summary

Update the home composer placeholder so it lists all three inline affordances: type a task, @ to mention files, / to invoke commands. Both English and Chinese copy updated.

Why

The previous placeholder only hinted at @ mentions. Non-technical users had no way to discover that / opens a command popover from within the input box. / is the only entry point that inserts a command pill into the current task (Cmd+Shift+P opens the global palette, a different browse-and-execute model).

Related Issue

Closes #826.

Human Review Status

Pending

Review Focus

• Copy fits in the input bar at default desktop width without truncation or wrapping. Verified via the new prompt-placeholder snap target for both English and Chinese (see screenshot below).
• Test coverage for placeholder copy is now content-asserting, not just key-routing.

Risk Notes

None. Pure copy change in two locales plus a non-blocking snap target. No layout, logic, or behavior change.

How To Verify

bun --cwd packages/app run typecheck            : tsgo -b ok, no errors
bun --cwd packages/app test                      : 1460 pass, 0 fail
bun --cwd packages/app run snap prompt-placeholder (PORT 3175): grid generated, en + zh both fit, no truncation

Screenshots or Recordings

Checklist

• Type label — this PR carries exactly one of bug, enhancement, task, documentation. Type labels are author-added; the labeler bot does NOT assign them. Add the label in the GitHub UI, then tick this.
• Routing labels — this PR carries at least one of app, ui, platform, harness, ci. The labeler bot assigns these on PR open based on changed paths. Confirm the bot's choice (or override if wrong), then tick this.
• Priority label — this PR carries exactly one of P0, P1, P2, P3. The priority-triage bot suggests one on PR open. Confirm or override, then tick this.
• Human Review Status above is set to Pending, Approved by @<reviewer>, or Not required: <reason> (default is Pending; "not required" is restricted to bot-authored low-risk PRs).
• I linked the related issue, or stated in Summary why there is no issue.
• I described the review focus and any meaningful risks.
• I replaced the example block in How To Verify with the real verification steps and the key result for each.
• I did not introduce unrelated refactors, dependencies, generated files, or file changes beyond the stated scope.
• (conditional) I manually checked visible UI or copy changes when needed, with screenshots or recordings. Leave unticked only if no visible UI or copy changed.
• (conditional) I considered macOS and Windows impact for platform, packaging, updater, signing, paths, shell, or permissions changes. Leave unticked only if no platform/packaging surface was touched.
• (conditional) I called out docs, release notes, dependencies, permissions, credentials, deletion behavior, generated content, or local file changes when relevant. Leave unticked only if none of those surfaces was touched.
• I reviewed the final diff for unrelated changes and suspicious dependency changes.
• I am targeting dev, and my PR title and commit messages use Conventional Commits in English.

Summary by CodeRabbit

• Documentation

  • Updated the home prompt placeholder text in English and Chinese to explicitly guide users on using @ to mention files and / to trigger commands.

• Tests

  • Added visual regression tests for prompt placeholder across different locales and viewport sizes.
  • Added unit tests validating placeholder text content in both languages.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 55179495-bbfb-4be1-82b3-cf28826f058a

📥 Commits

Reviewing files that changed from the base of the PR and between 7d020ba and dbfb7aa.

📒 Files selected for processing (5)

• packages/app/e2e/onboarding/home-suggestion-chips.spec.ts
• packages/app/e2e/snap/prompt-placeholder.snap.ts
• packages/app/src/components/prompt-input/placeholder.test.ts
• packages/app/src/i18n/en.ts
• packages/app/src/i18n/zh.ts

---

📝 Walkthrough

Walkthrough

The PR extends the home prompt placeholder text to hint at both file-mention (@) and command-invoke (/) affordances in English and Chinese, then adds unit tests, updates e2e aria-label assertions, and introduces a new snapshot test to validate the copy and visual rendering across locales and viewport widths.

Changes

Home Prompt Placeholder Copy and Validation

Layer / File(s)	Summary
Home placeholder copy updates packages/app/src/i18n/en.ts, packages/app/src/i18n/zh.ts	prompt.placeholder.home strings updated to explicitly mention using @ to mention files and / to invoke commands, in both English and Chinese.
Unit test coverage for placeholder copy packages/app/src/components/prompt-input/placeholder.test.ts	New test suite added that imports English and Chinese i18n dictionaries and validates both home placeholder strings contain the @ and / affordance hints.
E2E test assertion updates packages/app/e2e/onboarding/home-suggestion-chips.spec.ts	Updated the locale-specific aria-label assertions for the composer placeholder to match the expanded copy including both @ mention and / command guidance.
Visual regression snapshot test packages/app/e2e/snap/prompt-placeholder.snap.ts	New snapshot test added that captures six screenshots across English/Chinese and standard/narrow viewport widths (including right-panel variants), with helpers for panel interaction and locale switching via localStorage, then composes a grid image for regression validation.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• Astro-Han/pawwork#657: Expands the home composer prompt.placeholder.home copy and aria-label assertions to include both @ files and / commands, directly tied to refactoring the prompt-input placeholder generation pipeline.
• Astro-Han/pawwork#180: Updates prompt.placeholder.home i18n copy and e2e/unit expectations for the composer's home placeholder, related to PromptInput placeholder logic tied to selected skill context.

Poem

🐰 A slash command hint! So clever, so true,
The prompt now whispers: "Use @ and / too!"
From tests to snapshots, both tongues now aligned,
Let users discover the features designed. ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 50.00% which is insufficient. The required threshold is 80.00%.	Write docstrings for the functions missing them to satisfy the coverage threshold.

✅ Passed checks (4 passed)

Check name	Status	Explanation
Title check	✅ Passed	The title 'feat(app): hint slash commands in prompt placeholder' clearly and concisely describes the main change: adding hints about slash commands to the prompt placeholder.
Description check	✅ Passed	The PR description is comprehensive and complete, covering summary, rationale, related issue, human review status, review focus, risk notes, verification steps, and screenshots, with most checklist items ticked.
Linked Issues check	✅ Passed	All coding requirements from issue #826 are met: both prompt.placeholder.home strings updated in en.ts and zh.ts to mention @ and /, tests extended to cover the updated copy, and no layout/button changes introduced.
Out of Scope Changes check	✅ Passed	All changes are directly scoped to the linked issue: i18n strings, placeholder test updates, e2e test updates, and a new snapshot test—no unrelated refactors, dependencies, or out-of-scope modifications present.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/prompt-placeholder-slash-hint

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[github-actions]

Suggested priority: P2 (includes user-path files (packages/app/src/components/prompt-input/placeholder.test.ts, packages/app/src/i18n/en.ts, packages/app/src/i18n/zh.ts)).

P1/P0 are reserved for maintainer confirmation. Please relabel manually if this is a release blocker, security issue, data-loss risk, or updater/runtime failure.

[gemini-code-assist]

Code Review

This pull request updates the home prompt placeholder to include a hint for the / command in English and Chinese, supported by new unit tests and an E2E snapshot test. The review feedback recommends adding responsive test cases for smaller breakpoints to verify text visibility, reducing the E2E test timeout to a more standard value, and ensuring all supported locales are updated for feature parity.

[github-actions]

Perf delta summary

Comparator: fail

Profile / Scenario	interaction median	interaction worst	long task max	tbt	frame gap p95	frame gap max	jank count	cls	status
default / homepage-cold	24 -> 24 (0)	40 -> 72 (+32)	71 -> 68 (-3)	21 -> 18 (-3)	16.8 -> 16.8 (0)	116.6 -> 100 (-16.6)	3 -> 4 (+1)	0 -> 0 (0)	pass
default / long-session-input-lag	48 -> 48 (0)	48 -> 64 (+16)	0 -> 0 (0)	0 -> 0 (0)	16.8 -> 16.7 (-0.1)	16.8 -> 16.8 (0)	0 -> 0 (0)	0 -> 0 (0)	pass
default / session-streaming-long	64 -> 48 (-16)	64 -> 64 (0)	111 -> 0 (-111)	61 -> 0 (-61)	33.3 -> 16.8 (-16.5)	116.6 -> 16.8 (-99.8)	1 -> 0 (-1)	0 -> 0 (0)	pass
default / tool-call-expand	16 -> 24 (+8)	24 -> 24 (0)	0 -> 0 (0)	0 -> 0 (0)	16.7 -> 16.7 (0)	16.7 -> 16.7 (0)	0 -> 0 (0)	0 -> 0 (0)	pass
default / tool-default-open-heavy-bash	32 -> 24 (-8)	40 -> 32 (-8)	66 -> 60 (-6)	16 -> 10 (-6)	50 -> 50.1 (+0.1)	150 -> 133.4 (-16.6)	1 -> 4 (+3)	0 -> 0 (0)	fail: jank_count_50ms
default / terminal-side-panel-open	48 -> 64 (+16)	48 -> 64 (+16)	0 -> 0 (0)	0 -> 0 (0)	33.3 -> 33.3 (0)	33.3 -> 33.4 (+0.1)	0 -> 0 (0)	0 -> 0 (0)	fail: interaction_ms_median
default / session-scroll-reading	32 -> 32 (0)	48 -> 32 (-16)	0 -> 0 (0)	0 -> 0 (0)	33.2 -> 33.4 (+0.2)	33.2 -> 33.4 (+0.2)	0 -> 0 (0)	0 -> 0 (0)	pass
low-end / session-scroll-reading-long	80 -> 88 (+8)	96 -> 96 (0)	140 -> 155 (+15)	214 -> 229 (+15)	33.4 -> 33.4 (0)	166.6 -> 150 (-16.6)	7 -> 6 (-1)	0.011 -> 0.011 (0)	pass
low-end / session-timeline-recompute	192 -> 208 (+16)	240 -> 216 (-24)	185 -> 195 (+10)	379 -> 397 (+18)	150.1 -> 166.7 (+16.6)	183.3 -> 183.3 (0)	4 -> 4 (0)	0.474 -> 0.474 (0)	pass
low-end / concurrent-shimmer-extreme	0 -> 0 (0)	0 -> 0 (0)	0 -> 0 (0)	0 -> 0 (0)	16.7 -> 16.7 (0)	16.8 -> 33.3 (+16.5)	0 -> 0 (0)	0 -> 0 (0)	pass