21 return c.json({ branches: branches.data });
22 } catch (error) {
23 console.error("Error fetching branches:", error);
24 return Response.json({ error: "Failed to fetch branches" }, { status: 500 });
25 }
26});
19solution that changes as little code as possible.
20
21Use your 'fetch' tool to debug HTTP vals making requests to them and examining the responses.
22
23Use your 'requests' tool to see attributes about file executions, including headers, http status, run time, error messages and error stack traces.
256 </>
257 );
258 case "fetch":
259 return (
260 <Details
269 summary={(
270 <>
271 <div>fetch:</div>
272 <div>{args?.valPath}</div>
273 <div>{args?.urlPath || "/"}</div>
275 )}>
276 {result?.type === "success" ? (
277 <div className="fetch-result">
278 <div className="fetch-header">
279 <span className={`status-badge ${result.data.status >= 200 && result.data.status < 300 ? 'success' :
280 result.data.status >= 300 && result.data.status < 400 ? 'redirect' :
284 <span className="response-time">{result.data.responseTime}ms</span>
285 </div>
286 <div className="fetch-section">
287 <h4>Headers</h4>
288 <pre className="fetch-headers">{JSON.stringify(result.data.headers, null, 2)}</pre>
289 </div>
290 <div className="fetch-section">
291 <h4>Response Body</h4>
292 <pre className="fetch-body">
293 {typeof result.data.body === 'object'
294 ? JSON.stringify(result.data.body, null, 2)
298 </div>
299 ) : (
300 <div className="fetch-error">
301 <h4>Error</h4>
302 <pre>{result?.message || "Unknown error"}</pre>
212});
213
214export default app.fetch;
21
22// This is the entry point for HTTP vals
23export default app.fetch;
24
1import { makeChangeValTypeTool } from "./change-val-type.ts";
2import { makeFetchTool } from "./fetch.ts";
3import { makeTextEditorTool } from "./text-editor.ts";
4import { makeTracesTool } from "./traces.ts";
8 makeTextEditorTool,
9 makeChangeValTypeTool,
10 makeFetchTool,
11 makeTracesTool,
12 thinkTool,
11 * Creates a tool for making HTTP requests to vals in a Val Town project
12 */
13export const makeFetchTool = (
14 { bearerToken, project, branch_id }: { bearerToken?: string; project?: any; branch_id?: string } = {},
15) =>
16 tool({
17 name: "fetch",
18 description: "Make an HTTP request to a Val Town val and return the response. Useful for testing HTTP vals.",
19 parameters: z.object({
68 return {
69 type: "error",
70 message: `Error fetching val at path '${valPath}': ${error.message}`,
71 };
72 }
83 return {
84 type: "error",
85 message: `The val at path '${valPath}' is not an HTTP val. Only HTTP vals can be called with fetch.`,
86 };
87 }
111 let response;
112 try {
113 response = await fetch(valEndpoint + urlPath, options);
114 } catch (error: any) {
115 // Return error information
239
240 // Inject data to avoid extra round-trips
241 const initialData = await fetchInitialData();
242 const dataScript = `<script>
243 window.__INITIAL_DATA__ = ${JSON.stringify(initialData)};
286
2875. **API Design:**
288 - `fetch` handler is the entry point for HTTP vals
289 - Run the Hono app with `export default app.fetch // This is the entry point for HTTP vals`
290
291
49 files={project.data?.files}
50 branchId={branchId}
51 refetch={project.refetch}
52 />
53 </ProjectContext>
59 files,
60 branchId,
61 refetch,
62}: {
63 project: any;
64 files: any[];
65 branchId: string;
66 refetch: () => void;
67}) {
68 const [images, setImages] = useState<(string|null)[]>([]);
94 if (!messages?.length) return;
95 let last = messages.at(-1);
96 if (shouldRefetch(last)) {
97 refetch();
98 }
99 }, [messages]);
194}
195
196function shouldRefetch (message) {
197 for (let i = 0; i < message?.parts?.length; i++) {
198 let part = message.parts[i];
32 return;
33 }
34 branches.refetch();
35 if (res?.branch?.id) {
36 navigate(`/chat/${projectId}/branch/${res.branch.id}`);