feat(chat): add hero transition for chat input

[zhangmo8]

20260521_110145.mp4

Summary by CodeRabbit

Release Notes

• Bug Fixes
  • Refined chat input animation timing and choreography for smoother interactions
  • Improved animation state cleanup to prevent stuck or persisting animation states
  • Enhanced error recovery to ensure animations complete reliably

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: bfe03d1b-524a-41c8-a1c3-18e3d899087e

📥 Commits

Reviewing files that changed from the base of the PR and between 446564c and 7dfe29e.

📒 Files selected for processing (1)

• src/renderer/src/lib/chatInputHero.ts

---

📝 Walkthrough

Walkthrough

This PR updates the chat input hero flight animation in chatInputHero.ts with new tuning constants, automatic cleanup scheduling via setTimeout, a Promise-race-based completion helper, and reworked animation choreography that includes settle offset math, improved overlay behavior, and deterministic try/finally cleanup.

Changes

Hero Flight Animation Lifecycle

Layer / File(s)	Summary
Animation tuning constants src/renderer/src/lib/chatInputHero.ts (1–13)	Animation duration, easing, settle/overlay offsets, and cleanup grace duration are defined.
Cleanup and completion utilities src/renderer/src/lib/chatInputHero.ts (29–44)	clearPendingFlight now cancels outstanding cleanup timers before removing the clone; new waitForAnimationCompletion helper uses Promise.race to wait for Web Animations completion with a fallback timeout.
Flight preparation with cleanup scheduling src/renderer/src/lib/chatInputHero.ts (93–101)	prepareChatInputHeroFlight schedules automatic cleanup via setTimeout (duration + grace) and stores the timer ID in pendingFlight state.
Flight execution and cleanup coordination src/renderer/src/lib/chatInputHero.ts (131–133)	playChatInputHeroFlight immediately clears the scheduled cleanup timer after consuming the pending flight, preventing race conditions.
Animation choreography and lifecycle management src/renderer/src/lib/chatInputHero.ts (148–226)	Flight animation reworked to compute settle translation/scale from new offsets, updated overlay/target animations, replaced Promise.allSettled with waitForAnimationCompletion, and added try/finally cleanup that cancels animations on failure and deterministically restores source opacity and removes the clone.

Estimated Code Review Effort

🎯 4 (Complex) | ⏱️ ~45 minutes

Suggested Reviewers

• deepinfect

Poem

🐰 A flight takes wing with settle and grace,
Cleanup timers race through animation space,
Promise.race awaits the final frame,
Restore and remove—try/finally tame,
Hero animations dance without shame! ✨

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title 'feat(chat): add hero transition for chat input' clearly and concisely describes the main change—adding a hero transition animation feature for the chat input component.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ 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 chat-input-hero

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.

---

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.}

[zerob13]

amazing!