Val Town Code SearchReturn to Val Town

13
14    const data = await response.json();
15    console.log("API Response:", data);
16  } catch (error) {
17    console.error("Error fetching API:", error);
18  }
19}

1// superpowered_agent_platform_vNext_client_orchestrated.ts
2// Server-side: Exposes tools and custom functions as individual API endpoints.
3// Client-side: Orchestrates calls to these endpoints based on an editable JSON workflow.
4
5// --- COMMON TYPES (can be shared or duplicated between client/server for clarity in this example) ---
6interface ApiRequest<T = any> {
7  workflowInstanceId: string; // Generated by client for a particular workflow run
8  stepId: string; // ID of the step being executed
11}
12
13interface ApiResponse<T = any> {
14  workflowInstanceId: string;
15  stepId: string;
171  });
172  try {
173    const openai = new OpenAI(); // Assumes OPENAI_API_KEY is in environment
174    const completion = await openai.chat.completions.create({
175      model,
183    return completion;
184  } catch (e: any) {
185    logger.log("ERROR", "OpenAI API call failed.", e);
186    throw e;
187  }
577  }
578
579  if (req.method !== "POST" || pathSegments[0] !== "api") {
580    return new Response("Not Found. API endpoints are under /api/ and expect POST.", { status: 404 });
581  }
582
583  let reqBody: ApiRequest;
584  try {
585    reqBody = await req.json();
645  }
646
647  const apiResponse: ApiResponse = {
648    workflowInstanceId,
649    stepId,
653  };
654
655  return Response.json(apiResponse, { status: errorMsg ? 500 : 200 });
656}
657
767        {
768          "id": "validate",
769          "endpoint": "/api/custom/validate_data",
770          "description": "Validate raw data",
771          "inputs": { "data": "{{load_data.rawData}}" }, 
774        {
775          "id": "clean_petal_width_llm",
776          "endpoint": "/api/tools/openai_call",
777          "description": "LLM cleaning for 'petal.width'",
778          "inputs": { 
796        {
797          "id": "transform_features",
798          "endpoint": "/api/tools/run_script",
799          "description": "Create new feature 'petal_area'",
800          "inputs": {
807        {
808          "id": "summarize",
809          "endpoint": "/api/custom/generate_summary_stats",
810          "description": "Generate summary statistics on transformed data",
811          "inputs": { "data": "{{transform_features.transformedData}}" },
815        {
816          "id": "insights_llm",
817          "endpoint": "/api/tools/openai_call",
818          "description": "Get LLM insights on summary",
819          "inputs": {
829        {
830          "id": "visualize_petal_area",
831          "endpoint": "/api/custom/generate_chart_config",
832          "description": "Generate bar chart for petal_area by species",
833          "inputs": {
1184                    }
1185                } else { 
1186                    const apiRequest = {
1187                        workflowInstanceId,
1188                        stepId: step.id,
1192                        method: 'POST',
1193                        headers: { 'Content-Type': 'application/json' },
1194                        body: JSON.stringify(apiRequest)
1195                    });
1196                    
1197                    const apiResponse = await response.json();
1198                    if (apiResponse.logs) {
1199                        apiResponse.logs.forEach(log => appendLog(log));
1200                        stepOutputs[step.id].logs = (stepOutputs[step.id].logs || []).concat(apiResponse.logs);
1201                    }
1202
1203                    if (!response.ok || apiResponse.error) {
1204                        throw new Error(apiResponse.error || \`API request for \${step.endpoint} failed with status \${response.status}\`);
1205                    }
1206                    rawResultPayload = apiResponse.payload;
1207                }
1208

1# Vite + Deno + React + TypeScript + Hono + Val Town
2
3A Vite project running on Val Town with Hono integration. The `server.tsx` serves the project and handles API routes using Hono while proxying frontend requests to the Vite development server. If you make any edits, the server will rebuild on the next request. All code is built using Deno on a separate build+proxy server. You can view the source here: https://github.com/maxmcd/vite-proxy
4
5## Architecture
6
7This project uses:
8- **Hono**: For API routes and server-side rendering
9- **Vite**: For frontend development and hot module replacement
10- **React**: For the UI components
14
15The server is structured to:
161. Handle API routes with Hono
172. Proxy all other requests to the Vite development server
18
19```ts
20// Create a main Hono app that will handle both API routes and proxy to Vite
21const mainApp = new Hono();
22
23// Mount the Hono app from src/index.tsx to handle API routes
24mainApp.route("/api", app);
25
26// For all other routes, use the Vite proxy
50When a request is received, the proxy downloads the entire project source (it can't be private) and builds it using Deno. Once the build is complete, all resulting files are cached and served quickly for future requests.
51
52## API Routes
53
54API routes are defined in `src/index.tsx` and are accessible under the `/api` path:
55
56- `/api/clock` - Returns the current server time
57- `/api/hello` - Returns a hello message
58
59## Client-Side
60
61The client-side code uses Hono's client utilities to make API requests and React for rendering the UI.

4import type { AppType } from ".";
5
6// Update the client to point to the API routes
7const client = hc<AppType>("/api");
8
9function App() {
13      <h2>Example of useState()</h2>
14      <Counter />
15      <h2>Example of API fetch()</h2>
16      <ClockButton />
17      <h2>Example of another API endpoint</h2>
18      <HelloButton />
19    </>

3const app = new Hono();
4
5// API routes
6app.get("/clock", (c) => {
7  return c.json({
10});
11
12// Add more API routes as needed
13app.get("/hello", (c) => {
14  return c.json({
15    message: "Hello from Hono API!",
16  });
17});

30const projectVal = parseProject(import.meta.url);
31
32// Create a main Hono app that will handle both API routes and proxy to Vite
33const mainApp = new Hono();
34
35// Mount the Hono app from src/index.tsx to handle API routes
36mainApp.route("/api", app);
37
38// For all other routes, use the Vite proxy

3const app = new Hono();
4
5const routes = app.get("/api/clock", (c) => {
6  return c.json({
7    time: new Date().toLocaleTimeString(),

12      <h2>Example of useState()</h2>
13      <Counter />
14      <h2>Example of API fetch()</h2>
15      <ClockButton />
16    </>
31
32  const handleClick = async () => {
33    const response = await client.api.clock.$get();
34    const data = await response.json();
35    const headers = Array.from(response.headers.entries()).reduce<

2import querystring from "npm:querystring";
3
4const NOW_PLAYING_ENDPOINT = "https://api.spotify.com/v1/me/player/currently-playing";
5const TOKEN_ENDPOINT = "https://accounts.spotify.com/api/token";
6
7const client_id = Deno.env.get("spotify_client_id");

146export default async function(request, env, ctx) {
147  const url = new URL(request.url);
148  if (!url.pathname.startsWith("/api")) {
149    return new Response("welcome", {
150      headers: { "content-type": "text/html" },