From 4064e1e7168ae7510be83fa12d363414fe4f7278 Mon Sep 17 00:00:00 2001 From: Aaron Styles Date: Thu, 15 Jan 2026 18:41:01 +1100 Subject: [PATCH] Rejigged the structure --- README.md | 10 ++ agent/.dockerignore | 9 ++ .gitignore => agent/.gitignore | 0 .python-version => agent/.python-version | 0 agent/Dockerfile | 15 +++ agent/README.md | 0 main.py => agent/main.py | 0 pyproject.toml => agent/pyproject.toml | 0 uv.lock => agent/uv.lock | 0 docker-compose.yml | 20 +++ react-site/.dockerignore | 3 + react-site/.gitignore | 34 ++++++ react-site/CLAUDE.md | 106 ++++++++++++++++ react-site/Dockerfile | 20 +++ react-site/README.md | 21 ++++ react-site/build.ts | 149 +++++++++++++++++++++++ react-site/bun-env.d.ts | 17 +++ react-site/bun.lock | 69 +++++++++++ react-site/bunfig.toml | 4 + react-site/package.json | 22 ++++ react-site/src/APITester.tsx | 63 ++++++++++ react-site/src/App.tsx | 32 +++++ react-site/src/frontend.tsx | 20 +++ react-site/src/index.css | 50 ++++++++ react-site/src/index.html | 13 ++ react-site/src/index.ts | 41 +++++++ react-site/src/logo.svg | 1 + react-site/src/react.svg | 8 ++ react-site/tsconfig.json | 36 ++++++ 29 files changed, 763 insertions(+) create mode 100644 agent/.dockerignore rename .gitignore => agent/.gitignore (100%) rename .python-version => agent/.python-version (100%) create mode 100644 agent/Dockerfile create mode 100644 agent/README.md rename main.py => agent/main.py (100%) rename pyproject.toml => agent/pyproject.toml (100%) rename uv.lock => agent/uv.lock (100%) create mode 100644 docker-compose.yml create mode 100644 react-site/.dockerignore create mode 100644 react-site/.gitignore create mode 100644 react-site/CLAUDE.md create mode 100644 react-site/Dockerfile create mode 100644 react-site/README.md create mode 100644 react-site/build.ts create mode 100644 react-site/bun-env.d.ts create mode 100644 react-site/bun.lock create mode 100644 react-site/bunfig.toml create mode 100644 react-site/package.json create mode 100644 react-site/src/APITester.tsx create mode 100644 react-site/src/App.tsx create mode 100644 react-site/src/frontend.tsx create mode 100644 react-site/src/index.css create mode 100644 react-site/src/index.html create mode 100644 react-site/src/index.ts create mode 100644 react-site/src/logo.svg create mode 100644 react-site/src/react.svg create mode 100644 react-site/tsconfig.json diff --git a/README.md b/README.md index e69de29..c22c3e9 100644 --- a/README.md +++ b/README.md @@ -0,0 +1,10 @@ +# Incremental Agent + +Incremental Agent is a little attempt to build an AI agent that can create a website incrementally; inspired by the Ralph Wiggum addon for Claude Code. + +## Features + +- Incremental, iterative website development +- Uses AI to generate and refine code, add libraries, and enhance functionality, all self determined +- Simple and easy to use + diff --git a/agent/.dockerignore b/agent/.dockerignore new file mode 100644 index 0000000..70a08a9 --- /dev/null +++ b/agent/.dockerignore @@ -0,0 +1,9 @@ +__pycache__ +*.pyc +.git +.env +.venv +.pytest_cache +*.egg-info +dist +build \ No newline at end of file diff --git a/.gitignore b/agent/.gitignore similarity index 100% rename from .gitignore rename to agent/.gitignore diff --git a/.python-version b/agent/.python-version similarity index 100% rename from .python-version rename to agent/.python-version diff --git a/agent/Dockerfile b/agent/Dockerfile new file mode 100644 index 0000000..ca518e6 --- /dev/null +++ b/agent/Dockerfile @@ -0,0 +1,15 @@ +FROM oven/bun:latest + +WORKDIR /app + +# Copy package files +COPY package.json bun.lockb* ./ + +# Install dependencies +RUN bun install + +# Expose port +EXPOSE 3000 + +# Command will be overridden by docker-compose +CMD ["bun", "dev"] \ No newline at end of file diff --git a/agent/README.md b/agent/README.md new file mode 100644 index 0000000..e69de29 diff --git a/main.py b/agent/main.py similarity index 100% rename from main.py rename to agent/main.py diff --git a/pyproject.toml b/agent/pyproject.toml similarity index 100% rename from pyproject.toml rename to agent/pyproject.toml diff --git a/uv.lock b/agent/uv.lock similarity index 100% rename from uv.lock rename to agent/uv.lock diff --git a/docker-compose.yml b/docker-compose.yml new file mode 100644 index 0000000..4ba3504 --- /dev/null +++ b/docker-compose.yml @@ -0,0 +1,20 @@ +version: '3.8' +services: + reactjs: + build: ./react-site + volumes: + - ./react-site:/app + - /app/node_modules # prevent overwriting + ports: + - "3000:3000" + working_dir: /app + command: bun dev + + agent: + build: ./agent + volumes: + - ./react-site:/workspace/react-site # same mount + - /var/run/docker.sock:/var/run/docker.sock # for docker commands + environment: + - REACTJS_CONTAINER=reactjs + working_dir: /app \ No newline at end of file diff --git a/react-site/.dockerignore b/react-site/.dockerignore new file mode 100644 index 0000000..826824d --- /dev/null +++ b/react-site/.dockerignore @@ -0,0 +1,3 @@ +node_modules +.git +dist \ No newline at end of file diff --git a/react-site/.gitignore b/react-site/.gitignore new file mode 100644 index 0000000..a14702c --- /dev/null +++ b/react-site/.gitignore @@ -0,0 +1,34 @@ +# dependencies (bun install) +node_modules + +# output +out +dist +*.tgz + +# code coverage +coverage +*.lcov + +# logs +logs +_.log +report.[0-9]_.[0-9]_.[0-9]_.[0-9]_.json + +# dotenv environment variable files +.env +.env.development.local +.env.test.local +.env.production.local +.env.local + +# caches +.eslintcache +.cache +*.tsbuildinfo + +# IntelliJ based IDEs +.idea + +# Finder (MacOS) folder config +.DS_Store diff --git a/react-site/CLAUDE.md b/react-site/CLAUDE.md new file mode 100644 index 0000000..764c1dd --- /dev/null +++ b/react-site/CLAUDE.md @@ -0,0 +1,106 @@ + +Default to using Bun instead of Node.js. + +- Use `bun ` instead of `node ` or `ts-node ` +- Use `bun test` instead of `jest` or `vitest` +- Use `bun build ` instead of `webpack` or `esbuild` +- Use `bun install` instead of `npm install` or `yarn install` or `pnpm install` +- Use `bun run + + +``` + +With the following `frontend.tsx`: + +```tsx#frontend.tsx +import React from "react"; +import { createRoot } from "react-dom/client"; + +// import .css files directly and it works +import './index.css'; + +const root = createRoot(document.body); + +export default function Frontend() { + return

