[Bug]: MCP App inline frames never go below 80px, so compact apps get blank space under them

Open Beginner friendly
#35,911 0 comments 0 reactions 0 assignees View on GitHub

Maintainers usually reply within 1 day

@rafi-the-dev is already working on this.

Since Nov 14, 2026.

  • #36836 by @rafi-the-dev — closed without merging
  • #36895 by @rafi-the-dev — open

Assessment

Difficulty
2/5
Estimated time
Half a day
Newbie friendliness
68/100
Issue type
Bug
Clarity
Mostly clear
Activity status
Active
Tech stack
typescript
Domain
frontend

Research direction

Start with clampMcpAppHeight in packages/shared/src/mcpApp.ts, then inspect how McpAppFrame.tsx and mobile's mcpAppInlineHeight use the clamp. Check for related tests before changing the minimum-height behavior; done when a reported 48px height can render compact inline apps without the current 80px floor, while the default still applies before a size is reported.

Written by the indexing model from the issue text.

Description

Before submitting
  • I searched existing issues and did not find a duplicate.
  • I included enough detail to reproduce or investigate the problem.
Area

apps/web

Steps to reproduce
  1. Connect an MCP server whose tool declares an MCP App (_meta.ui.resourceUri → text/html;profile=mcp-app).
  2. Make the app render a compact single-row view (for example a one-line "receipt" of the tool call, about 40–50px tall) and report it after ui/notifications/initialized:
    { "jsonrpc": "2.0", "method": "ui/notifications/size-changed", "params": { "height": 48 } }
    
  3. Have the agent call the tool a few times in a row so several app cards stack in the timeline.
Expected behavior

The inline iframe follows the height the app reports (48px here), so a series of one-line cards stacks tightly, like normal tool-call rows.

Actual behavior

Every inline iframe is at least 80px tall. The app's content sits at the top and the rest stays blank, so each card carries roughly 30–40px of empty space under it and a run of tool calls is spread far apart.

The floor comes from clampMcpAppHeight in packages/shared/src/mcpApp.ts:

const MCP_APP_MIN_HEIGHT = 80;
export const MCP_APP_DEFAULT_HEIGHT = 320;

export function clampMcpAppHeight(height: number): number {
  if (!Number.isFinite(height)) return MCP_APP_DEFAULT_HEIGHT;
  return Math.round(Math.min(MCP_APP_MAX_HEIGHT, Math.max(MCP_APP_MIN_HEIGHT, height)));
}

McpAppFrame.tsx applies it to every size-changed (setHeight(clampMcpAppHeight(size.height))), and mobile's mcpAppInlineHeight uses the same clamp. The app has no way to get below 80px; centering the content in the frame only moves the blank space around.

A floor makes sense before the app has reported anything (the 320px default covers that). Once an app has measured itself, a small floor (or none beyond a positive height) would let compact apps render at their real size.

Impact

Cosmetic issue

Version or commit

Desktop 0.1.9; source checked at main @ 6f108e8

Environment

macOS, T3 Code desktop app 0.1.9

Workaround

None on the app side. Apps can only make their content at least 80px tall to fill the frame.

Dominant language
TypeScript
Stars
24.8k
Forks
6.4k
Avg merge
3h 40m
Merged PRs (30d)
543

Getting set up

Open in Codespaces

Starts the project's dev container in your browser, under your own GitHub account.

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from pingdotgg/t3code

All issues in pingdotgg/t3code

Similar issues

More TypeScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.