Hi

\"\n});\n```\n\n## Project Structure and Design Patterns\n\n### Recommended Directory Structure\n```\n├── backend/\n│ ├── database/\n│ │ ├── migrations.ts # Schema definitions\n│ │ ├── queries.ts # DB query functions\n│ │ └── README.md\n│ ├── index.ts # Main entry point\n│ └── README.md\n├── frontend/\n│ ├── components/\n│ │ ├── App.tsx\n│ │ └── [Component].tsx\n│ ├── favicon.svg\n│ ├── index.html # Main HTML template\n│ ├── index.tsx # JS entry point\n│ ├── README.md\n│ └── style.css\n├── README.md\n└── shared/\n ├── README.md\n └── utils.ts # Shared types and functions\n```\n\n### Backend (Hono) Best Practices\n- Hono is the recommended API framework (similar to Express, Flask, or Sinatra)\n- Main entry point should be `backend/index.ts`\n- **Static asset serving:** Use the utility functions to read and serve project files:\n ```ts\n // Use the serveFile utility to handle content types automatically\n app.get(\"/public/*\", c => serveFile(c.req.path.replace(\"/public\", \"/frontend\"), import.meta.url));\n \n // For index.html, often you'll want to bootstrap with initial data\n app.get(\"/\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n \n // Inject data to avoid extra round-trips\n const initialData = await fetchInitialData();\n const dataScript = ``;\n \n html = html.replace(\"\", `${dataScript}`);\n return c.html(html);\n });\n ```\n- Create RESTful API routes for CRUD operations\n- Be careful with error handling as Hono tends to swallow errors\n- Consider re-throwing errors to see full stack traces:\n ```ts\n // Unwrap Hono errors to see original error details\n app.onError((err, c) => {\n throw err;\n });\n ```\n\n### Frontend Best Practices\n- Structure as a standard client-side React app\n- Use SVG for favicons (Val Town only supports text files)\n- Separate components into individual files\n- Access bootstrapped data from `window.__INITIAL_DATA__`\n- Use React 18.2.0 consistently in all imports and the `@jsxImportSource` pragma\n- Follow the React component pattern from the example project\n- Handle API calls properly with proper error catching\n\n### Database Patterns\n- Run migrations on startup or comment out for performance\n- Change table names when modifying schemas rather than altering\n- Export clear query functions with proper TypeScript typing\n- Follow the queries and migrations pattern from the example\n\n## Common Gotchas and Solutions\n\n1. **Environment Limitations:** \n - Val Town runs on Deno in a serverless context, not Node.js\n - Code in `shared/` must work in both frontend and backend environments\n - Cannot use `Deno` keyword in shared code\n - Use `https://esm.sh` for imports that work in both environments\n\n2. **SQLite Peculiarities:**\n - Limited support for ALTER TABLE operations\n - Create new tables with updated schemas and copy data when needed\n - Always run table creation before querying\n\n3. **React Configuration:**\n - All React dependencies must be pinned to 18.2.0\n - Always include `@jsxImportSource https://esm.sh/react@18.2.0` at the top of React files\n - Rendering issues often come from mismatched React versions\n\n4. **File Handling:**\n - Val Town only supports text files, not binary\n - Use the provided utilities to read files across branches and forks\n - For files in the project, use `readFile` helpers\n\n5. **API Design:**\n - `fetch` handler is the entry point for HTTP vals\n - Run the Hono app with `export default app.fetch // This is the entry point for HTTP vals`\n - Properly handle CORS if needed for external access",[],[154,190],[154],{"_104":199,"_95":200,"_155":201,"_157":-5,"_158":140,"_159":202,"_161":118,"_106":203,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":204,"_98":280},"1e0e65d0-09ac-11f0-a4aa-569c3dd06744","frontend","5fab40f3-45f8-406a-8c29-bfe709a3ab41",2,["D",1742929529169],[205,256,271],{"_104":206,"_95":207,"_155":208,"_157":201,"_158":140,"_159":209,"_161":118,"_106":210,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":211,"_98":255},"1e1d83d0-09ac-11f0-bbb4-569c3dd06744","components","0a09e16c-905c-488f-b228-67feac74f574",4,["D",1742929529269],[212,220,229,238,247],{"_104":213,"_95":214,"_155":215,"_157":208,"_158":140,"_159":101,"_161":118,"_106":216,"_100":32,"_163":176,"_165":217,"_166":22,"_167":-5,"_168":218,"_98":219},"1e628b9c-09ac-11f0-bbb4-569c3dd06744","CreateBranch.tsx","1e628c64-09ac-11f0-bbb4-569c3dd06744",["D",1742929529723],"/** @jsxImportSource https://esm.sh/react@18.2.0?dev */\nimport React, { useState } from \"https://esm.sh/react@18.2.0?dev\";\n\ninterface CreateBranchProps {\n projectId: string;\n bearerToken: string;\n onBranchCreated: (branchId: string) => void;\n onCancel: () => void;\n}\n\nexport function CreateBranch({\n projectId,\n bearerToken,\n onBranchCreated,\n onCancel,\n}: CreateBranchProps) {\n const [branchName, setBranchName] = useState(\"\");\n const [isCreating, setIsCreating] = useState(false);\n const [error, setError] = useState(null);\n\n // Validate branch name (only letters, numbers, and dashes)\n const isValidBranchName = (name: string) => {\n const branchNameRegex = /^[a-zA-Z0-9-]+$/;\n return branchNameRegex.test(name);\n };\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n // Validate branch name\n if (!branchName.trim()) {\n setError(\"Branch name cannot be empty\");\n return;\n }\n \n if (!isValidBranchName(branchName)) {\n setError(\"Branch name can only contain letters, numbers, and dashes\");\n return;\n }\n \n setIsCreating(true);\n setError(null);\n \n try {\n const response = await fetch(\"/api/create-branch\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n \"Authorization\": `Bearer ${bearerToken}`,\n },\n body: JSON.stringify({\n projectId,\n branchName,\n }),\n });\n \n const data = await response.json();\n \n if (!response.ok) {\n throw new Error(data.error || \"Failed to create branch\");\n }\n \n // Call the callback with the new branch ID\n onBranchCreated(data.branch.id);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"An error occurred\");\n } finally {\n setIsCreating(false);\n }\n };\n \n return (\n

