216
217 // Inject data to avoid extra round-trips
218 const initialData = await fetchInitialData();
219 const dataScript = `<script>
220 window.__INITIAL_DATA__ = ${JSON.stringify(initialData)};
263
2645. **API Design:**
265 - `fetch` handler is the entry point for HTTP vals
266 - Run the Hono app with `export default app.fetch // This is the entry point for HTTP vals`
267
2686. **Hono Peculiarities:**
865
866/** slop styles */
867.fetch-result {
868 display: flex;
869 flex-direction: column;
871}
872
873.fetch-header {
874 display: flex;
875 justify-content: space-between;
910}
911
912.fetch-section {
913 margin-top: var(--space-2);
914}
915
916.fetch-section h4 {
917 margin-bottom: var(--space-1);
918 font-size: var(--font-size-5);
919}
920
921.fetch-headers, .fetch-body {
922 font-size: var(--font-size-6);
923 background-color: var(--slate-50);
928}
929
930.red, .fetch-error {
931 color: var(--red);
932}
933
934.fetch-error h4 {
935 margin-bottom: var(--space-1);
936 font-size: var(--font-size-5);
937}
938
939.fetch-error pre {
940 font-size: var(--font-size-6);
941 background-color: var(--red-light);
47
48 try {
49 // TODO: could not get the SDK working but would be great to use this instead of the fetch
50 //const paymentIntent: Stripe.PaymentIntent = await stripe.paymentIntents.retrieve(session.client_reference_id);
51
52 const response = await fetch(`https://api.stripe.com/v1/payment_intents/${session.client_reference_id}`, {
53 method: 'GET',
54 headers: {
14 calculatePartialUsageFromInferenceCalls,
15} from "../database/queries.tsx";
16import { makeChangeValTypeTool, makeFetchTool, makeTextEditorTool, makeTracesTool } from "../tools/index.ts";
17import fileWithLinesNumbers from "../utils/fileWithLinesNumbers.ts";
18
153 }
154
155 // If there are selected files, fetch their content and add them to the messages
156 if (selectedFiles && selectedFiles.length > 0) {
157 const vt = new ValTown({ bearerToken });
173 fileContents += `## File: ${filePath}\n\`\`\`\n${fileWithLinesNumbers(content)}\n\`\`\`\n\n`;
174 } catch (error) {
175 console.error(`Error fetching file ${filePath}:`, error);
176 fileContents += `## File: ${filePath}\nError: Could not fetch file content\n\n`;
177 }
178 }
218 // think: thinkTool,
219 change_val_type: makeChangeValTypeTool({ bearerToken, project, branch_id: branchId }),
220 fetch: makeFetchTool({ bearerToken, project, branch_id: branchId }),
221 requests: makeTracesTool({ bearerToken, project, branch_id: branchId }),
222 },
8
9- **AI-Assisted Editing**: Chat with Claude 4 Sonnet about your code and let it make changes directly to your project files
10- **Fetch tool**: Townie is able to make HTTP calls to your HTTP services to test them and continue iterating
11- **Branch Management**: View, select, and create branches without leaving the app
12- **Sound Notifications**: Get alerted when Claude finishes responding
73 });
74
75 const response = await fetch("https://api.stripe.com/v1/payment_intents", {
76 method: "POST",
77 headers: {
10
11 useEffect(() => {
12 fetchBalance();
13 }, []);
14
15 const fetchBalance = async () => {
16 try {
17 const response = await fetch("/api/credit-balance");
18 if (response.ok) {
19 const data = await response.json();
21 }
22 } catch (err) {
23 console.error("Failed to fetch balance:", err);
24 }
25 };
35
36 try {
37 const response = await fetch("/api/purchase-credits", {
38 method: "POST",
39 headers: { "Content-Type": "application/json" },
30 return c.json({ files: files.data });
31 } catch (error) {
32 console.error("Error fetching project files:", error);
33 return Response.json({ error: "Failed to fetch project files" }, { status: 500 });
34 }
35});
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 debug all kinds of vals. It'll show you the logs made during the file execution and the attributes associated it, including headers, http status, run time, error messages and error stack traces.