\n \n \n \n\n",[],[161,178],"2e31d64a-08c6-11f0-95cf-569c3dd06744","components","5258744f-43e2-420e-83ea-1ed323ddcf10",["D",1742830771958],[192],[161,187],{"_36":193,"_13":194,"_67":195,"_69":188,"_71":72,"_73":196,"_75":76,"_38":197,"_17":198,"_79":80,"_81":199,"_83":51,"_84":-5,"_132":200,"_18":201},"e0e5f594-430b-11f0-9278-76b3cceeab13","App.tsx","fec0ec8e-b4f4-4da7-884a-019af796678b",603,["D",1749237874493],12,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState } from \"https://esm.sh/react@18.2.0\";\n\ninterface WebsiteAnalysis {\n baseUrl: string;\n pages: Array<{\n url: string;\n title: string;\n elements: Array<{\n elementId: string;\n type: string;\n content: string;\n importance: number;\n dataType: string;\n selectionCode: string;\n reason: string;\n }>;\n }>;\n generatedCode: string;\n summary: {\n totalPages: number;\n totalElements: number;\n mostImportantElements: Array<{\n url: string;\n elementId: string;\n importance: number;\n type: string;\n reason: string;\n }>;\n };\n}\n\nexport function App() {\n const [url, setUrl] = useState(\"\");\n const [maxPages, setMaxPages] = useState(5);\n const [loading, setLoading] = useState(false);\n const [analysis, setAnalysis] = useState(null);\n const [error, setError] = useState(null);\n const [activeTab, setActiveTab] = useState<'overview' | 'pages' | 'code'>('overview');\n\n const handleAnalyze = async (e: React.FormEvent) => {\n e.preventDefault();\n if (!url) return;\n\n setLoading(true);\n setError(null);\n setAnalysis(null);\n\n try {\n const response = await fetch(\"/api/analyze-website\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ url, maxPages }),\n });\n\n const data = await response.json();\n\n if (data.success) {\n setAnalysis(data.analysis);\n } else {\n setError(data.error);\n }\n } catch {\n setError(\"Failed to analyze website\");\n } finally {\n setLoading(false);\n }\n };\n\n const copyToClipboard = (text: string) => {\n navigator.clipboard.writeText(text);\n };\n\n return (\n

APIIfy

\n Turn a website into an API\n

\n\n

\n \n Website URL\n \n setUrl(e.target.value)}\n placeholder=\"https://example.com\"\n className=\"w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n required\n />\n

\n\n

\n \n Max Pages to crawl\n \n setMaxPages(parseInt(e.target.value) || 5)}\n min=\"1\"\n max=\"20\"\n className=\"w-full px-4 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n />\n

\n\n \n {loading ? \"Analyzing Website...\" : \"Analyze Website\"}\n \n \n

\n\n {error && (\n

\n Error: {error}\n

\n )}\n\n {analysis && (\n

\n {/* Tab Navigation */}\n

\n {[\n { id: 'overview', label: 'Overview' },\n { id: 'pages', label: 'Pages & Elements' },\n { id: 'code', label: 'Generated Code' },\n ].map((tab) => (\n setActiveTab(tab.id as any)}\n className={`py-4 px-1 border-b-2 font-medium text-sm ${activeTab === tab.id\n ? 'border-blue-500 text-blue-600'\n : 'border-transparent text-gray-500 hover:text-gray-700'\n }`}\n >\n {tab.label}\n \n ))}\n

\n\n

\n {activeTab === 'overview' && (\n

Analysis Summary

{analysis.summary.totalPages}

Pages Analyzed

{analysis.summary.totalElements}

Useful Elements Found

{analysis.summary.mostImportantElements.length}

High Priority Elements

\n\n

Most Important Elements

\n {analysis.summary.mostImportantElements.slice(0, 5).map((element, index) => (\n

\n {element.type}\n on {new URL(element.url).pathname}\n

\n \n Importance: {element.importance}/10\n \n

\n ))}\n

\n )}\n\n {activeTab === 'pages' && (\n

\n {analysis.pages.map((page, pageIndex) => (\n

{page.title}

\n \n {page.url}\n \n

\n\n

Elements ({page.elements.length})

\n {page.elements.slice(0, 5).map((element, elementIndex) => (\n

\n {element.type}\n ({element.dataType})\n {element.content && (\n

\n {element.content}\n

\n )}\n

{element.reason}

\n \n {element.importance}/10\n \n

\n ))}\n {page.elements.length > 5 && (\n

\n ... and {page.elements.length - 5} more elements\n

\n )}\n

\n ))}\n

\n )}\n\n {activeTab === 'code' && (\n

Generated Automation Code

\n copyToClipboard(analysis.generatedCode)}\n className=\"bg-gray-100 hover:bg-gray-200 text-gray-700 px-4 py-2 rounded-md text-sm font-medium\"\n >\n Copy Code\n \n

\n                    {analysis.generatedCode}\n

\n )}\n

\n );\n}\n",[],[161,187,194],["D",1742830771958],[205,206,207,208,209],[19],{"_36":110,"_13":111,"_67":112,"_69":70,"_71":72,"_73":113,"_75":76,"_38":251,"_17":100,"_79":108,"_81":-5,"_83":51,"_84":-5,"_132":252,"_18":253},{"_36":103,"_13":104,"_67":105,"_69":70,"_71":72,"_73":106,"_75":76,"_38":219,"_17":100,"_79":108,"_81":-5,"_83":51,"_84":-5,"_132":220,"_18":221},{"_36":95,"_13":96,"_67":97,"_69":70,"_71":72,"_73":98,"_75":76,"_38":216,"_17":100,"_79":80,"_81":101,"_83":51,"_84":-5,"_132":217,"_18":218},{"_36":86,"_13":87,"_67":88,"_69":70,"_71":72,"_73":89,"_75":76,"_38":213,"_17":34,"_79":91,"_81":92,"_83":51,"_84":93,"_132":214,"_18":215},{"_36":65,"_13":66,"_67":68,"_69":70,"_71":72,"_73":74,"_75":76,"_38":210,"_17":78,"_79":80,"_81":82,"_83":51,"_84":-5,"_132":211,"_18":212},["D",1749234163748],[],[19,66],["D",1749237874436],[],[19,87],["D",1749217924020],[],[19,96],["D",1749232950507],[222,223,224],[19,104],{"_36":242,"_13":243,"_67":244,"_69":105,"_71":72,"_73":245,"_75":76,"_38":246,"_17":247,"_79":80,"_81":248,"_83":51,"_84":-5,"_132":249,"_18":250},{"_36":233,"_13":234,"_67":235,"_69":105,"_71":72,"_73":236,"_75":76,"_38":237,"_17":238,"_79":80,"_81":239,"_83":51,"_84":-5,"_132":240,"_18":241},{"_36":225,"_13":226,"_67":227,"_69":105,"_71":72,"_73":228,"_75":76,"_38":229,"_17":100,"_79":80,"_81":230,"_83":51,"_84":-5,"_132":231,"_18":232},"6aec3818-4300-11f0-b8ae-76b3cceeab13","utils.ts","6aec38d6-4300-11f0-b8ae-76b3cceeab13",495,["D",1749232952135],"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