[Siutan]

Summary

Adds full drag-and-drop support for reordering terminals within and across splits, with smooth animations for open/close operations.

Changes

• Terminal pane reordering within same split - Drag terminals left/right within a split; no-op when dropped in same position
• new-group destination type - Separate a terminal from its split into its own group via "Move to own split" drop zone
• Smooth animations - Added CSS keyframe animations for terminal pane open/close/split operations
• Canvas drag image - Captures terminal canvas snapshot during drag for visual feedback
• Animated close handler - Keyboard shortcuts (Cmd+W) now trigger animated close instead of instant removal
• Tests - Added tests for same-split reorder (no-op) and new-group move operations

Files Changed

• apps/web/src/components/ChatView.tsx - Wired animated close handler for keyboard shortcuts
• apps/web/src/components/ThreadTerminalDrawer.tsx - Core drag-drop logic, animations, drop zones
• apps/web/src/index.css - Animation keyframes and utility classes
• apps/web/src/terminalStateStore.ts - new-group destination handling, same-split reorder optimization
• apps/web/src/terminalStateStore.test.ts - New test cases
• apps/web/src/types.ts - Added new-group to ThreadTerminalMoveDestination union

---

Prompt used to create functionality, UI animations implemented via Claude Code:

Implement full drag-and-drop support for terminals in the terminal drawer so users can reorder terminals in the sidebar, drag a terminal into another group to make it part of that split, drag a terminal out of a split into its own standalone split, and drag directly over terminal panes to reorder or insert into the current flat horizontal split row. Keep the current flat pane model rather than introducing nested split trees: hovering a pane should only ever mean insert before or after that pane, so pane counts behave predictably (1 -> 2, 2 -> 3, 3 -> 4). If the dragged terminal is already in the same split row, treat the interaction as a pure reorder rather than a new split, preserve the number of panes, and make adjacent no-op drops do nothing.

The visual behavior should be polished and unambiguous. Pane previews should not use a filled half-pane highlight; instead, use a consistent insertion indicator for both reorder and add-to-split actions, with no residual tint, fill, or full-pane outline that suggests a different layout action. Sidebar drag/drop should support before/after reordering, dropping onto another group header to merge into that split, and dropping onto a dedicated "move to own split" target to detach a pane from an existing split. Use good product judgment inspired by VS Code and similar IDEs: when dragging starts, show a ghosted snapshot of the terminal being dragged, and when dropped, animate it smoothly into its destination so it feels like the terminal expands naturally into the available space. Keep the behavior reliable, predictable, and aligned with the existing codebase, and ensure bun lint and bun typecheck pass.

Note

Add drag-and-drop terminal reordering and animated open/close in ThreadTerminalDrawer and route keyboard close through animated handler in ChatView.tsx

Implement terminal move destinations and animations, wire useTerminalStateStore.moveTerminal through onMoveTerminal, expose an animated close via animatedCloseRef, and add CSS keyframes for pane transitions in index.css.

📍Where to Start

Start with drag/drop and animation handlers in ThreadTerminalDrawer in ThreadTerminalDrawer.tsx.

📊 Macroscope summarized 9423326. 4 files reviewed, 2 issues evaluated, 0 issues filtered, 1 comment posted

🗂️ Filtered Issues

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: 88de76b2-30b5-4153-af1d-91a0c7ae15ad

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment

---

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

[maria-rcks]

closing this for now because it does not follow our contribution guidelines:
https://github.com/pingdotgg/t3code/blob/main/CONTRIBUTING.md

for ui changes, please include clear before/after screenshots, and a short video if the change depends on motion or interaction details.

feel free to update the pr with that context and reopen it.