Hello, world!

; +} + +root.render(); +``` + +Then, run index.ts + +```sh +bun --hot ./index.ts +``` + +For more information, read the Bun API docs in `node_modules/bun-types/docs/**.mdx`. diff --git a/react-site/Dockerfile b/react-site/Dockerfile new file mode 100644 index 0000000..e11d46c --- /dev/null +++ b/react-site/Dockerfile @@ -0,0 +1,20 @@ +FROM ghcr.io/astral-sh/uv:python3.13-bookworm-slim + +WORKDIR /app + +# Install docker CLI (needed for docker exec commands) +RUN apt-get update && \ + apt-get install -y docker.io && \ + rm -rf /var/lib/apt/lists/* + +# Copy dependency files +COPY pyproject.toml uv.lock* ./ + +# Install dependencies +RUN uv sync --frozen --no-dev + +# Copy agent code +COPY . . + +# Use uv to run the application +CMD ["uv", "run", "agent.py"] \ No newline at end of file diff --git a/react-site/README.md b/react-site/README.md new file mode 100644 index 0000000..249dedf --- /dev/null +++ b/react-site/README.md @@ -0,0 +1,21 @@ +# bun-react-tailwind-template + +To install dependencies: + +```bash +bun install +``` + +To start a development server: + +```bash +bun dev +``` + +To run for production: + +```bash +bun start +``` + +This project was created using `bun init` in bun v1.3.4. [Bun](https://bun.com) is a fast all-in-one JavaScript runtime. diff --git a/react-site/build.ts b/react-site/build.ts new file mode 100644 index 0000000..f3c5cd4 --- /dev/null +++ b/react-site/build.ts @@ -0,0 +1,149 @@ +#!/usr/bin/env bun +import plugin from "bun-plugin-tailwind"; +import { existsSync } from "fs"; +import { rm } from "fs/promises"; +import path from "path"; + +if (process.argv.includes("--help") || process.argv.includes("-h")) { + console.log(` +šŸ—ļø Bun Build Script + +Usage: bun run build.ts [options] + +Common Options: + --outdir Output directory (default: "dist") + --minify Enable minification (or --minify.whitespace, --minify.syntax, etc) + --sourcemap Sourcemap type: none|linked|inline|external + --target Build target: browser|bun|node + --format Output format: esm|cjs|iife + --splitting Enable code splitting + --packages Package handling: bundle|external + --public-path Public path for assets + --env Environment handling: inline|disable|prefix* + --conditions Package.json export conditions (comma separated) + --external External packages (comma separated) + --banner Add banner text to output + --footer Add footer text to output + --define Define global constants (e.g. --define.VERSION=1.0.0) + --help, -h Show this help message + +Example: + bun run build.ts --outdir=dist --minify --sourcemap=linked --external=react,react-dom +`); + process.exit(0); +} + +const toCamelCase = (str: string): string => str.replace(/-([a-z])/g, g => g[1].toUpperCase()); + +const parseValue = (value: string): any => { + if (value === "true") return true; + if (value === "false") return false; + + if (/^\d+$/.test(value)) return parseInt(value, 10); + if (/^\d*\.\d+$/.test(value)) return parseFloat(value); + + if (value.includes(",")) return value.split(",").map(v => v.trim()); + + return value; +}; + +function parseArgs(): Partial { + const config: Partial = {}; + const args = process.argv.slice(2); + + for (let i = 0; i < args.length; i++) { + const arg = args[i]; + if (arg === undefined) continue; + if (!arg.startsWith("--")) continue; + + if (arg.startsWith("--no-")) { + const key = toCamelCase(arg.slice(5)); + config[key] = false; + continue; + } + + if (!arg.includes("=") && (i === args.length - 1 || args[i + 1]?.startsWith("--"))) { + const key = toCamelCase(arg.slice(2)); + config[key] = true; + continue; + } + + let key: string; + let value: string; + + if (arg.includes("=")) { + [key, value] = arg.slice(2).split("=", 2) as [string, string]; + } else { + key = arg.slice(2); + value = args[++i] ?? ""; + } + + key = toCamelCase(key); + + if (key.includes(".")) { + const [parentKey, childKey] = key.split("."); + config[parentKey] = config[parentKey] || {}; + config[parentKey][childKey] = parseValue(value); + } else { + config[key] = parseValue(value); + } + } + + return config; +} + +const formatFileSize = (bytes: number): string => { + const units = ["B", "KB", "MB", "GB"]; + let size = bytes; + let unitIndex = 0; + + while (size >= 1024 && unitIndex < units.length - 1) { + size /= 1024; + unitIndex++; + } + + return `${size.toFixed(2)} ${units[unitIndex]}`; +}; + +console.log("\nšŸš€ Starting build process...\n"); + +const cliConfig = parseArgs(); +const outdir = cliConfig.outdir || path.join(process.cwd(), "dist"); + +if (existsSync(outdir)) { + console.log(`šŸ—‘ļø Cleaning previous build at ${outdir}`); + await rm(outdir, { recursive: true, force: true }); +} + +const start = performance.now(); + +const entrypoints = [...new Bun.Glob("**.html").scanSync("src")] + .map(a => path.resolve("src", a)) + .filter(dir => !dir.includes("node_modules")); +console.log(`šŸ“„ Found ${entrypoints.length} HTML ${entrypoints.length === 1 ? "file" : "files"} to process\n`); + +const result = await Bun.build({ + entrypoints, + outdir, + plugins: [plugin], + minify: true, + target: "browser", + sourcemap: "linked", + define: { + "process.env.NODE_ENV": JSON.stringify("production"), + }, + ...cliConfig, +}); + +const end = performance.now(); + +const outputTable = result.outputs.map(output => ({ + File: path.relative(process.cwd(), output.path), + Type: output.kind, + Size: formatFileSize(output.size), +})); + +console.table(outputTable); +const buildTime = (end - start).toFixed(2); + +console.log(`\nāœ… Build completed in ${buildTime}ms\n`); diff --git a/react-site/bun-env.d.ts b/react-site/bun-env.d.ts new file mode 100644 index 0000000..72f1c26 --- /dev/null +++ b/react-site/bun-env.d.ts @@ -0,0 +1,17 @@ +// Generated by `bun init` + +declare module "*.svg" { + /** + * A path to the SVG file + */ + const path: `${string}.svg`; + export = path; +} + +declare module "*.module.css" { + /** + * A record of class names to their corresponding CSS module classes + */ + const classes: { readonly [key: string]: string }; + export = classes; +} diff --git a/react-site/bun.lock b/react-site/bun.lock new file mode 100644 index 0000000..dc13b46 --- /dev/null +++ b/react-site/bun.lock @@ -0,0 +1,69 @@ +{ + "lockfileVersion": 1, + "configVersion": 1, + "workspaces": { + "": { + "name": "bun-react-template", + "dependencies": { + "bun-plugin-tailwind": "^0.1.2", + "react": "^19.2.3", + "react-dom": "^19.2.3", + "tailwindcss": "^4.1.18", + }, + "devDependencies": { + "@types/bun": "^1.3.6", + "@types/react": "^19.2.8", + "@types/react-dom": "^19.2.3", + }, + }, + }, + "packages": { + "@oven/bun-darwin-aarch64": ["@oven/bun-darwin-aarch64@1.3.6", "", { "os": "darwin", "cpu": "arm64" }, "sha512-27rypIapNkYboOSylkf1tD9UW9Ado2I+P1NBL46Qz29KmOjTL6WuJ7mHDC5O66CYxlOkF5r93NPDAC3lFHYBXw=="], + + "@oven/bun-darwin-x64": ["@oven/bun-darwin-x64@1.3.6", "", { "os": "darwin", "cpu": "x64" }, "sha512-I82xGzPkBxzBKgbl8DsA0RfMQCWTWjNmLjIEkW1ECiv3qK02kHGQ5FGUr/29L/SuvnGsULW4tBTRNZiMzL37nA=="], + + "@oven/bun-darwin-x64-baseline": ["@oven/bun-darwin-x64-baseline@1.3.6", "", { "os": "darwin", "cpu": "x64" }, "sha512-nqtr+pTsHqusYpG2OZc6s+AmpWDB/FmBvstrK0y5zkti4OqnCuu7Ev2xNjS7uyb47NrAFF40pWqkpaio5XEd7w=="], + + "@oven/bun-linux-aarch64": ["@oven/bun-linux-aarch64@1.3.6", "", { "os": "linux", "cpu": "arm64" }, "sha512-YaQEAYjBanoOOtpqk/c5GGcfZIyxIIkQ2m1TbHjedRmJNwxzWBhGinSARFkrRIc3F8pRIGAopXKvJ/2rjN1LzQ=="], + + "@oven/bun-linux-aarch64-musl": ["@oven/bun-linux-aarch64-musl@1.3.6", "", { "os": "linux", "cpu": "arm64" }, "sha512-FR+iJt17rfFgYgpxL3M67AUwujOgjw52ZJzB9vElI5jQXNjTyOKf8eH4meSk4vjlYF3h/AjKYd6pmN0OIUlVKQ=="], + + "@oven/bun-linux-x64": ["@oven/bun-linux-x64@1.3.6", "", { "os": "linux", "cpu": "x64" }, "sha512-egfngj0dfJ868cf30E7B+ye9KUWSebYxOG4l9YP5eWeMXCtenpenx0zdKtAn9qxJgEJym5AN6trtlk+J6x8Lig=="], + + "@oven/bun-linux-x64-baseline": ["@oven/bun-linux-x64-baseline@1.3.6", "", { "os": "linux", "cpu": "x64" }, "sha512-jRmnX18ak8WzqLrex3siw0PoVKyIeI5AiCv4wJLgSs7VKfOqrPycfHIWfIX2jdn7ngqbHFPzI09VBKANZ4Pckg=="], + + "@oven/bun-linux-x64-musl": ["@oven/bun-linux-x64-musl@1.3.6", "", { "os": "linux", "cpu": "x64" }, "sha512-YeXcJ9K6vJAt1zSkeA21J6pTe7PgDMLTHKGI3nQBiMYnYf7Ob3K+b/ChSCznrJG7No5PCPiQPg4zTgA+BOTmSA=="], + + "@oven/bun-linux-x64-musl-baseline": ["@oven/bun-linux-x64-musl-baseline@1.3.6", "", { "os": "linux", "cpu": "x64" }, "sha512-7FjVnxnRTp/AgWqSQRT/Vt9TYmvnZ+4M+d9QOKh/Lf++wIFXFGSeAgD6bV1X/yr2UPVmZDk+xdhr2XkU7l2v3w=="], + + "@oven/bun-windows-x64": ["@oven/bun-windows-x64@1.3.6", "", { "os": "win32", "cpu": "x64" }, "sha512-Sr1KwUcbB0SEpnSPO22tNJppku2khjFluEst+mTGhxHzAGQTQncNeJxDnt3F15n+p9Q+mlcorxehd68n1siikQ=="], + + "@oven/bun-windows-x64-baseline": ["@oven/bun-windows-x64-baseline@1.3.6", "", { "os": "win32", "cpu": "x64" }, "sha512-PFUa7JL4lGoyyppeS4zqfuoXXih+gSE0XxhDMrCPVEUev0yhGNd/tbWBvcdpYnUth80owENoGjc8s5Knopv9wA=="], + + "@types/bun": ["@types/bun@1.3.6", "", { "dependencies": { "bun-types": "1.3.6" } }, "sha512-uWCv6FO/8LcpREhenN1d1b6fcspAB+cefwD7uti8C8VffIv0Um08TKMn98FynpTiU38+y2dUO55T11NgDt8VAA=="], + + "@types/node": ["@types/node@25.0.8", "", { "dependencies": { "undici-types": "~7.16.0" } }, "sha512-powIePYMmC3ibL0UJ2i2s0WIbq6cg6UyVFQxSCpaPxxzAaziRfimGivjdF943sSGV6RADVbk0Nvlm5P/FB44Zg=="], + + "@types/react": ["@types/react@19.2.8", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-3MbSL37jEchWZz2p2mjntRZtPt837ij10ApxKfgmXCTuHWagYg7iA5bqPw6C8BMPfwidlvfPI/fxOc42HLhcyg=="], + + "@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="], + + "bun": ["bun@1.3.6", "", { "optionalDependencies": { "@oven/bun-darwin-aarch64": "1.3.6", "@oven/bun-darwin-x64": "1.3.6", "@oven/bun-darwin-x64-baseline": "1.3.6", "@oven/bun-linux-aarch64": "1.3.6", "@oven/bun-linux-aarch64-musl": "1.3.6", "@oven/bun-linux-x64": "1.3.6", "@oven/bun-linux-x64-baseline": "1.3.6", "@oven/bun-linux-x64-musl": "1.3.6", "@oven/bun-linux-x64-musl-baseline": "1.3.6", "@oven/bun-windows-x64": "1.3.6", "@oven/bun-windows-x64-baseline": "1.3.6" }, "os": [ "linux", "win32", "darwin", ], "cpu": [ "x64", "arm64", ], "bin": { "bun": "bin/bun.exe", "bunx": "bin/bunx.exe" } }, "sha512-Tn98GlZVN2WM7+lg/uGn5DzUao37Yc0PUz7yzYHdeF5hd+SmHQGbCUIKE4Sspdgtxn49LunK3mDNBC2Qn6GJjw=="], + + "bun-plugin-tailwind": ["bun-plugin-tailwind@0.1.2", "", { "peerDependencies": { "bun": ">=1.0.0" } }, "sha512-41jNC1tZRSK3s1o7pTNrLuQG8kL/0vR/JgiTmZAJ1eHwe0w5j6HFPKeqEk0WAD13jfrUC7+ULuewFBBCoADPpg=="], + + "bun-types": ["bun-types@1.3.6", "", { "dependencies": { "@types/node": "*" } }, "sha512-OlFwHcnNV99r//9v5IIOgQ9Uk37gZqrNMCcqEaExdkVq3Avwqok1bJFmvGMCkCE0FqzdY8VMOZpfpR3lwI+CsQ=="], + + "csstype": ["csstype@3.2.3", "", {}, "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ=="], + + "react": ["react@19.2.3", "", {}, "sha512-Ku/hhYbVjOQnXDZFv2+RibmLFGwFdeeKHFcOTlrt7xplBnya5OGn/hIRDsqDiSUcfORsDC7MPxwork8jBwsIWA=="], + + "react-dom": ["react-dom@19.2.3", "", { "dependencies": { "scheduler": "^0.27.0" }, "peerDependencies": { "react": "^19.2.3" } }, "sha512-yELu4WmLPw5Mr/lmeEpox5rw3RETacE++JgHqQzd2dg+YbJuat3jH4ingc+WPZhxaoFzdv9y33G+F7Nl5O0GBg=="], + + "scheduler": ["scheduler@0.27.0", "", {}, "sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q=="], + + "tailwindcss": ["tailwindcss@4.1.18", "", {}, "sha512-4+Z+0yiYyEtUVCScyfHCxOYP06L5Ne+JiHhY2IjR2KWMIWhJOYZKLSGZaP5HkZ8+bY0cxfzwDE5uOmzFXyIwxw=="], + + "undici-types": ["undici-types@7.16.0", "", {}, "sha512-Zz+aZWSj8LE6zoxD+xrjh4VfkIG8Ya6LvYkZqtUQGJPZjYl53ypCaUwWqo7eI0x66KBGeRo+mlBEkMSeSZ38Nw=="], + } +} diff --git a/react-site/bunfig.toml b/react-site/bunfig.toml new file mode 100644 index 0000000..8877354 --- /dev/null +++ b/react-site/bunfig.toml @@ -0,0 +1,4 @@ + +[serve.static] +plugins = ["bun-plugin-tailwind"] +env = "BUN_PUBLIC_*" \ No newline at end of file diff --git a/react-site/package.json b/react-site/package.json new file mode 100644 index 0000000..503ef7c --- /dev/null +++ b/react-site/package.json @@ -0,0 +1,22 @@ +{ + "name": "bun-react-template", + "version": "0.1.0", + "private": true, + "type": "module", + "scripts": { + "dev": "bun --hot src/index.ts", + "start": "NODE_ENV=production bun src/index.ts", + "build": "bun run build.ts" + }, + "dependencies": { + "bun-plugin-tailwind": "^0.1.2", + "react": "^19.2.3", + "react-dom": "^19.2.3", + "tailwindcss": "^4.1.18" + }, + "devDependencies": { + "@types/react": "^19.2.8", + "@types/react-dom": "^19.2.3", + "@types/bun": "^1.3.6" + } +} diff --git a/react-site/src/APITester.tsx b/react-site/src/APITester.tsx new file mode 100644 index 0000000..0f378ae --- /dev/null +++ b/react-site/src/APITester.tsx @@ -0,0 +1,63 @@ +import { useRef, type FormEvent } from "react"; + +export function APITester() { + const responseInputRef = useRef(null); + + const testEndpoint = async (e: FormEvent) => { + e.preventDefault(); + + try { + const form = e.currentTarget; + const formData = new FormData(form); + const endpoint = formData.get("endpoint") as string; + const url = new URL(endpoint, location.href); + const method = formData.get("method") as string; + const res = await fetch(url, { method }); + + const data = await res.json(); + responseInputRef.current!.value = JSON.stringify(data, null, 2); + } catch (error) { + responseInputRef.current!.value = String(error); + } + }; + + return ( +
+
+ + + +
+