Create New Branch

\n \n \n

\n );\n}",[],[200,207,214],{"_104":221,"_95":222,"_155":223,"_157":208,"_158":140,"_159":224,"_161":118,"_106":225,"_100":32,"_163":176,"_165":226,"_166":22,"_167":-5,"_168":227,"_98":228},"1e54741c-09ac-11f0-b9ae-569c3dd06744","ImageUpload.tsx","1e5474bc-09ac-11f0-b9ae-569c3dd06744",10,["D",1742929529631],"/** @jsxImportSource https://esm.sh/react@18.2.0?dev */\nimport React, { useRef, useState } from \"https://esm.sh/react@18.2.0?dev\";\n\n// Maximum number of images that can be uploaded\nexport const PROMPT_IMAGE_LIMIT = 5;\n\ninterface ImageUploadProps {\n images: (string | null)[];\n setImages: (images: (string | null)[]) => void;\n}\n\nexport function ImageUpload({ images, setImages }: ImageUploadProps) {\n const fileInputRef = useRef(null);\n const [isDragging, setIsDragging] = useState(false);\n\n // Handle file selection\n const handleFileChange = (e: React.ChangeEvent) => {\n if (e.target.files) {\n processFiles(Array.from(e.target.files));\n }\n };\n\n // Process the selected files\n const processFiles = async (files: File[]) => {\n // Filter for image files only\n const imageFiles = files.filter(file => file.type.startsWith('image/'));\n \n // Limit the number of images\n const filesToProcess = imageFiles.slice(0, PROMPT_IMAGE_LIMIT - images.filter(Boolean).length);\n \n if (filesToProcess.length === 0) return;\n\n // Add null placeholders for loading state\n const newImages = [...images, ...Array(filesToProcess.length).fill(null)];\n setImages(newImages);\n\n // Process each file\n const processedImages = await Promise.all(\n filesToProcess.map(async (file) => {\n return await readFileAsDataURL(file);\n })\n );\n\n // Replace null placeholders with actual images\n const updatedImages = [...images];\n processedImages.forEach((dataUrl, index) => {\n updatedImages[images.length + index] = dataUrl;\n });\n \n setImages(updatedImages.slice(0, PROMPT_IMAGE_LIMIT));\n };\n\n // Convert file to data URL\n const readFileAsDataURL = (file: File): Promise => {\n return new Promise((resolve, reject) => {\n const reader = new FileReader();\n reader.onload = () => {\n const result = reader.result as string;\n console.log(\"Image loaded, size:\", result.length, \"bytes\");\n resolve(result);\n };\n reader.onerror = reject;\n reader.readAsDataURL(file);\n });\n };\n\n // Handle drag events\n const handleDragEnter = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsDragging(true);\n };\n\n const handleDragLeave = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsDragging(false);\n };\n\n const handleDragOver = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const handleDrop = (e: React.DragEvent) => {\n e.preventDefault();\n e.stopPropagation();\n setIsDragging(false);\n \n if (e.dataTransfer.files) {\n processFiles(Array.from(e.dataTransfer.files));\n }\n };\n\n // Handle removing an image\n const removeImage = (index: number) => {\n const newImages = [...images];\n newImages.splice(index, 1);\n setImages(newImages);\n };\n\n // Check if we've reached the image limit\n const isAtLimit = images.filter(Boolean).length >= PROMPT_IMAGE_LIMIT;\n\n return (\n

