Lectures

We’ll break down how the widget sandbox in ChatGPT Apps works: why it’s not “a regular site in an iframe,” what limitations origin/sandbox/CSP impose, how to safely communicate with the host via window . openai, and why it’s better to use React hooks in the UI layer ( useWidgetProps, useWidgetState, useOpenAIGlobal) instead of poking the global object directly. We’ll also discuss the boundaries of responsibility among “widget ↔ ChatGPT ↔ MCP/server,” state storage, and common mistakes.

In this lecture we break down how to “fit” your ChatGPT App UI into chat constraints: how to read and switch displayMode (inline/fullscreen/PiP), respect the maxHeight limit without “double scroll,” sync height via notifyIntrinsicHeight (), adapt the look to the theme, and build a resilient layout for desktop/mobile.

In this lecture, we’ll break down the state map in ChatGPT Apps and hands-on practices: where to keep authoritative business data (via MCP and toolOutput), where to keep ephemeral UI (local React useState), and where you need durable state at the message level ( widgetState via useWidgetState). We’ll also discuss tool input ( toolInput), metadata ( toolResponseMetadata / _meta), “loading / empty / error” patterns, wizard steps, and common pitfalls.

We’ll break down what a follow-up is in the ChatGPT App, how a click in a widget turns into a new user message, why it’s usually better to send text via useSendMessage/ sendFollowUpMessage rather than calling a tool directly, how the “conversational sandwich” works (pre-text → widget → post-interaction), and how to synchronize widgetState with the chat history. Finally, we’ll cover principles for designing good follow-ups and common pitfalls.

How a “sandboxed widget” talks to the outside world in ChatGPT Apps: safe navigation via openExternal (and the useOpenExternal hook instead of window. open), limitations and pitfalls of window. fetch, why relative paths like "/api/..." break inside the host, and how this leads to a “thin UI—thick backend” architecture with a focus on MCP/ callTool.