### Start the Application Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Start the web application using the pnpm command. ```bash pnpm web ``` -------------------------------- ### Local GitHub App Setup URL Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Setup URL for GitHub App integration during local development. ```text http://localhost:3000/api/github/app/callback ``` -------------------------------- ### Create Environment File Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Copy the example environment file to create a local .env file for application configuration. ```bash cp apps/web/.env.example apps/web/.env ``` -------------------------------- ### Run Development Server Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Use this command to start the local development server for the web application. ```bash pnpm web # run dev server ``` -------------------------------- ### Install Dependencies Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Install project dependencies using pnpm. Ensure corepack is enabled first. ```bash corepack enable pnpm install ``` -------------------------------- ### Run Development Server Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/README.md Starts the Next.js development server. Open http://localhost:3000 in your browser to view the application. ```bash pnpm dev ``` -------------------------------- ### GitHub App Setup URL Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Setup URL for GitHub App integration. Use the production domain for deployed applications. ```text https://YOUR_DOMAIN/api/github/app/callback ``` -------------------------------- ### Tool Implementation Example Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/code-style.md Example of how to define a tool using Zod for input schema and the `tool` function. Includes options for `needsApproval` and `execute` logic. ```typescript import { tool } from "ai"; import { z } from "zod"; import { getSandbox, getApprovalContext } from "./utils"; const inputSchema = z.object({ param: z.string().describe("Description for the agent"), }); export const myTool = (options?: { needsApproval?: boolean }) => tool({ needsApproval: (args, { experimental_context }) => { const ctx = getApprovalContext(experimental_context, "myTool"); // Return true if approval needed, false otherwise return options?.needsApproval ?? true; }, description: `Tool description with USAGE, WHEN TO USE, EXAMPLES sections`, inputSchema, execute: async (args, { experimental_context }) => { const sandbox = getSandbox(experimental_context, "myTool"); // Implementation using sandbox methods return { success: true, result: "..." }; }, }); ``` -------------------------------- ### Configure GitHub App Callback URLs Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Set the Homepage, Callback, and Setup URLs for your GitHub App in its settings. ```text Homepage URL: https://YOUR_DOMAIN Callback URL: https://YOUR_DOMAIN/api/auth/callback/github Setup URL: https://YOUR_DOMAIN/api/github/app/callback ``` -------------------------------- ### Example Git Commands for Diffing Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/diff-viewer-plan.md These commands are used to retrieve different aspects of the code differences against the HEAD commit. Use `--name-status` for file status, `--stat` for per-file statistics, and the default command for the full unified diff. ```bash # Get file status git diff HEAD --name-status ``` ```bash # Get stats per file git diff HEAD --stat ``` ```bash # Get full unified diff git diff HEAD ``` -------------------------------- ### Parallelizing independent promises with Promise.all Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Shows how to refactor sequential awaits into parallel operations using Promise.all for improved performance. Independent promises are started early and awaited later. ```typescript const sessionPromise = getServerSession(); const sessionRecordPromise = getSessionById(sessionId); const session = await sessionPromise; if (!session?.user) redirect("/"); const sessionRecord = await sessionRecordPromise; // ... ownership check ... const [chat, dbMessages] = await Promise.all([ getChatByIdWithRetry(chatId, sessionId), getChatMessages(chatId), ]); ``` -------------------------------- ### Full CI Pipeline Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Execute the complete Continuous Integration pipeline, including checks, typechecking, tests, and migration checks. ```bash pnpm run ci # full CI: check, typecheck, tests, migration check ``` -------------------------------- ### Development and Quality Checks Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md Commands for running the web app, performing comprehensive CI checks, and type checking individual packages. ```bash # Development pnpm web # Run web app # Quality checks (REQUIRED after making any changes) pnpm run ci # Required: run format check, lint, typecheck, and tests turbo typecheck # Type check all packages ``` -------------------------------- ### Repository Package Structure Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Overview of the directory structure for applications and packages within the repository. ```text apps/web Next.js app, workflows, auth, chat UI packages/agent agent implementation, tools, subagents, skills packages/sandbox sandbox abstraction and Vercel sandbox integration packages/shared shared utilities ``` -------------------------------- ### Session Creation Source: https://github.com/vercel-labs/open-agents/blob/main/docs/plans/lazy-sandbox-session-creation.md Creates a new session, returning session and chat details along with the initial sandbox state. ```APIDOC ## POST /api/sessions ### Description Creates a new session. This operation is designed to be lightweight and initiates the session lifecycle. ### Method POST ### Endpoint /api/sessions ### Response #### Success Response (200) - **session** (object) - Details of the created session. - **chat** (object) - Details of the associated chat. - **sandbox** (object) - The initial state of the sandbox, typically "pending" for lazy creation. ### Response Example ```json { "session": { "id": "string", ... }, "chat": { "id": "string", ... }, "sandbox": { "state": "pending" } } ``` ``` -------------------------------- ### Core Flow Diagram Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/architecture.md Illustrates the primary data flow from the web interface to the agent and sandbox environments. ```text Web -> Agent (packages/agent) -> Sandbox (packages/sandbox) ``` -------------------------------- ### Lint and Format Check Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Execute this command to perform linting and format checks across the project. ```bash pnpm check # lint + format check ``` -------------------------------- ### Sandbox Lifecycle Workflow Logic Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/SANDBOX-LIFECYCLE.md Illustrates the timeline of a sandbox workflow run, showing sleep, wake, and hibernation events based on user activity and timeouts. ```text T=0:00 Create sandbox → start W1 (sleeps until T=1:00) T=0:30 User sends message refresh activity, hibernateAfter=1:30 T=0:45 Chat finishes refresh activity, hibernateAfter=1:45 T=1:00 W1 wakes → now < hibernateAfter(1:45) → SKIP re-compute, sleep until 1:45 T=1:45 W1 wakes now >= hibernateAfter → HIBERNATE ``` -------------------------------- ### Testing Commands Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md Commands for running all tests, specific test files, in watch mode, or with verbose output. ```bash # Testing bun test # Run all tests bun test path/to/file.test.ts # Run single test file bun test --watch # Watch mode pnpm test:verbose # Run tests with JUnit reporter streamed to stdout (useful in non-interactive shells) pnpm test:verbose path/to/file.test.ts # Same verbose output for a single test file ``` -------------------------------- ### Workspace Structure Overview Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/architecture.md Provides a high-level view of the monorepo's directory structure, outlining the purpose of each main directory. ```text apps/ web/ # Web interface packages/ agent/ # Core agent logic (@open-agents/agent) sandbox/ # Sandbox abstraction (@open-agents/sandbox) shared/ # Shared utilities (@open-agents/shared) tsconfig/ # Shared TypeScript configs ``` -------------------------------- ### Sandbox Lifecycle State Machine Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/SANDBOX-LIFECYCLE.md Visual representation of the sandbox state machine, illustrating transitions between provisioning, active, hibernating, and hibernated states based on activity and timeouts. Shows user interaction for resuming a hibernated sandbox. ```text ┌──────────────┐ │ provisioning │ └──────┬───────┘ │ sandbox created │ start workflow run ▼ ┌──────────────────────┐ ┌─────▶│ active │◀──────────────────┐ │ │ │ │ │ │ lastActivityAt = now │ │ │ │ hibernateAfter = now+I │ │ │ │ sandboxExpiresAt = T+H │ │ │ └───┬──────────┬─────────┘ │ │ │ │ │ │ user sends no activity │ │ a message for I minutes │ │ │ │ │ │ ▼ ▼ │ │ ┌──────────┐ ┌──────────────┐ ┌────────────┐ │ │ │chat route│ │ hibernating │───▶│ hibernated │ │ │ │refreshes │ │ snapshot() │ │ (paused) │──┘ │ │activity │ │ stops sandbox│ └────────────┘ │ └──────────┘ └──────────────┘ user clicks │ │ "Resume" │ │ workflow continues (restore) └───────┘ ``` -------------------------------- ### Local GitHub App Callback URL Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Callback URL for GitHub App integration during local development. ```text http://localhost:3000/api/auth/callback/github ``` -------------------------------- ### Generate Database Migration Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md Always generate a new migration file after modifying the database schema. Do not use `db:push` for anything other than local, temporary databases. ```bash pnpm --dir apps/web db:generate # Creates a new .sql migration file ``` -------------------------------- ### Sequential await calls in Server Components Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Demonstrates sequential await calls that could be parallelized. This can lead to performance issues by delaying independent operations. ```typescript const session = await getServerSession(); // 1. auth const sessionRecord = await getSessionById(sessionId); // 2. depends on nothing const chat = await getChatByIdWithRetry(chatId, sessionId); // 3. depends on sessionId only const dbMessages = await getChatMessages(chatId); // 4. depends on chatId only ``` -------------------------------- ### Linting and Formatting Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md Commands to check and fix linting and formatting issues across all files using Ultracite (oxlint + oxfmt). ```bash # Linting and formatting (Ultracite - oxlint + oxfmt, run from root) pnpm check # Lint and format check all files pnpm fix # Lint fix and format all files ``` -------------------------------- ### Optional Environment Variables Source: https://github.com/vercel-labs/open-agents/blob/main/README.md These variables configure optional features such as caching, resource profiles, and voice transcription. ```env REDIS_URL= KV_URL= OPEN_AGENTS_RESOURCE_PROFILE= VERCEL_PROJECT_PRODUCTION_URL= NEXT_PUBLIC_VERCEL_PROJECT_PRODUCTION_URL= VERCEL_SANDBOX_BASE_SNAPSHOT_ID= ELEVENLABS_API_KEY= ``` -------------------------------- ### Efficient Client-Side Mounting with useSyncExternalStore Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md This custom hook uses `useSyncExternalStore` to correctly determine client-side mounting status without causing an extra render. It returns `false` during SSR and `true` on the client. ```typescript const emptySubscribe = () => () => {}; function useHasMounted() { return useSyncExternalStore(emptySubscribe, () => true, () => false); } ``` -------------------------------- ### Diff Viewer API Route Implementation Notes Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/diff-viewer-plan.md Follow the pattern from `generate-pr/route.ts` using `connectVercelSandbox`. Parse `--stat` output for per-file stats and `--name-status` for file status. Split the full diff by file headers. ```typescript type DiffFile = { path: string; status: "added" | "modified" | "deleted" | "renamed"; additions: number; deletions: number; diff: string; // Raw unified diff for this file oldPath?: string; // For renamed files }; type DiffResponse = { files: DiffFile[]; summary: { totalFiles: number; totalAdditions: number; totalDeletions: number; }; }; ``` -------------------------------- ### Git Branch Sync Preference Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md Guidance on merging branches, preferring normal merges over rebasing when syncing with origin/main. ```bash # Branch sync preference: When bringing in `origin/main`, prefer a normal merge (`git fetch origin main` then `git merge origin/main`) instead of rebasing, unless explicitly requested otherwise. ``` -------------------------------- ### Local Vercel OAuth Callback URL Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Callback URL for Vercel OAuth integration during local development. ```text http://localhost:3000/api/auth/callback/vercel ``` -------------------------------- ### Refresh Sandbox Snapshot Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Use this command to refresh the base snapshot for the sandbox environment. ```bash pnpm sandbox:snapshot-base # refresh sandbox base snapshot ``` -------------------------------- ### Package-Specific Commands Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md How to filter commands to apply only to specific packages within the project. ```bash # Filter by package (use --filter) turbo typecheck --filter=web # Type check web app only ``` -------------------------------- ### Lint and Format Fix Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Run this command to automatically fix linting and formatting issues. ```bash pnpm fix # lint + format fix ``` -------------------------------- ### Minimum Runtime Environment Variables Source: https://github.com/vercel-labs/open-agents/blob/main/README.md These environment variables are essential for the basic operation of the application. ```env POSTGRES_URL= BETTER_AUTH_SECRET= ``` -------------------------------- ### beforeStop Hook for Sandbox State Capture Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/sandbox-state-persistence-plan.md Integrates sandbox state capture into the 'beforeStop' hook of the sandbox creation process. It captures the state and saves it to the database if any changes are detected. ```typescript const sandbox = await connectVercelSandbox({ timeout: DEFAULT_TIMEOUT, source: { ... }, hooks: { beforeStop: async (sandbox) => { if (taskId) { try { const state = await captureSandboxState(sandbox); if (state.diffContent || state.untrackedFiles.length > 0) { await createTaskDiff({ id: nanoid(), taskId, diffContent: state.diffContent, untrackedFiles: state.untrackedFiles, baseCommit: state.baseCommit, }); } } catch (error) { console.error("Failed to capture sandbox state in beforeStop:", error); } } }, }, }); ``` -------------------------------- ### Catalog Dependency Declaration Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/code-style.md Declare shared external dependencies using the `catalog:` syntax in `package.json`. ```json { "dependencies": { "ai": "catalog:", "zod": "catalog:" } } ``` -------------------------------- ### GitHub App Callback URL Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Callback URL for GitHub App integration. Use the production domain for deployed applications. ```text https://YOUR_DOMAIN/api/auth/callback/github ``` -------------------------------- ### Session Creation API Endpoint Source: https://github.com/vercel-labs/open-agents/blob/main/docs/plans/lazy-sandbox-session-creation.md Defines the structure of the response when creating a new session. The sandbox state is initially set to 'pending'. ```typescript POST /api/sessions -> { session: { id: string, ... }, chat: { id: string, ... }, sandbox: { state: "pending" } } ``` -------------------------------- ### GitHub Integration Environment Variables Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Necessary for accessing GitHub repositories, handling pushes, and processing pull requests. ```env NEXT_PUBLIC_GITHUB_CLIENT_ID= GITHUB_CLIENT_SECRET= GITHUB_APP_ID= GITHUB_APP_PRIVATE_KEY= NEXT_PUBLIC_GITHUB_APP_SLUG= GITHUB_WEBHOOK_SECRET= ``` -------------------------------- ### Integrate DiffViewer Component Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/diff-viewer-plan.md Replace the placeholder in `task-detail-content.tsx` to conditionally render the DiffViewer component based on `showDiffPanel` and `sandboxInfo`. ```tsx {showDiffPanel && sandboxInfo && ( setShowDiffPanel(false)} /> )} ``` -------------------------------- ### Vercel OAuth Environment Variables Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Required environment variables for Vercel OAuth integration. ```env NEXT_PUBLIC_VERCEL_APP_CLIENT_ID=... VERCEL_APP_CLIENT_SECRET=... ``` -------------------------------- ### Chat Execution Source: https://github.com/vercel-labs/open-agents/blob/main/docs/plans/lazy-sandbox-session-creation.md Executes a chat message within a session, optionally specifying a sandbox. The system will handle sandbox provisioning if not active. ```APIDOC ## POST /api/chat ### Description Executes a chat message. This endpoint handles message processing and ensures a sandbox is available, either by reusing an existing one or creating a new one if necessary. ### Method POST ### Endpoint /api/chat ### Parameters #### Request Body - **sessionId** (string) - Required - The ID of the session to execute the chat in. - **chatId** (string) - Required - The ID of the chat. - **messages** (array) - Required - An array of message objects. - **sandboxId** (string) - Optional - The ID of a specific sandbox to use. If omitted, the system will manage sandbox allocation. ### Request Example ```json { "sessionId": "session_abc123", "chatId": "chat_xyz789", "messages": [ { "role": "user", "content": "Hello, world!" } ], "sandboxId": "sandbox_def456" } ``` ### Response #### Success Response (200) - The response structure for chat execution is not explicitly defined in the provided text, but it would typically include updated chat state or results. ``` -------------------------------- ### Vercel OAuth Environment Variables Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Required for enabling sign-in functionality using Vercel's OAuth service. ```env NEXT_PUBLIC_VERCEL_APP_CLIENT_ID= VERCEL_APP_CLIENT_SECRET= ``` -------------------------------- ### Quoting Paths with Special Characters in Git Source: https://github.com/vercel-labs/open-agents/blob/main/CLAUDE.md Demonstrates the correct way to add files to Git when their paths contain special characters like brackets, which zsh interprets as glob patterns. ```bash # Wrong - zsh interprets [id] as a glob pattern git add apps/web/app/tasks/[id]/page.tsx # Error: no matches found: apps/web/app/tasks/[id]/page.tsx # Correct - quote the path git add "apps/web/app/tasks/[id]/page.tsx" ``` -------------------------------- ### Configure Vercel OAuth App Callback URL Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Set the callback URL for your Vercel OAuth application in Vercel project settings. ```text https://YOUR_DOMAIN/api/auth/callback/vercel ``` -------------------------------- ### Typecheck Packages Source: https://github.com/vercel-labs/open-agents/blob/main/README.md This command checks the TypeScript types across all packages in the repository. ```bash pnpm typecheck # typecheck all packages ``` -------------------------------- ### GitHub App Environment Variables Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Required environment variables for GitHub App integration. The private key can be PEM content with escaped newlines or base64-encoded. ```env NEXT_PUBLIC_GITHUB_CLIENT_ID=... # GitHub App Client ID GITHUB_CLIENT_SECRET=... # GitHub App Client Secret GITHUB_APP_ID=... GITHUB_APP_PRIVATE_KEY=... NEXT_PUBLIC_GITHUB_APP_SLUG=... GITHUB_WEBHOOK_SECRET=... ``` -------------------------------- ### Optimize Package Imports for Barrel Exports Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Configure `optimizePackageImports` in `next.config.ts` to optimize the import of multiple icons from the `lucide-react` library, preventing the entire module graph from being loaded. ```typescript import { Archive, ArchiveRestore, ArrowDown, ArrowLeft, ArrowUp, Check, Copy, ExternalLink, FolderGit2, GitCompare, GitPullRequest, Link2, Loader2, Menu, MessageSquare, Mic, Paperclip, Pencil, Plus, Share2, Square, Trash2, X, } from "lucide-react" ``` ```typescript const nextConfig: NextConfig = { experimental: { optimizePackageImports: ["lucide-react"], }, // ... }; ``` -------------------------------- ### Memoize Context Provider Value Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Wrap the context value in useMemo to prevent unnecessary re-renders of consumer components when the provider re-renders. Ensure all relevant dependencies are included in the memoization array. ```typescript const contextValue = useMemo(() => ({ session: sessionRecord, chatInfo, chat, // ... all 40 properties }), [sessionRecord, chatInfo, chat, /* ... relevant deps */]); return ( {children} ); ``` -------------------------------- ### Integrate Sandbox State Restoration on Creation Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/sandbox-state-persistence-plan.md Restores the sandbox state if a stored diff exists for the task after the sandbox is created. It retrieves the latest diff and calls the restoration function. ```typescript const sandbox = await connectVercelSandbox({ // ... config with beforeStop hook }); // Restore state if this task has a stored diff let stateRestored = false; if (taskId) { const latestDiff = await getLatestTaskDiff(taskId); if (latestDiff) { const result = await restoreSandboxState(sandbox, latestDiff); stateRestored = result.success; if (!result.success) { console.warn("Partial state restoration:", result.error); } } } return Response.json({ sandboxId: sandbox.id, createdAt: Date.now(), timeout: DEFAULT_TIMEOUT, currentBranch: sandbox.currentBranch, stateRestored, // inform client }); ``` -------------------------------- ### Memoize Complex Computations with useMemo Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Complex IIFEs that compute object literals should be wrapped in `useMemo` to prevent re-execution on every render. This ensures the computation only runs when its dependencies change. ```typescript const sandboxUiStatus = useMemo(() => { if (isArchived) return { label: "Archived", ... }; // ... }, [isArchived, isCreatingSandbox, isRestoringSnapshot, /* ... */]); ``` -------------------------------- ### Use next/dynamic for Lazy Loading Components Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Apply `next/dynamic` with `{ ssr: false }` for components that are only needed on the client-side, such as modal dialogs, to prevent them from being eagerly bundled. ```typescript const DiffViewer = dynamic( () => import("./diff-viewer").then(m => m.DiffViewer), { ssr: false } ); const CreatePRDialog = dynamic( () => import("@/components/create-pr-dialog").then(m => m.CreatePRDialog), { ssr: false } ); ``` -------------------------------- ### Optimize Effect Dependencies Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/react-best-practices-audit.md Avoid triggering effects too frequently by carefully selecting dependencies. In this case, changing `messages` on every token caused an effect to fire excessively. Consider using a more targeted dependency like `messages.length` or debouncing. ```typescript useEffect(() => { if (isAtBottom) { scrollToBottom(); } }, [messages, isAtBottom, scrollToBottom]); ``` -------------------------------- ### Icon Container Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/design-system.md A simple bordered container for displaying icons. Provides basic styling for size, border, and background. ```tsx
``` -------------------------------- ### Workspace Dependency Declaration Source: https://github.com/vercel-labs/open-agents/blob/main/docs/agents/code-style.md Declare internal package dependencies using the `workspace:*` syntax in `package.json`. ```json { "dependencies": { "@open-agents/sandbox": "workspace:*" } } ``` -------------------------------- ### Add Button to Open Diff Panel Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/diff-viewer-plan.md Add a button to the header actions in `task-detail-content.tsx` to toggle the visibility of the diff panel. ```tsx ``` -------------------------------- ### Generate Session Signing Secret Source: https://github.com/vercel-labs/open-agents/blob/main/README.md Generates a secure random base64 string for the BETTER_AUTH_SECRET. ```bash openssl rand -base64 32 # BETTER_AUTH_SECRET ``` -------------------------------- ### Sandbox State Capture Function Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/sandbox-state-persistence-plan.md Function to capture the current state of a sandbox, including Git diffs and untracked files. It reads tracked file changes and untracked files, encoding untracked file content in base64. ```typescript export async function captureSandboxState(sandbox: Sandbox): Promise<{ diffContent: string; untrackedFiles: Array<{ path: string; content: string }>; baseCommit: string; }> ``` -------------------------------- ### Database Schema for Task Diffs Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/sandbox-state-persistence-plan.md Defines the 'task_diffs' table schema for storing Git diffs and untracked file information. Requires a new database migration. ```typescript export const taskDiffs = pgTable("task_diffs", { id: text("id").primaryKey(), taskId: text("task_id") .notNull() .references(() => tasks.id, { onDelete: "cascade" }), diffContent: text("diff_content").notNull(), // git diff HEAD output untrackedFiles: jsonb("untracked_files"), // Array<{path, content (base64ഗ്രഹ)}> baseCommit: text("base_commit"), // SHA for validation createdAt: timestamp("created_at").defaultNow().notNull(), }); ``` -------------------------------- ### Animated Command Prompt Source: https://github.com/vercel-labs/open-agents/blob/main/apps/web/docs/design-system.md Displays an animated terminal prompt with a blinking cursor and status messages. Uses Tailwind CSS for styling and animation. ```tsx
$ openharness auth login
! Authentication required
```