\n {/* Image previews */}\n {images.length > 0 && (\n

\n {images.map((image, index) => (\n

\n {image ? (\n

\n removeImage(index)}\n title=\"Remove image\"\n >\n ×\n \n

\n ) : (\n

\n )}\n

\n ))}\n

\n )}\n\n {/* Upload button and drag area */}\n {!isAtLimit && (\n fileInputRef.current?.click()}\n onDragEnter={handleDragEnter}\n onDragLeave={handleDragLeave}\n onDragOver={handleDragOver}\n onDrop={handleDrop}\n >\n \n

\n {isDragging ? (\n \"Drop images here\"\n ) : (\n <>\n Upload images or drag and drop\n

\n {images.filter(Boolean).length}/{PROMPT_IMAGE_LIMIT} images\n

\n \n )}\n

\n )}\n \n );\n}\n\n// Component to display images in messages\nexport function ImagePreview({ images }: { images: string[] }) {\n const [expandedImage, setExpandedImage] = useState(null);\n\n if (!images || images.length === 0) return null;\n\n return (\n

\n {images.map((image, index) => (\n

\n setExpandedImage(image)}\n />\n

\n ))}\n

\n\n {/* Modal for expanded image */}\n {expandedImage && (\n

setExpandedImage(null)}\n >\n

\n \n

\n )}\n

\n );\n}",[],[200,207,222],{"_104":230,"_95":231,"_155":232,"_157":208,"_158":140,"_159":233,"_161":118,"_106":234,"_100":32,"_163":176,"_165":235,"_166":22,"_167":-5,"_168":236,"_98":237},"1e2dc790-09ac-11f0-a4aa-569c3dd06744","Login.tsx","1e2dc862-09ac-11f0-a4aa-569c3dd06744",6,["D",1742929529378],"/** @jsxImportSource https://esm.sh/react@18.2.0?dev */\nimport { useLocalStorage } from \"https://esm.sh/react-use?dev&deps=react@18.2.0&react-dom@18.2.0\";\n\nexport function Login() {\n const [bearerToken, setBearerToken] = useLocalStorage(\"bearer\", \"\");\n const [anthropicApiKey, setAnthropicApiKey] = useLocalStorage(\"anthropic_api_key\", \"\");\n\n return (\n

Login

\n \n \n Val Town API Token\n \n {\"\"}(with projects:write and users:read permission)\n \n setBearerToken(e.target.value)}\n placeholder=\"vtwn-xxxx\"\n autoComplete=\"off\"\n className=\"w-full p-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none\"\n />\n

\n Anthropic API Key\n setAnthropicApiKey(e.target.value)}\n placeholder=\"sk-ant-xxxxx\"\n autoComplete=\"off\"\n className=\"w-full p-3 rounded-lg border border-gray-300 focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none\"\n />\n

\n \n Login\n \n

\n );\n}",[],[200,207,231],{"_104":239,"_95":240,"_155":241,"_157":208,"_158":140,"_159":242,"_161":118,"_106":243,"_100":32,"_163":176,"_165":244,"_166":22,"_167":-5,"_168":245,"_98":246},"1e25cad6-09ac-11f0-9a93-569c3dd06744","MessagePart.tsx","1e25cb8a-09ac-11f0-9a93-569c3dd06744",5,["D",1742929529322],"/** @jsxImportSource https://esm.sh/react@18.2.0?dev */\nimport { type Message } from \"https://esm.sh/@ai-sdk/react?dev&deps=react@18.2.0&react-dom@18.2.0\";\nimport ReactMarkdown from \"https://esm.sh/react-markdown?dev&deps=react@18.2.0&react-dom@18.2.0\";\nimport { ImagePreview } from \"./ImageUpload.tsx\";\n\nexport function MessagePart({ part }: { part: NonNullable[number] }) {\n if (part.type === \"text\") return {part.text};\n if (part.type === \"reasoning\")\n return (\n

