\n \n \n \n",[],[83,115],"b0249554-08ce-11f0-a41a-569c3dd06744","components","77fb8aa0-23f3-4b09-8299-7e7ff39a72a6",["D",1742834425984],[127],[83,122],{"_35":128,"_13":129,"_65":130,"_67":123,"_68":69,"_70":131,"_72":73,"_37":132,"_17":71,"_76":110,"_77":133,"_79":53,"_80":-5,"_97":134,"_18":135},"4fd691e2-08cf-11f0-a9ec-569c3dd06744","App.tsx","ac662191-809a-4388-896a-f460013b5bff",2,["D",1742834693911],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\nexport function App() {\n const [url, setUrl] = useState(\"\");\n const [isLoading, setIsLoading] = useState(false);\n const [result, setResult] = useState<{\n success: boolean;\n message: string;\n projectUrl?: string;\n } | null>(null);\n const [error, setError] = useState(null);\n\n const handleSubmit = async (e: React.FormEvent) => {\n e.preventDefault();\n \n if (!url) {\n setError(\"Please enter a URL\");\n return;\n }\n\n try {\n setIsLoading(true);\n setError(null);\n setResult(null);\n \n const response = await fetch(\"/api/scrape\", {\n method: \"POST\",\n headers: {\n \"Content-Type\": \"application/json\",\n },\n body: JSON.stringify({ url }),\n });\n \n const data = await response.json();\n \n if (!response.ok) {\n throw new Error(data.message || \"Failed to scrape website\");\n }\n \n setResult(data);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"An unknown error occurred\");\n } finally {\n setIsLoading(false);\n }\n };\n\n return (\n

Website to API Generator

\n Enter a URL to scrape a website and generate an API based on its content\n

