8 const { isAuthenticated, authenticate, error } = useAuth();
9 const [tokenValue, setTokenValue] = useState("");
10 const [apiKey, setApiKey] = useState("");
11 // const [invalid, setInvalid] = useState(""); // TODO
12
13 const handleSubmit = (e) => {
14 e.preventDefault();
15 authenticate(tokenValue, apiKey);
16 };
17
36 >
37 <div>
38 <label htmlFor="valtown-token" className="label">Val Town API Token</label>
39 <div style={{ fontSize: "0.8em", color: "#666" }}>
40 <p>
41 <a href="https://www.val.town/settings/api/new" target="_blank" rel="noreferrer">
42 Create a Val Town token here
43 </a>
58 </div>
59 <div>
60 <label htmlFor="anthropic-api-key" className="label">Anthropic API Key (optional)</label>
61 <input
62 type="password"
63 id="anthropic-api-key"
64 name="anthropic-key"
65 value={apiKey}
66 onChange={e => {
67 setApiKey(e.target.value);
68 }}
69 />
11app.get("*", async (c, next) => {
12 const path = c.req.path;
13 if (path.startsWith("/api/") || c.req.header("Accept")?.includes("application/json")) {
14 return next();
15 }
21});
22
23app.route("/api", backend);
24app.get("/frontend/*", c => {
25 return serveFile(c.req.path, import.meta.url);
1import { basicAuthMiddleware } from "./auth.ts";
2import { handleApiRequest } from "./api/index.ts";
3import { getRequests } from "./api/requests.ts";
4import { getUserSummary } from "./api/user-summary.ts";
5import { getInferenceCalls } from "./api/inference-calls.ts";
6import { renderDashboard } from "./views/dashboard.ts";
7import { renderRequests } from "./views/requests.ts";
22 const path = url.pathname;
23
24 // Handle API requests
25 if (path.startsWith("/api/")) {
26 return handleApiRequest(req);
27 }
28
4
5/**
6 * Handle API requests
7 */
8export async function handleApiRequest(req: Request): Promise<Response> {
9 const url = new URL(req.url);
10 const path = url.pathname.replace("/api/", "");
11
12 try {
13 // Route to the appropriate API handler
14 if (path === "requests") {
15 const usageId = url.searchParams.get("usage_id");
59 }
60 } catch (error) {
61 console.error("API error:", error);
62 return new Response(JSON.stringify({ error: error.message }), {
63 status: 500,
42 </h2>
43 <ol>
44 <li>Login with your Val Town API token (with projects:read, projects:write, user:read permissions)</li>
45 <li>Select a project to work on</li>
46 <li>Chat with Claude about your code</li>
79 </div>
80 <h3>Cost Tracking</h3>
81 <p>See estimated API usage costs for each interaction</p>
82 </div>
83 </section>
92 <ul>
93 <li>React frontend with TypeScript</li>
94 <li>Hono API server backend</li>
95 <li>Web Audio API for sound notifications</li>
96 <li>AI SDK for Claude integration</li>
97 </ul>
98 <p>
99 The application proxies requests to the Anthropic API and Val Town API, allowing Claude to view and edit your
100 project files directly.
101 </p>
63 refetch: () => void;
64}) {
65 const { token, anthropicApiKey } = useAuth();
66 const [images, setImages] = useState<(string|null)[]>([]);
67 const [selectedFiles, setSelectedFiles] = useState<string[]>([]);
81 project,
82 branchId,
83 anthropicApiKey,
84 bearerToken: token,
85 selectedFiles,
32});
33
34// API endpoints
35app.post("/api/commits", async c => {
36 const { token, repo, owner, startDate, endDate } = await c.req.json();
37
55});
56
57app.post("/api/generate-notes", async c => {
58 const { commits } = await c.req.json();
59
77
78// Create a shareable link
79app.post("/api/share", async c => {
80 const data = await c.req.json() as CreateShareRequest;
81
113
114// Get shared release notes
115app.get("/api/share/:id", async c => {
116 const id = c.req.param("id");
117
1import { blob } from "https://esm.town/v/std/blob";
2
3export default async function(req: Request): Promise<Response> {
4 const token = req.headers.get("authorization")?.split(" ")?.at(1);
5
371 headers.map(field => {
372 const value = row[field] == null ? "" : String(row[field]);
373 // Basic CSV escaping: replace " with "" and wrap field in quotes if it contains , " or newline
374 const needsQuotes = /[,"\n]/.test(value);
375 const escapedValue = value.replace(/"/g, "\"\"");
865 headers.map(field => {
866 const value = row[field] == null ? "" : String(row[field]);
867 // Basic CSV escaping: replace " with "" and wrap field in quotes if it contains , " or newline
868 const needsQuotes = /[,"\n]/.test(value);
869 const escapedValue = value.replace(/"/g, "\"\"");
20 SUM(num_images) as total_images
21 FROM ${USAGE_TABLE}
22 WHERE our_api_token = 1
23 GROUP BY user_id, username
24 ORDER BY total_price DESC