- packages/core/api: HttpApi contract with ToolsApi + SecretsApi groups SDK tagged errors pass through directly with status annotations (ToolNotFoundError→404, PolicyDeniedError→403, etc.) - apps/server: API handler implementation via HttpApiBuilder Exports createApiHandler() for reuse (no baked-in server runtime) Handlers are pure pass-through — no manual error catching - apps/web: Vite + React frontend served on same port as API Vite plugin forwards /v1/*, /docs, /openapi.json to Effect handler effect-atom integration: AtomHttpApi.Tag typed client, query/mutation atoms RegistryProvider + useAtomValue with Result pattern matching - Catalog pins @effect/platform, platform-bun, platform-node, cluster - All 9 packages typecheck clean
Showing the changes to apps/web (9 of 26 files). Show all
Unified · Split
| @@ -0,0 +1,12 @@ | |||
| 1 | <!doctype html> | ||
| 2 | <html lang="en"> | ||
| 3 | <head> | ||
| 4 | <meta charset="UTF-8" /> | ||
| 5 | <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | ||
| 6 | <title>Executor</title> | ||
| 7 | </head> | ||
| 8 | <body> | ||
| 9 | <div id="root"></div> | ||
| 10 | <script type="module" src="/src/main.tsx"></script> | ||
| 11 | </body> | ||
| 12 | </html> | ||
| @@ -0,0 +1,30 @@ | |||
| 1 | { | ||
| 2 | "name": "@executor/web", | ||
| 3 | "version": "0.0.0", | ||
| 4 | "private": true, | ||
| 5 | "type": "module", | ||
| 6 | "dependencies": { | ||
| 7 | "@effect/platform": "catalog:", | ||
| 8 | "@effect-atom/atom": "^0.5.3", | ||
| 9 | "@effect-atom/atom-react": "^0.5.0", | ||
| 10 | "@executor/api": "workspace:*", | ||
| 11 | "@executor/sdk": "workspace:*", | ||
| 12 | "@executor/server": "workspace:*", | ||
| 13 | "effect": "catalog:", | ||
| 14 | "react": "^19.1.0", | ||
| 15 | "react-dom": "^19.1.0" | ||
| 16 | }, | ||
| 17 | "devDependencies": { | ||
| 18 | "@types/react": "^19.1.0", | ||
| 19 | "@types/react-dom": "^19.1.0", | ||
| 20 | "@types/node": "catalog:", | ||
| 21 | "@vitejs/plugin-react": "^4.5.2", | ||
| 22 | "typescript": "^5.9.3", | ||
| 23 | "vite": "^6.3.5" | ||
| 24 | }, | ||
| 25 | "scripts": { | ||
| 26 | "dev": "bunx --bun vite", | ||
| 27 | "build": "vite build", | ||
| 28 | "typecheck": "tsc --noEmit" | ||
| 29 | } | ||
| 30 | } | ||
| @@ -0,0 +1,46 @@ | |||
| 1 | import React, { Suspense } from "react"; | ||
| 2 | import { RegistryProvider, useAtomValue, Result } from "@effect-atom/atom-react"; | ||
| 3 | |||
| 4 | import { ExecutorClient } from "./api/client"; | ||
| 5 | import { toolsAtom } from "./api/atoms"; | ||
| 6 | |||
| 7 | function ToolList() { | ||
| 8 | const tools = useAtomValue(toolsAtom()); | ||
| 9 | |||
| 10 | if (tools._tag === "Initial" || tools.waiting) { | ||
| 11 | return <p>Loading tools…</p>; | ||
| 12 | } | ||
| 13 | |||
| 14 | if (tools._tag === "Failure") { | ||
| 15 | return <p style={{ color: "red" }}>Failed to load tools</p>; | ||
| 16 | } | ||
| 17 | |||
| 18 | return ( | ||
| 19 | <div> | ||
| 20 | <h2>Tools ({tools.value.length})</h2> | ||
| 21 | {tools.value.length === 0 ? ( | ||
| 22 | <p style={{ color: "#888" }}>No tools registered yet.</p> | ||
| 23 | ) : ( | ||
| 24 | <ul> | ||
| 25 | {tools.value.map((t) => ( | ||
| 26 | <li key={t.id}> | ||
| 27 | <strong>{t.name}</strong> | ||
| 28 | {t.description && <span> — {t.description}</span>} | ||
| 29 | </li> | ||
| 30 | ))} | ||
| 31 | </ul> | ||
| 32 | )} | ||
| 33 | </div> | ||
| 34 | ); | ||
| 35 | } | ||
| 36 | |||
| 37 | export function App() { | ||
| 38 | return ( | ||
| 39 | <RegistryProvider> | ||
| 40 | <div style={{ fontFamily: "system-ui", padding: "2rem" }}> | ||
| 41 | <h1>Executor</h1> | ||
| 42 | <ToolList /> | ||
| 43 | </div> | ||
| 44 | </RegistryProvider> | ||
| 45 | ); | ||
| 46 | } | ||
| @@ -0,0 +1,40 @@ | |||
| 1 | import { ScopeId, ToolId, SecretId } from "@executor/sdk"; | ||
| 2 | import { ExecutorClient } from "./client"; | ||
| 3 | |||
| 4 | // --------------------------------------------------------------------------- | ||
| 5 | // Query atoms — typed, cached, reactive | ||
| 6 | // --------------------------------------------------------------------------- | ||
| 7 | |||
| 8 | export const toolsAtom = (scopeId: ScopeId = ScopeId.make("default")) => | ||
| 9 | ExecutorClient.query("tools", "list", { | ||
| 10 | path: { scopeId }, | ||
| 11 | timeToLive: "30 seconds", | ||
| 12 | }); | ||
| 13 | |||
| 14 | export const toolSchemaAtom = (scopeId: ScopeId, toolId: ToolId) => | ||
| 15 | ExecutorClient.query("tools", "schema", { | ||
| 16 | path: { scopeId, toolId }, | ||
| 17 | timeToLive: "1 minute", | ||
| 18 | }); | ||
| 19 | |||
| 20 | export const secretsAtom = (scopeId: ScopeId = ScopeId.make("default")) => | ||
| 21 | ExecutorClient.query("secrets", "list", { | ||
| 22 | path: { scopeId }, | ||
| 23 | timeToLive: "30 seconds", | ||
| 24 | }); | ||
| 25 | |||
| 26 | export const secretStatusAtom = (scopeId: ScopeId, secretId: SecretId) => | ||
| 27 | ExecutorClient.query("secrets", "status", { | ||
| 28 | path: { scopeId, secretId }, | ||
| 29 | timeToLive: "15 seconds", | ||
| 30 | }); | ||
| 31 | |||
| 32 | // --------------------------------------------------------------------------- | ||
| 33 | // Mutation atoms — fire-and-forget style | ||
| 34 | // --------------------------------------------------------------------------- | ||
| 35 | |||
| 36 | export const invokeTool = ExecutorClient.mutation("tools", "invoke"); | ||
| 37 | |||
| 38 | export const setSecret = ExecutorClient.mutation("secrets", "set"); | ||
| 39 | |||
| 40 | export const removeSecret = ExecutorClient.mutation("secrets", "remove"); | ||
| @@ -0,0 +1,15 @@ | |||
| 1 | import { AtomHttpApi } from "@effect-atom/atom-react"; | ||
| 2 | import { FetchHttpClient } from "@effect/platform"; | ||
| 3 | import { ExecutorApi } from "@executor/api"; | ||
| 4 | |||
| 5 | // --------------------------------------------------------------------------- | ||
| 6 | // Typed HTTP API client — uses effect-atom's AtomHttpApi.Tag | ||
| 7 | // --------------------------------------------------------------------------- | ||
| 8 | |||
| 9 | class ExecutorClient extends AtomHttpApi.Tag<ExecutorClient>()("ExecutorClient", { | ||
| 10 | api: ExecutorApi, | ||
| 11 | httpClient: FetchHttpClient.layer, | ||
| 12 | baseUrl: "/", | ||
| 13 | }) {} | ||
| 14 | |||
| 15 | export { ExecutorClient }; | ||
| @@ -0,0 +1,10 @@ | |||
| 1 | export { ExecutorClient } from "./client"; | ||
| 2 | export { | ||
| 3 | toolsAtom, | ||
| 4 | toolSchemaAtom, | ||
| 5 | secretsAtom, | ||
| 6 | secretStatusAtom, | ||
| 7 | invokeTool, | ||
| 8 | setSecret, | ||
| 9 | removeSecret, | ||
| 10 | } from "./atoms"; | ||
| @@ -0,0 +1,6 @@ | |||
| 1 | import React from "react"; | ||
| 2 | import { createRoot } from "react-dom/client"; | ||
| 3 | import { App } from "./App"; | ||
| 4 | |||
| 5 | const root = createRoot(document.getElementById("root")!); | ||
| 6 | root.render(<App />); | ||
| @@ -0,0 +1,19 @@ | |||
| 1 | { | ||
| 2 | "compilerOptions": { | ||
| 3 | "target": "ESNext", | ||
| 4 | "module": "ESNext", | ||
| 5 | "moduleResolution": "bundler", | ||
| 6 | "strict": true, | ||
| 7 | "esModuleInterop": true, | ||
| 8 | "skipLibCheck": true, | ||
| 9 | "outDir": "dist", | ||
| 10 | "rootDir": ".", | ||
| 11 | "jsx": "react-jsx", | ||
| 12 | "plugins": [ | ||
| 13 | { | ||
| 14 | "name": "@effect/language-service" | ||
| 15 | } | ||
| 16 | ] | ||
| 17 | }, | ||
| 18 | "include": ["src", "vite.config.ts"] | ||
| 19 | } | ||
| @@ -0,0 +1,67 @@ | |||
| 1 | import { defineConfig } from "vite"; | ||
| 2 | import react from "@vitejs/plugin-react"; | ||
| 3 | import { createApiHandler } from "@executor/server"; | ||
| 4 | |||
| 5 | const api = createApiHandler(); | ||
| 6 | |||
| 7 | export default defineConfig({ | ||
| 8 | plugins: [ | ||
| 9 | react(), | ||
| 10 | { | ||
| 11 | name: "executor-api", | ||
| 12 | configureServer(server) { | ||
| 13 | // Forward /v1/* and /docs/* to the Effect API handler | ||
| 14 | server.middlewares.use(async (req, res, next) => { | ||
| 15 | const url = req.url ?? "/"; | ||
| 16 | if ( | ||
| 17 | url.startsWith("/v1/") || | ||
| 18 | url.startsWith("/docs") || | ||
| 19 | url === "/openapi.json" | ||
| 20 | ) { | ||
| 21 | const headers = new Headers(); | ||
| 22 | for (const [key, value] of Object.entries(req.headers)) { | ||
| 23 | if (value === undefined) continue; | ||
| 24 | if (Array.isArray(value)) { | ||
| 25 | for (const v of value) headers.append(key, v); | ||
| 26 | } else { | ||
| 27 | headers.set(key, value); | ||
| 28 | } | ||
| 29 | } | ||
| 30 | |||
| 31 | const host = req.headers.host ?? "localhost"; | ||
| 32 | const request = new Request(`http://${host}${url}`, { | ||
| 33 | method: req.method, | ||
| 34 | headers, | ||
| 35 | body: | ||
| 36 | req.method !== "GET" && req.method !== "HEAD" | ||
| 37 | ? (await new Promise<Uint8Array>((resolve) => { | ||
| 38 | const chunks: Uint8Array[] = []; | ||
| 39 | req.on("data", (c: Uint8Array) => chunks.push(c)); | ||
| 40 | req.on("end", () => { | ||
| 41 | const total = chunks.reduce((n, c) => n + c.length, 0); | ||
| 42 | const buf = new Uint8Array(total); | ||
| 43 | let offset = 0; | ||
| 44 | for (const c of chunks) { buf.set(c, offset); offset += c.length; } | ||
| 45 | resolve(buf); | ||
| 46 | }); | ||
| 47 | }) as unknown as BodyInit) | ||
| 48 | : undefined, | ||
| 49 | }); | ||
| 50 | |||
| 51 | const response = await api.handler(request); | ||
| 52 | |||
| 53 | res.statusCode = response.status; | ||
| 54 | response.headers.forEach((value, key) => { | ||
| 55 | res.setHeader(key, value); | ||
| 56 | }); | ||
| 57 | |||
| 58 | const body = await response.arrayBuffer(); | ||
| 59 | res.end(Buffer.from(body)); | ||
| 60 | return; | ||
| 61 | } | ||
| 62 | next(); | ||
| 63 | }); | ||
| 64 | }, | ||
| 65 | }, | ||
| 66 | ], | ||
| 67 | }); | ||