improve v2 terminal drop hover animation

[saddlepaddle]

Summary

• Replace the v2 terminal drop-hover dashed border + inset overlay with a flush primary-tinted fade
• Keep the overlay mounted and toggle opacity (0 ↔ 75) so the hover state actually animates instead of popping in

Test plan

• In a v2 workspace terminal pane, drag a file over the terminal and confirm the tint fades in across the full pane (no gap at the edges, no dashed outline)
• Drag back out and confirm it fades out smoothly
• Drop a file and confirm the path is pasted into the terminal as before

---

Summary by cubic

Refines the v2 terminal drag-and-drop hover to a full-bleed primary-tinted overlay that fades in/out, replacing the dashed inset outline. The overlay stays mounted and animates opacity (0 ↔ 75) for a smooth transition instead of a pop.

^{Written for commit 534674e. Summary will update on new commits.}

Summary by CodeRabbit

• Style
  • Improved visual feedback for drag-and-drop interactions in the terminal pane with smoother opacity transitions and refined styling.

[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: 2e4b221e-d27f-4be5-9902-e62d9668e081

📥 Commits

Reviewing files that changed from the base of the PR and between 211af80 and 534674e.

📒 Files selected for processing (1)

• apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspace/$workspaceId/hooks/usePaneRegistry/components/TerminalPane/TerminalPane.tsx

---

📝 Walkthrough

Walkthrough

The TerminalPane component's drop-target overlay refactored from conditional mounting to always-rendered with dynamic opacity styling. The visual presentation changed from a dashed border to a subtle background tint with smooth opacity transitions.

Changes

Cohort / File(s)	Summary
Drop-Target Overlay Refactoring apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspace/$workspaceId/hooks/usePaneRegistry/components/TerminalPane/TerminalPane.tsx	Changed overlay from conditionally rendered to always-rendered with visibility controlled by opacity classes (opacity-0/opacity-75). Updated styling from dashed border to bg-primary/10 background with opacity transition. Added relative positioning to container.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

A rabbit hops through the UI maze, 🐰
Swapping borders for a subtle glaze,
The overlay fades with graceful ease,
Opacity dancing—smooth as cheese! ✨

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Docstring Coverage	⚠️ Warning	Docstring coverage is 0.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 clearly and concisely describes the main change: improving the v2 terminal drop-hover animation.
Description check	✅ Passed	The PR description provides a clear summary, test plan, and context. While it doesn't follow the exact template structure, it contains the essential information needed to understand and verify the changes.
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 improve-drop-hover

---

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

[greptile-apps]

Greptile Summary

This PR improves the v2 terminal drop-hover UX by replacing the conditionally-rendered dashed-border overlay with an always-mounted div that transitions between opacity-0 and opacity-75, enabling a smooth CSS fade. The outer container gains relative so the overlay now spans the full pane flush (including any status bar at the bottom), and the cn utility is introduced for conditional class composition.

Confidence Score: 5/5

Safe to merge — small, well-scoped visual change with no logic or data-flow impact.

The diff is minimal and correct: the overlay is always mounted with pointer-events-none so drag events still reach the handlers, relative is added to the outer container so inset-0 covers the full pane, and the opacity transition achieves the intended animation. No P0/P1 issues found.

No files require special attention.

Important Files Changed

Filename	Overview
apps/desktop/src/renderer/routes/_authenticated/_dashboard/v2-workspace/$workspaceId/hooks/usePaneRegistry/components/TerminalPane/TerminalPane.tsx	Replaces conditional-render dashed border overlay with an always-mounted, opacity-transitioned tint overlay; adds relative to outer container and moves the overlay to cover the full pane flush.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[User drags file over TerminalPane] --> B{isDropActive}
    B -- true --> C["overlay opacity-75\n(bg-primary/10 tinted fade)"]
    B -- false --> D["overlay opacity-0\n(invisible, always mounted)"]
    C -- drag leaves --> D
    D -- drag enters --> C
    C --> E[User drops file]
    E --> F[handleDrop\nresolveDroppedText]
    F --> G[terminalRuntimeRegistry.paste]
    G --> H[Text pasted into terminal]
    E --> D

Loading

_{Reviews (1): Last reviewed commit: "improve v2 terminal drop hover animation" | Re-trigger Greptile}

[github-actions]

🧹 Preview Cleanup Complete

The following preview resources have been cleaned up:

• ⚠️ Neon database branch

Thank you for your contribution! 🎉

[cubic-dev-ai]

No issues found across 1 file