Redesign Tabs view as device-centric card grid for multi-machine workflow#248
Redesign Tabs view as device-centric card grid for multi-machine workflow#248danshapiro wants to merge 50 commits intomainfrom
Conversation
…hints When called with unrecognized params (e.g. new-tab with url), the MCP tool now returns an error listing valid parameters. A specific hint suggests open-browser when url is passed to new-tab. Help text updated to clarify the distinction between new-tab and open-browser, with a new playbook for opening URLs.
- Remove localStorage persistence for tool strip expanded state - ToolStrip now uses local useState initialized from showTools prop - ToolBlocks inherit initial expanded state from showTools - Remove autoExpandAbove/completedToolOffset props (no longer needed) - All toggle state is session-only, resets on page refresh
Add implementation plan for making terminal URLs clickable (opening in browser panes) with right-click context menu support for open in pane, open in tab, open in browser, and copy URL. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Reviewed all source files referenced by the plan against the actual codebase and corrected several issues: - Fix ILinkHandler hover/leave signatures (need range param for OSC 8) - Add explicit wrapperRef JSX attachment instructions for outer div - Fix test file reference to canonical path (components/context-menu/) - Add useMemo dependency array update note for ContextMenuProvider - Clarify link provider registration order for priority - Note cleanup needs for both hoveredUrl map and data attribute - Add context-menu-utils.test.ts to new files list - Document picker vs direct browser pane design decision Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Remove unnecessary empty hover/leave stubs on file path links - Note pre-existing mock staleness in menu-defs.test.ts (6 missing actions) - Add docs/index.html update step per repo rules - Add timing safety note for wrapperRef in hover callbacks - Clarify ContextMenuProvider action wiring locations and imports - Add balanced parenthesis edge case for URL detection tests Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Corrects three factual errors in the implementation plan: 1. xterm.js link provider priority is first-registered=highest (not last) 2. menu-defs.test.ts does not exist yet (was incorrectly labeled "update existing") 3. Removes context-menu-constants.ts from modified files list (no changes needed) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
58 new tests across 8 files plus updates to 2 existing test files, aligned to the implementation plan's TDD phases. Covers hover state tracking, URL detection, left-click behavior, context menu integration, multi-pane integration, and browser-use E2E smoke testing. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Phase 1 of clickable terminal URLs: module-level map for tracking hovered URLs per pane, and findUrls utility for detecting http/https URLs in terminal output text. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…link provider - Left-click on OSC 8 links and detected URLs now opens a browser pane (split right) instead of window.open - Warning modal confirm also opens browser pane instead of window.open - Add hover/leave callbacks to OSC 8 linkHandler for tracking hovered URL - Register URL link provider (after file path provider) to detect plain http/https URLs in terminal output - Track hovered URL in module-level map and data-hovered-url DOM attribute - Clear hover state on terminal dispose and tab hide - Update existing link warning and keyboard tests for new behavior Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Add hoveredUrl optional field to terminal ContextTarget - Parse hoveredUrl from dataset in parseContextTarget - Add URL-specific menu items (Open in pane/tab/browser, Copy URL) to terminal context menu when hovering a URL - Add openUrlInPane, openUrlInTab, openUrlInBrowser, copyUrl actions to ContextMenuProvider - Add tests for context-menu-utils and menu-defs URL behavior Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- terminal-url-link-click: verifies URL click in nested pane opens browser pane on the correct branch (both plain URL and OSC 8 paths) - terminal-url-context-menu: verifies URL context menu items appear when hovering a URL, are absent without hover, and "Open URL in pane" creates a browser pane split Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Verifies that when a terminal tab becomes hidden, the hovered URL module state and DOM attribute are cleared. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
With the new URL link provider registered after the file path provider, the existing test mock was capturing the URL provider instead of the file path provider. Fixed by only storing the first registered provider. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
- Remove unnecessary escape in url-utils regex character class - Capture wrapperRef.current in local variable before cleanup to satisfy react-hooks/exhaustive-deps rule Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…ks, docs update - URL detection now preserves balanced parentheses (e.g. Wikipedia URLs) while still stripping unbalanced trailing parens - OSC 8 linkHandler.activate validates http/https scheme before opening browser panes; non-http schemes fall back to window.open - Added clickable URLs feature to docs/index.html feature list Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Prevents non-left-click from triggering link activation on OSC 8 links, file path links, and URL links. Adds tests for right-click and middle-click. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Align .opencode/.gitignore with upstream best practices: add plans/, package-lock.json, and .freshell-mcp-state.json. Remove the transient MCP state file from tracking. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace flat list layout with a compact card grid organized by device. Key changes: - Device-centric grouping: local tabs first, then remote by device - Compact card grid (auto-fill 220px min) with colored left borders - Right-click context menus with Jump/Pull/Open pane/Copy actions - Segmented controls for status and scope filters - Hover-to-reveal action labels on cards - Collapsible "Recently closed" section - Pane type icons with distinct colors for visual scanning - Click-to-act: click card to jump (local) or pull (remote/closed) Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Update all 4 test files to match the new device-centric card grid layout: - Tests now click tab cards directly instead of finding "Open copy" buttons - Section headings updated for device-centric grouping - New tests for: device grouping, context menus, segmented filters, pane kind icons, multi-pane context menu items - Explicit cleanup between tests to prevent DOM leakage Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: e2ad1c03e9
ℹ️ About Codex in GitHub
Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".
| <button | ||
| type="button" | ||
| onClick={handleToggle} | ||
| className="shrink-0 p-0.5 hover:bg-accent/50 rounded transition-colors" | ||
| aria-label="Toggle tool details" | ||
| > | ||
| <ChevronRight className="h-3 w-3" /> | ||
| </button> |
There was a problem hiding this comment.
Honor showTools=false by hiding expand toggle
When showTools is false, this component is documented to stay collapsed, but the collapsed row still renders a toggle button that calls handleToggle, so users can expand and view tool details anyway. In practice this makes the “Show tools” setting behave like “start collapsed” instead of “hide tools,” which is a behavior regression for callers that rely on showTools=false to suppress tool details.
Useful? React with 👍 / 👎.
Summary
Changes
src/components/TabsView.tsx— Complete rewrite with new components:SegmentedControl,TabCard,DeviceSection, plus helpers for pane kind labels/colors, relative time formatting, and device groupingtest/unit/client/components/TabsView.test.tsx— 10 tests covering device sections, card clicks, context menus, device grouping, pane icons, filterstest/unit/client/components/TabsView.ws-error.test.tsx— Updated for new component structuretest/e2e/tabs-view-flow.test.tsx— Updated card click interactiontest/e2e/tabs-view-search-range.test.tsx— Updated with clipboard mockTest plan
🤖 Generated with Claude Code