\n \n \n \n {error && (\n

{error}

\n )}\n \n {result && (\n

\n {result.success ? \"Success!\" : \"Error\"}\n

{result.message}

\n {result.projectUrl && (\n \n View Generated API\n \n )}\n

\n )}\n

\n );\n}",[],[83,122,129],["D",1742834425984],[139,140,141],[89],{"_35":181,"_13":182,"_65":183,"_67":90,"_68":69,"_70":71,"_72":73,"_37":184,"_17":75,"_76":86,"_77":-5,"_79":53,"_80":-5,"_97":185,"_18":186},{"_35":151,"_13":152,"_65":153,"_67":90,"_68":69,"_70":71,"_72":73,"_37":154,"_17":75,"_76":86,"_77":-5,"_79":53,"_80":-5,"_97":155,"_18":156},{"_35":142,"_13":143,"_65":144,"_67":90,"_68":69,"_70":145,"_72":73,"_37":146,"_17":71,"_76":147,"_77":148,"_79":53,"_80":-5,"_97":149,"_18":150},"bb21bd5a-08cf-11f0-b6d6-569c3dd06744","index.ts","cf914214-0eb3-4c51-8142-deb5c6328ec1",4,["D",1742834873916],"http","import { serveFile } from \"https://esm.town/v/std/utils@64-main/index.ts\";\nimport { Hono } from \"npm:hono\";\nimport { createNewScraperProject } from \"./valtown/project.ts\";\nimport { vt } from \"./valtown/sdk.ts\";\n\nconst app = new Hono();\n\n// Serve index.html at the root /\napp.get(\"/\", async (c) => {\n return serveFile(\"/frontend/index.html\", import.meta.url);\n});\n\n// Serve all /frontend files\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path, import.meta.url));\n\n// API endpoint to handle website scraping and API generation\napp.post(\"/api/scrape\", async (c) => {\n try {\n const { url } = await c.req.json();\n \n if (!url) {\n return c.json({ success: false, message: \"URL is required\" }, 400);\n }\n \n // Create a new branch name based on the domain\n const domain = new URL(url).hostname.replace(/[^a-zA-Z0-9]/g, \"_\");\n const branchName = `scraper_${domain}_${Date.now()}`;\n \n // Fork the template project\n const newBranch = await createNewScraperProject(branchName);\n \n // Get the project ID from the new branch\n const projectId = newBranch.projectId;\n \n // Generate route file for scraping the website\n const routeFileName = \"routes/scrape.ts\";\n const routeContent = generateScraperRouteCode(url);\n \n // Create the route file in the forked project\n await vt.projects.files.create(projectId, {\n branchId: newBranch.id,\n path: routeFileName,\n content: routeContent,\n });\n \n // Get the current index.ts file\n const indexFileResponse = await vt.projects.files.getContent(projectId, {\n branchId: newBranch.id,\n path: \"index.ts\",\n });\n \n const indexContent = await indexFileResponse.text();\n \n // Update the index.ts file to include the new route\n const updatedIndexContent = updateIndexFile(indexContent);\n \n // Update the index.ts file in the forked project\n await vt.projects.files.update(projectId, {\n branchId: newBranch.id,\n path: \"index.ts\",\n content: updatedIndexContent,\n });\n \n // Get the project URL\n const projectUrl = `https://val.town/v/${newBranch.username}/${newBranch.projectName}/${branchName}`;\n \n return c.json({\n success: true,\n message: \"API successfully generated!\",\n projectUrl,\n });\n } catch (error) {\n console.error(\"Error generating API:\", error);\n return c.json({\n success: false,\n message: error instanceof Error ? error.message : \"Failed to generate API\",\n }, 500);\n }\n});\n\n// Function to generate the scraper route code\nfunction generateScraperRouteCode(url: string): string {\n return `import { z } from \"https://esm.sh/@hono/zod-openapi@0.18.4\";\nimport { createRoute } from \"https://esm.sh/@hono/zod-openapi@0.18.4\";\nimport { JSDOM } from \"https://esm.sh/jsdom@22.1.0\";\n\n// The URL to scrape\nconst TARGET_URL = \"${url}\";\n\nexport const scrapeParams = z.object({\n selector: z\n .string()\n .optional()\n .openapi({ \n example: \"h1\", \n description: \"CSS selector to target specific elements (optional)\" \n }),\n});\n\nexport const scrapeRoute = createRoute({\n method: \"get\",\n path: \"/scrape\",\n summary: \"Scrape content from ${url}\",\n description: \"Fetches and parses the content from the target website using JSDOM\",\n request: {\n query: scrapeParams,\n },\n responses: {\n 200: {\n content: {\n \"application/json\": {\n schema: z.object({ \n url: z.string(),\n title: z.string(),\n content: z.record(z.string(), z.any()),\n elements: z.array(z.any()),\n }),\n },\n },\n description: \"Successfully scraped website content\",\n },\n 500: {\n content: {\n \"application/json\": {\n schema: z.object({ \n error: z.string() \n }),\n },\n },\n description: \"Failed to scrape website\",\n },\n },\n});\n\n// Helper function to extract text content from elements\nfunction extractElements(document: Document, selector: string) {\n const elements = Array.from(document.querySelectorAll(selector));\n return elements.map(el => ({\n tagName: el.tagName.toLowerCase(),\n text: el.textContent?.trim() || \"\",\n html: el.innerHTML,\n attributes: getAttributes(el),\n }));\n}\n\n// Helper function to get element attributes\nfunction getAttributes(element: Element) {\n const attributes: Record = {};\n for (const attr of element.attributes) {\n attributes[attr.name] = attr.value;\n }\n return attributes;\n}\n\n// Helper function to extract common page data\nfunction extractPageData(document: Document) {\n return {\n title: document.title,\n headings: {\n h1: extractElements(document, \"h1\").map(el => el.text),\n h2: extractElements(document, \"h2\").map(el => el.text),\n h3: extractElements(document, \"h3\").map(el => el.text),\n },\n links: extractElements(document, \"a\").map(el => ({\n text: el.text,\n href: el.attributes.href,\n })),\n images: extractElements(document, \"img\").map(el => ({\n alt: el.attributes.alt,\n src: el.attributes.src,\n })),\n meta: extractElements(document, \"meta[name], meta[property]\").reduce((acc, el) => {\n const key = el.attributes.name || el.attributes.property;\n if (key) {\n acc[key] = el.attributes.content;\n }\n return acc;\n }, {} as Record),\n };\n}\n`;\n}\n\n// Function to update the index.ts file to include the new route\nfunction updateIndexFile(indexContent: string): string {\n // Add import for the scrape route\n let updatedContent = indexContent.replace(\n 'import { greetRoute } from \"./routes/greet.ts\";',\n 'import { greetRoute } from \"./routes/greet.ts\";\\nimport { scrapeRoute } from \"./routes/scrape.ts\";'\n );\n \n // Add the route handler\n updatedContent = updatedContent.replace(\n 'app.openapi(greetRoute, (c) => {',\n 'app.openapi(scrapeRoute, async (c) => {\\n' +\n ' try {\\n' +\n ' const { selector } = c.req.valid(\"query\");\\n' +\n ' \\n' +\n ' // Fetch the target URL\\n' +\n ' const response = await fetch(TARGET_URL);\\n' +\n ' if (!response.ok) {\\n' +\n ' throw new Error(`Failed to fetch URL: ${response.status}`);\\n' +\n ' }\\n' +\n ' \\n' +\n ' const html = await response.text();\\n' +\n ' \\n' +\n ' // Parse the HTML with JSDOM\\n' +\n ' const dom = new JSDOM(html);\\n' +\n ' const document = dom.window.document;\\n' +\n ' \\n' +\n ' // Extract page data\\n' +\n ' const pageData = extractPageData(document);\\n' +\n ' \\n' +\n ' // If a selector is provided, extract those specific elements\\n' +\n ' const selectedElements = selector ? extractElements(document, selector) : [];\\n' +\n ' \\n' +\n ' return c.json({\\n' +\n ' url: TARGET_URL,\\n' +\n ' title: document.title,\\n' +\n ' content: pageData,\\n' +\n ' elements: selectedElements,\\n' +\n ' }, 200);\\n' +\n ' } catch (error) {\\n' +\n ' console.error(\"Scraping error:\", error);\\n' +\n ' return c.json({ error: error instanceof Error ? error.message : \"Failed to scrape website\" }, 500);\\n' +\n ' }\\n' +\n '});\\n\\n' +\n 'app.openapi(greetRoute, (c) => {'\n );\n \n // Update the OpenAPI documentation title and description\n updatedContent = updatedContent.replace(\n 'title: \"Greet user API\",',\n 'title: \"Website Scraper API\",'\n );\n \n return updatedContent;\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\n// HTTP vals expect an exported \"fetch handler\"\n// This is how you \"run the server\" in Val Town with Hono\nexport default app.fetch;\n",[],[89,143],"b02490ae-08ce-11f0-a41a-569c3dd06744","valtown","749ba341-a0e0-4881-9a0d-768cbe8cd9f3",["D",1742834425984],[157,158,159],[89,152],{"_35":174,"_13":175,"_65":176,"_67":153,"_68":69,"_70":71,"_72":73,"_37":177,"_17":75,"_76":110,"_77":178,"_79":53,"_80":-5,"_97":179,"_18":180},{"_35":167,"_13":168,"_65":169,"_67":153,"_68":69,"_70":71,"_72":73,"_37":170,"_17":75,"_76":110,"_77":171,"_79":53,"_80":-5,"_97":172,"_18":173},{"_35":160,"_13":161,"_65":162,"_67":153,"_68":69,"_70":71,"_72":73,"_37":163,"_17":75,"_76":110,"_77":164,"_79":53,"_80":-5,"_97":165,"_18":166},"b0248c80-08ce-11f0-a41a-569c3dd06744","utils.ts","2685aa8b-0c87-4b41-a13c-7b3143d22ec1",["D",1742834425984],"import ValTown from \"jsr:@valtown/sdk\";\nimport { vt } from \"./sdk.ts\";\n\n/**\n * Lists all branches for a given project and finds the ID of the specified branch name.\n *\n * @param {string} projectId - The ID of the project to search branches within.\n * @param {string} branchName - The name of the branch to find.\n * @returns {Promise} - The ID of the specified branch.\n * @throws {Deno.errors.NotFound} If the branch with the specified name is not found.\n */\nexport async function branchIdToBranch(\n projectId: string,\n branchName: string,\n): Promise {\n for await (\n const branch of vt.projects.branches.list(projectId, {\n limit: 100,\n offset: 0,\n })\n ) if (branch.name === branchName) return branch;\n throw new Deno.errors.NotFound(`Branch '${branchName}' not found`);\n}\n\n/**\n * Forks a new branch from a specified source branch within a project.\n *\n * @param {string} projectId - The ID of the project where the branch will be created.\n * @param {string} newBranchName - The name of the new branch to create.\n * @param {string} sourceBranchId - The ID of the branch to fork from.\n * @returns {Promise