\n Reasoning...\n

\n {part.reasoning}\n {part.details && part.details.map((detail, index) => (\n

\n {detail.text}\n

\n ))}\n

\n );\n if (part.type === \"tool-invocation\") {\n let { step, state, toolName, args } = part.toolInvocation;\n \n // Properly conjugate command verbs to present participle form\n const getCommandVerb = (command: string): string => {\n switch (command) {\n case \"view\": return \"viewing\";\n case \"create\": return \"creating\";\n case \"str_replace\": return \"replacing\";\n case \"insert\": return \"inserting\";\n case \"undo_edit\": return \"undoing edit\";\n default: return command + \"ing\"; // Fallback for unknown commands\n }\n };\n \n let name = toolName === \"str_replace_editor\"\n ? getCommandVerb(args.command) + \" \" + args.path + (args.view_range ?? \"\")\n : toolName;\n return (\n

\n {name}\n

\n          {JSON.stringify(part.toolInvocation, null, 2)}\n

\n );\n }\n if (part.type === \"source\") {\n return

TODO Source: {JSON.stringify(part.source)}

;\n }\n if (part.type === \"file\") {\n return (\n

{atob(part.data)}

\n );\n }\n if (part.type === \"image\") {\n // Handle both formats: {image: {url: string}} and {image: string}\n const imageUrl = typeof part.image === 'string' \n ? part.image \n : part.image.url || (part.image as any).source?.url;\n \n return (\n

\n $\"Uploaded$ \n

\n );\n }\n // Handle multiple images in a single part\n if (part.type === \"images\") {\n return img.url)} />;\n }\n}",[],[200,207,240],{"_104":248,"_95":249,"_155":250,"_157":208,"_158":140,"_159":209,"_161":118,"_106":251,"_100":32,"_163":176,"_165":252,"_166":22,"_167":-5,"_168":253,"_98":254},"1e1d7b88-09ac-11f0-bbb4-569c3dd06744","Projects.tsx","1e1d7c28-09ac-11f0-bbb4-569c3dd06744",["D",1742929529269],"/** @jsxImportSource https://esm.sh/react@18.2.0?dev */\nimport React, { useState, useEffect } from \"https://esm.sh/react@18.2.0?dev\";\n\n// Component for the loading spinner\nconst LoadingSpinner = () => (\n

