[qdaxb]

Summary

Fixes the Wework model selector so desktop popovers render above workspace panels and the reasoning slider supports dragging.

What changed

• Render the desktop model selector menu through a body portal with fixed positioning and a semantic global z-index layer.
• Preserve outside-click behavior for the portal-rendered menu.
• Add pointer drag handling for the reasoning slider, mapping drag position to the nearest option while keeping the menu open after drag end.
• Add coverage for portal placement and reasoning slider dragging.

Why

The desktop selector menu was rendered inside the composer stacking context, so nested menus could be clipped or covered by workspace panels. The reasoning slider only supported clicking specific handles, which made the slider feel broken for drag interactions.

Validation

• pnpm --dir wework exec vitest run src/components/chat/ChatInput.test.tsx src/test/theme-token-guard.test.ts
• pnpm --dir wework exec eslint src/components/chat/composer/ModelSelector.tsx src/components/chat/ChatInput.test.tsx
• Pre-push hook: ESLint, TypeScript, and unit tests passed

Summary by CodeRabbit

• New Features

  • Desktop model menus now open in a fixed overlay layer and render consistently above the chat interface.
  • The reasoning selector now supports drag-and-drop interaction for quicker option changes.

• Bug Fixes

  • Improved desktop menu behavior so clicks outside the menu close it reliably.
  • Updated menu positioning to stay properly aligned on desktop.
  • Refined slider interactions to avoid accidental selections after dragging.

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: 9067e8c8-eb4d-4dc8-a563-3d30d6a522a9

📥 Commits

Reviewing files that changed from the base of the PR and between e2a66f2 and 9896c0a.

📒 Files selected for processing (2)

• wework/src/components/chat/ChatInput.test.tsx
• wework/src/components/chat/composer/ModelSelector.tsx

---

📝 Walkthrough

Walkthrough

The desktop model selector menu now renders via a portal into document.body with fixed positioning computed from refs, replacing container-relative absolute positioning and the useOutsideClick helper with a pointerdown listener. The reasoning slider gains pointer-drag interaction with threshold-based selection. Tests were updated accordingly.

Changes

ModelSelector Desktop Menu and Reasoning Slider

Layer / File(s)	Summary
Desktop menu portal rendering and dismissal wework/src/components/chat/composer/ModelSelector.tsx, wework/src/components/chat/ChatInput.test.tsx	Desktop menu layout state/refs are introduced, menu width/left clamping is recalculated from panel bounds, the menu renders via createPortal into document.body with fixed positioning, outside-click dismissal switches from useOutsideClick to a document pointerdown listener, and tests assert the fixed popover layer and body mounting.
Reasoning slider pointer-drag selection wework/src/components/chat/composer/ModelSelector.tsx, wework/src/components/chat/ChatInput.test.tsx	New constants, refs, and selectReasoningOptionFromClientX implement pointer-based drag selection on the reasoning slider with click suppression after drag, wired to onPointerDown/Move/Up/Cancel handlers and marker className updates, validated by a new drag test.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Sequence Diagram(s)

sequenceDiagram
  participant User
  participant ModelSelector
  participant DocumentBody

  User->>ModelSelector: click model selector button
  ModelSelector->>ModelSelector: updateDesktopMenuLayout
  ModelSelector->>DocumentBody: createPortal renders fixed menu
  User->>DocumentBody: pointerdown outside menu
  DocumentBody->>ModelSelector: pointerdown event bubble
  ModelSelector->>ModelSelector: closeMenu if target outside refs

  User->>ModelSelector: pointerdown on reasoning slider track
  ModelSelector->>ModelSelector: start drag, record startX
  User->>ModelSelector: pointermove
  ModelSelector->>ModelSelector: selectReasoningOptionFromClientX
  User->>ModelSelector: pointerup
  ModelSelector->>ModelSelector: setSelectedModelOption, suppress click

Loading

✨ 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 agent/fix-wework-model-selector

---

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