viewport -> containerDimensions

[chelojimenez]

Applies changes from PR #1148 (update-viewport-type branch) to the relocated file path. This refactoring:

• Renames viewport to containerDimensions in host context payload
• Removes viewportWidth/viewportHeight calculations (now using maxHeight/maxWidth)
• Updates mobile detection to use device type refs instead of viewport width
• Defaults to mobile-like behavior outside playground mode

Resolves file path conflict caused by directory restructure in main.

---

Note

Aligns SEP-1865 host context and display-mode behavior.

• Renames hostContext.viewport to hostContext.containerDimensions and sends only maxHeight/maxWidth
• Removes viewportWidth/viewportHeight calculations and related refs/deps
• Adds isPlaygroundActiveRef and playgroundDeviceTypeRef; updates mobile detection in onrequestdisplaymode to use device type (defaults to mobile when not in playground)
• Updates comments and debug globals to reflect containerDimensions

^{Written by Cursor Bugbot for commit bd792f3. This will update automatically on new commits. Configure here.}

[coderabbitai]

Walkthrough

This change refactors the MCP Apps host context in the thread renderer component. The derivation logic shifts from using viewport dimensions to containerDimensions for size constraints. Memoized viewport-related values are removed and replaced with container dimension dependencies. Display mode selection logic now relies on playground device type when available. Refs are introduced to cache playground state for bridge handler access. The host context shape is updated accordingly, though the component's public interface remains unchanged.

---

📜 Recent review details

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 4ad96f9 and bd792f3.

📒 Files selected for processing (1)

• mcpjam-inspector/client/src/components/chat-v2/thread/mcp-apps-renderer.tsx

🧰 Additional context used

🔍 Remote MCP

Summary: Additional Context for PR #1185 Review

Project Context

The MCPJam Inspector is the local development client for ChatGPT apps, MCP ext-apps, and MCP servers, allowing users to build and test apps with a full widget emulator, chat with any LLM, and inspect server tools and resources.

SEP-1865 and MCP Apps Specification

This PR aligns with the MCP Apps Extension (SEP-1865), which proposes standardized support for interactive user interfaces in the Model Context Protocol. The MCP Apps Extension introduces a standardized pattern for declaring UI resources, linking them to tools, and enabling bidirectional communication between embedded interfaces and the host application.

Significance of the Changes

The shift from viewport to containerDimensions appears to be part of standardizing dimension handling in the MCP Apps specification. In the OpenAI Apps SDK context, layout and host controls include requestDisplayMode, requestModal, notifyIntrinsicHeight, and openExternal to manage layout and host navigation, with context signals including theme, displayMode, maxHeight, safeArea, view, userAgent, and locale to adapt UI and copy. This suggests the PR's focus on maxHeight/maxWidth within containerDimensions is aligned with standardizing responsive layout information passed to MCP app widgets.

Related Community Work

The MCP-UI project spearheaded the vision of agentic apps with interactive interfaces, developed patterns for delivering rich user interfaces as first-class MCP resources, and is backed by a large community adopted at leading companies such as Postman, Shopify, Hugging Face, Goose, and ElevenLabs.

[::web_search::]

⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)

• GitHub Check: Cursor Bugbot

🔇 Additional comments (6)

mcpjam-inspector/client/src/components/chat-v2/thread/mcp-apps-renderer.tsx (6)

221-223: Comment accurately reflects the protocol change.

The terminology update aligns with SEP-1865's shift to containerDimensions. The internal customViewport variable remains aptly named—it describes the source of custom dimensions, distinct from the protocol payload.

---

276-284: Documentation clarifies intent.

The comment succinctly explains that maxHeight now serves as advisory information within containerDimensions rather than an enforced constraint. This transparency aids future maintainers.

---

316-322: Refs correctly capture mutable state for callback access.

The introduction of isPlaygroundActiveRef and playgroundDeviceTypeRef follows the established pattern for avoiding stale closures in bridge handlers. Properly synchronized downstream.

---

753-775: Mobile detection now derives from device type, defaulting to mobile-like behavior.

The logic pivots correctly: when outside playground mode, PIP requests gracefully degrade to fullscreen—a sensible default for unknown contexts. Within playground, device type (mobile/tablet) governs the behavior.

One consideration: this means all non-playground contexts now treat PIP as fullscreen, which may surprise desktop browser users testing outside the playground. If this is intentional (per the PR objectives), the implementation is sound.

---

577-601: Ref synchronization effect is complete.

The new refs are synced alongside their peers with matching dependencies. The pattern maintains consistency throughout the component.

---

524-571: Host context structure aligns with SEP-1865.

The containerDimensions object with maxHeight/maxWidth properties correctly replaces prior flat viewport fields, with dependencies properly included in the memoization array.

---

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