12 setData(null);
13 setError(null);
14 const res = await fetch(ENDPOINT, {
15 method: "POST",
16 body: JSON.stringify({
7 const [loading, setLoading] = useState(true);
8
9 const fetchData = async () => {
10 const endpoint = new URL(ENDPOINT, window.location.origin);
11 endpoint.searchParams.append("projectId", projectId);
12
13 const res = await fetch(endpoint)
14 .then(res => res.json());
15 setData(res.branches);
19 useEffect(() => {
20 if (!projectId) return;
21 fetchData();
22 }, [projectId]);
23
24 return { data, loading, refetch: fetchData };
25}
47<!--
48
49- [x] refetch project data on create/etc
50- [x] Loading favicon
51- [x] Ensure main branch is default selected
166 let type_: "file" | "http" | "script";
167 if (path.includes("backend/index.ts")) type_ = "http";
168 if (file_text?.includes("export default app.fetch")) type_ = "http";
169 if ([".ts", ".tsx", ".js", ".jsx"].some(ext => path.endsWith(ext))) {
170 type_ = "script";
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:**
1/** fetch tool styles */
2.fetch-result {
3 display: flex;
4 flex-direction: column;
6}
7
8.fetch-header {
9 display: flex;
10 justify-content: space-between;
45}
46
47.fetch-section {
48 margin-top: var(--space-2);
49}
50
51.fetch-section h4 {
52 margin-bottom: var(--space-1);
53 font-size: var(--font-size-5);
54}
55
56.fetch-headers, .fetch-body {
57 font-size: var(--font-size-6);
58 background-color: var(--slate-50);
63}
64
65.fetch-error {
66 color: var(--red);
67}
68
69.fetch-error h4 {
70 margin-bottom: var(--space-1);
71 font-size: var(--font-size-5);
72}
73
74.fetch-error pre {
75 font-size: var(--font-size-6);
76 background-color: var(--red-light);
11 startTrackingUsage,
12} from "../database/queries.tsx";
13import { makeChangeValTypeTool, makeFetchTool, makeTextEditorTool } from "../tools/index.ts";
14import fileWithLinesNumbers from "../utils/fileWithLinesNumbers.ts";
15
114 }
115
116 // If there are selected files, fetch their content and add them to the messages
117 if (selectedFiles && selectedFiles.length > 0) {
118 const vt = new ValTown({ bearerToken });
134 fileContents += `## File: ${filePath}\n\`\`\`\n${fileWithLinesNumbers(content)}\n\`\`\`\n\n`;
135 } catch (error) {
136 console.error(`Error fetching file ${filePath}:`, error);
137 fileContents += `## File: ${filePath}\nError: Could not fetch file content\n\n`;
138 }
139 }
178 // think: thinkTool,
179 change_val_type: makeChangeValTypeTool({ bearerToken, project, branch_id: branchId }),
180 fetch: makeFetchTool({ bearerToken, project, branch_id: branchId }),
181 },
182 maxSteps: 20,
56 row.parentNode.insertBefore(newRow, row.nextSibling);
57
58 // Fetch the inference calls data
59 fetch('/api/inference-calls?usage_id=' + usageId)
60 .then(response => response.json())
61 .then(data => {
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
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});