Add file editing and improved logging to OpenAI agents example

Introduces file creation, update, and deletion capabilities via a new WorkspaceEditor and applyPatchTool integration. Adds a logger utility for structured debug/info/error output throughout the backend. Refactors the UI to support persistent chat history, multi-column output, and improved message rendering. Updates dependencies to include Sandpack React for future file editing features. Improves documentation and exposes port 8080 in Dockerfile for local development.

Author: threepointone

examples/openai-agents/Dockerfile

@@ -7,3 +7,6 @@
 # On a mac, you might need to actively pick up the
 # arm64 build of the image.
 FROM --platform=linux/arm64 cloudflare/sandbox-test:0.5.0
+
+# Required during local development to access exposed ports
+EXPOSE 8080

examples/openai-agents/README.md

@@ -1,18 +1,29 @@
 # OpenAI Agents with Cloudflare Sandbox
 
-Example using OpenAI Agents to execute shell commands in a Cloudflare Sandbox.
+A conversational AI assistant that executes shell commands and edits files in a Cloudflare Sandbox.
 
 ## Setup
 
+Create a `.env` file with your OpenAI API key:
+
+```
+OPENAI_API_KEY=your-api-key-here
+```
+
+Then start the development server:
+
 ```bash
-npm install
-npm run types
 npm start
 ```
 
 ## Usage
 
-Enter natural language commands in the UI. The agent will execute shell commands in the sandbox and return the results.
+Enter natural language commands in the chat interface. The assistant can:
+
+- Execute shell commands
+- Create, edit, and delete files
+
+All conversations are saved in your browser's localStorage.
 
 ## Deploy
 

examples/openai-agents/package.json

@@ -13,6 +13,7 @@
   "license": "ISC",
   "type": "module",
   "dependencies": {
+    "@codesandbox/sandpack-react": "^2.20.0",
     "@openai/agents": "^0.3.2",
     "react": "^19.2.0",
     "react-dom": "^19.2.0"