\n);\n\nasync function loader({ bearerToken }: { bearerToken: string }) {\n const data = await (await fetch(\"/api/projects-loader\", {\n headers: {\n \"Authorization\": \"Bearer \" + bearerToken,\n },\n })).json();\n return data;\n}\n\nexport function Projects({ bearerToken, setProject }: { bearerToken: string; setProject: any }) {\n const [loaderData, setLoaderData] = useState();\n const [isLoading, setIsLoading] = useState(true);\n\n useEffect(\n () => {\n setIsLoading(true);\n loader({ bearerToken })\n .then(setLoaderData)\n .finally(() => setIsLoading(false));\n },\n [],\n );\n\n return (\n

\n {isLoading ? (\n
\n Loading projects\n
\n
\n ) : loaderData?.profile?.username ? (\n <>\n \n @{loaderData?.profile?.username}\n \n 's Projects\n \n ) : (\n \"Your Projects\"\n )}\n

\n \n {isLoading ? (\n \n ) : (\n loaderData?.projects?.map((p: any) => (\n setProject({...p, username: loaderData?.profile?.username})}\n >\n

{p.name}

\n ))\n )}\n \n );\n}",[],[200,207,249],[200,207],{"_104":257,"_95":258,"_155":259,"_157":201,"_158":140,"_159":202,"_161":118,"_106":260,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":261,"_98":270},"1e0e680a-09ac-11f0-a4aa-569c3dd06744","utils","33ba411e-c800-4beb-ba9b-df039d46ab27",["D",1742929529169],[262],{"_104":263,"_95":264,"_155":265,"_157":259,"_158":140,"_159":202,"_161":118,"_106":266,"_100":32,"_163":176,"_165":267,"_166":22,"_167":-5,"_168":268,"_98":269},"1e0e573e-09ac-11f0-a4aa-569c3dd06744","soundEffects.ts","1e0e5806-09ac-11f0-a4aa-569c3dd06744",["D",1742929529169],"/**\n * Sound effects utility functions for the application\n */\n\n/**\n * Plays a bell sound notification using the Web Audio API\n * @returns A Promise that resolves when the sound has started playing\n */\nexport function playBellSound(): Promise {\n return new Promise((resolve) => {\n try {\n // Create audio context\n const AudioContext = window.AudioContext || (window as any).webkitAudioContext;\n if (!AudioContext) {\n console.warn(\"Web Audio API not supported in this browser\");\n resolve();\n return;\n }\n \n const audioCtx = new AudioContext();\n const masterGain = audioCtx.createGain();\n masterGain.connect(audioCtx.destination);\n \n // Bell frequency ratios (fundamental and overtones)\n const ratios = [1, 2, 2.4, 3, 4, 5.4];\n const baseFreq = 440; // Fundamental frequency\n \n // Create and connect oscillators for each frequency component\n ratios.forEach((ratio, i) => {\n const osc = audioCtx.createOscillator();\n const gain = audioCtx.createGain();\n \n // Connect this oscillator chain\n osc.connect(gain);\n gain.connect(masterGain);\n \n // Set frequency based on ratio\n osc.frequency.value = baseFreq * ratio;\n \n // Amplitude decreases for higher overtones\n const volume = 0.2 / (i + 1);\n \n // Set envelope\n const now = audioCtx.currentTime;\n gain.gain.setValueAtTime(0, now);\n gain.gain.linearRampToValueAtTime(volume, now + 0.01);\n \n // Different decay times for different harmonics\n const decayTime = 1.0 + (i * 0.3);\n gain.gain.exponentialRampToValueAtTime(0.001, now + decayTime);\n \n // Start and stop\n osc.start(now);\n osc.stop(now + decayTime);\n });\n \n // Resolve the promise after a short delay to ensure sound has started\n setTimeout(resolve, 50);\n } catch (error) {\n console.error(\"Error playing bell sound:\", error);\n resolve(); // Resolve anyway to prevent hanging promises\n }\n });\n}\n\n/**\n * Plays a simple notification sound using the Web Audio API\n * This is a simpler, shorter bell sound\n * @returns A Promise that resolves when the sound has started playing\n */\nexport function playSimpleNotification(): Promise {\n return new Promise((resolve) => {\n try {\n // Create audio context\n const AudioContext = window.AudioContext || (window as any).webkitAudioContext;\n if (!AudioContext) {\n console.warn(\"Web Audio API not supported in this browser\");\n resolve();\n return;\n }\n \n const audioCtx = new AudioContext();\n \n // Create oscillator (sound generator)\n const oscillator = audioCtx.createOscillator();\n oscillator.type = 'sine';\n oscillator.frequency.value = 900;\n \n // Create gain node for volume control\n const gainNode = audioCtx.createGain();\n \n // Connect the audio nodes\n oscillator.connect(gainNode);\n gainNode.connect(audioCtx.destination);\n \n // Get current time reference\n const now = audioCtx.currentTime;\n \n // Set volume envelope for bell-like sound\n gainNode.gain.setValueAtTime(0, now);\n gainNode.gain.linearRampToValueAtTime(0.3, now + 0.01);\n gainNode.gain.exponentialRampToValueAtTime(0.001, now + 0.5);\n \n // Start and stop the sound\n oscillator.start(now);\n oscillator.stop(now + 0.5);\n \n // Resolve the promise after a short delay\n setTimeout(resolve, 50);\n } catch (error) {\n console.error(\"Error playing notification sound:\", error);\n resolve(); // Resolve anyway to prevent hanging promises\n }\n });\n}",[],[200,258,264],[200,258],{"_104":272,"_95":273,"_155":274,"_157":201,"_158":140,"_159":275,"_161":118,"_106":276,"_100":32,"_163":176,"_165":277,"_166":22,"_167":-5,"_168":278,"_98":279},"1e3c245c-09ac-11f0-bd74-569c3dd06744","index.tsx","1e3c251a-09ac-11f0-bd74-569c3dd06744",7,["D",1742929529472],"/** @jsxImportSource https://esm.sh/react@18.2.0?dev */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client?dev\";\nimport { App } from \"./components/App.tsx\";\n\ncreateRoot(document.getElementById(\"root\")).render();",[],[200,273],[200],{"_104":282,"_95":283,"_155":284,"_157":-5,"_158":140,"_159":285,"_161":118,"_106":286,"_100":32,"_163":193,"_165":287,"_166":22,"_167":-5,"_168":288,"_98":289},"1e15fbce-09ac-11f0-aed7-569c3dd06744","README.md","1e15fc78-09ac-11f0-aed7-569c3dd06744",3,["D",1742929529221],"# OpenTownie\n\nOpenTownie is a Val Town Project that lets you edit other Val Town Projects with Claude 3.7 Sonnet.\n\nIt uses agentic tool-calling, taking manh read, write, and thinking steps autonomously when carrying out your instructions. \n\n### Todos\n\n- [ ] Give it all the code (except maybe .txt files) as initial context (like cursor sonnet max)\n- [ ] Rebuild as React Router?\n- [ ] Persistent threads?\n- [ ] Have it default to creating a new branch off main and then embedding and iframe to the resulting http val and give you a link to a pr opening url\n- [ ] A way to upload docs, by URL? A mini site to recursively crawl docs and markdownify?\n- [x] Show reasoning in a detail\n- [x] Consider asking it to write the minimum code possible \n- [x] Add caching (post in the vercel ai discussion about how it's not working)\n- [x] For login, have a button that reloads the page\n- [x] Start a timer for messages\n- [x] Add more indicators that it's \"still working\"\n- [x] Require users supply their own Anthropic token?\n- [x] Add cost indications on messages\n- [x] Add a bell noise when the message is done to let us know\n- [x] Launch!\n- [x] Let it select the branch name from a dropdown\n- [x] Consider giving it a tool to replace whole files\n- [x] prompt it to use the thinking tool\n- [x] delete file command",[],[283],{"_104":291,"_95":99,"_155":116,"_157":-5,"_158":140,"_159":292,"_161":118,"_106":293,"_100":32,"_163":294,"_165":295,"_166":22,"_167":-5,"_168":296,"_98":297},"1e42de8c-09ac-11f0-85c7-569c3dd06744",8,["D",1742929529516],"http","import { Hono } from \"npm:hono\";\nimport { app as backend } from \"./backend/index.ts\";\n\nconst app = new Hono();\n\napp.route(\"/api\", backend);\napp.get(\"/\", async (c) => {\n return c.html(\n `\n \n OpenTownie\n \n \n \n \n

\n \n \n \n `,\n );\n});\n\n// Unwrap and rethrow Hono errors as the original error\n// If you delete this, all errors will be \"Internal Server Error\"\napp.onError((err, c) => {\n throw err;\n});\n\nexport default app.fetch;",[],[99],"files",[152,170,180,188,198,205,212,220,229,238,247,256,262,271,281,290],"counts",{"_302":32,"_303":160,"_304":32,"_305":32},"pulls","branches","forks","envVars","contents",[],{"_104":291,"_158":140,"_155":116,"_95":99,"_165":295,"_163":294,"_100":32,"_157":-5,"_106":309,"_159":292,"_167":-5,"_98":310},["D",1742929529516],[99],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.code.$",{"_93":94,"_95":96,"_97":43,"_100":101,"_98":99,"_102":319,"_150":324,"_298":373,"_193":374,"_306":377,"_378":-5,"_379":22,"_380":-5,"_381":-5,"_382":-5,"_383":384},{"_104":105,"_95":96,"_106":320,"_108":-5,"_109":22,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":116,"_117":118,"_119":-5,"_120":32,"_16":121,"_122":123,"_124":123,"_125":126,"_127":126,"_128":126,"_129":123,"_130":123,"_23":321,"_134":322,"_137":323,"_149":22},["D",1742929529016],{"_93":94,"_132":133},{"_93":94,"_136":133},{"_100":139,"_95":43,"_104":140,"_141":105,"_142":-5,"_143":-5,"_144":-5,"_145":-5,"_146":-5,"_147":96,"_148":94},[325,337,367,370],{"_104":153,"_95":154,"_155":156,"_157":-5,"_158":140,"_159":160,"_161":118,"_106":162,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":326,"_98":336},[327,330,333],{"_104":171,"_95":172,"_155":173,"_157":156,"_158":140,"_159":174,"_161":118,"_106":175,"_100":32,"_163":176,"_165":177,"_166":22,"_167":-5,"_168":328,"_98":329},[],[154,172],{"_104":181,"_95":99,"_155":182,"_157":156,"_158":140,"_159":183,"_161":118,"_106":184,"_100":32,"_163":176,"_165":185,"_166":22,"_167":-5,"_168":331,"_98":332},[],[154,99],{"_104":189,"_95":190,"_155":191,"_157":156,"_158":140,"_159":160,"_161":118,"_106":192,"_100":32,"_163":193,"_165":194,"_166":22,"_167":-5,"_168":334,"_98":335},[],[154,190],[154],{"_104":199,"_95":200,"_155":201,"_157":-5,"_158":140,"_159":202,"_161":118,"_106":203,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":338,"_98":366},[339,357,363],{"_104":206,"_95":207,"_155":208,"_157":201,"_158":140,"_159":209,"_161":118,"_106":210,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":340,"_98":356},[341,344,347,350,353],{"_104":213,"_95":214,"_155":215,"_157":208,"_158":140,"_159":101,"_161":118,"_106":216,"_100":32,"_163":176,"_165":217,"_166":22,"_167":-5,"_168":342,"_98":343},[],[200,207,214],{"_104":221,"_95":222,"_155":223,"_157":208,"_158":140,"_159":224,"_161":118,"_106":225,"_100":32,"_163":176,"_165":226,"_166":22,"_167":-5,"_168":345,"_98":346},[],[200,207,222],{"_104":230,"_95":231,"_155":232,"_157":208,"_158":140,"_159":233,"_161":118,"_106":234,"_100":32,"_163":176,"_165":235,"_166":22,"_167":-5,"_168":348,"_98":349},[],[200,207,231],{"_104":239,"_95":240,"_155":241,"_157":208,"_158":140,"_159":242,"_161":118,"_106":243,"_100":32,"_163":176,"_165":244,"_166":22,"_167":-5,"_168":351,"_98":352},[],[200,207,240],{"_104":248,"_95":249,"_155":250,"_157":208,"_158":140,"_159":209,"_161":118,"_106":251,"_100":32,"_163":176,"_165":252,"_166":22,"_167":-5,"_168":354,"_98":355},[],[200,207,249],[200,207],{"_104":257,"_95":258,"_155":259,"_157":201,"_158":140,"_159":202,"_161":118,"_106":260,"_100":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_168":358,"_98":362},[359],{"_104":263,"_95":264,"_155":265,"_157":259,"_158":140,"_159":202,"_161":118,"_106":266,"_100":32,"_163":176,"_165":267,"_166":22,"_167":-5,"_168":360,"_98":361},[],[200,258,264],[200,258],{"_104":272,"_95":273,"_155":274,"_157":201,"_158":140,"_159":275,"_161":118,"_106":276,"_100":32,"_163":176,"_165":277,"_166":22,"_167":-5,"_168":364,"_98":365},[],[200,273],[200],{"_104":282,"_95":283,"_155":284,"_157":-5,"_158":140,"_159":285,"_161":118,"_106":286,"_100":32,"_163":193,"_165":287,"_166":22,"_167":-5,"_168":368,"_98":369},[],[283],{"_104":291,"_95":99,"_155":116,"_157":-5,"_158":140,"_159":292,"_161":118,"_106":293,"_100":32,"_163":294,"_165":295,"_166":22,"_167":-5,"_168":371,"_98":372},[],[99],[325,327,330,333,337,339,341,344,347,350,353,357,359,363,367,370],{"_104":291,"_158":140,"_155":116,"_95":99,"_165":295,"_163":294,"_100":32,"_157":-5,"_106":375,"_159":292,"_167":-5,"_98":376},["D",1742929529516],[99],[],"upstream","showCompareCallout","pull","ahead","behind","templates",[],"actionData","errors"]

Hi

Create New Branch

Login

\n {isLoading ? (\n \n Loading projects\n \n \n ) : loaderData?.profile?.username ? (\n <>\n \n @{loaderData?.profile?.username}\n \n 's Projects\n \n ) : (\n \"Your Projects\"\n )}\n

\n {isLoading ? (\n
\n Loading projects\n
\n
\n ) : loaderData?.profile?.username ? (\n <>\n \n @{loaderData?.profile?.username}\n \n 's Projects\n \n ) : (\n \"Your Projects\"\n )}\n

dcm31

OpenTownie_1742929529007