Zon File Editor

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_216":217,"_218":219},"routes/_app.x.$handle.$name",{"_100":99,"_33":48,"_108":87,"_28":109,"_13":14,"_110":-5,"_11":111,"_112":113,"_114":115,"_116":117,"_118":119,"_21":-5,"_120":121,"_122":123,"_124":43,"_125":126,"_127":26,"_128":-5,"_129":-5,"_130":131},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_46":47,"_33":48,"_37":49,"_50":-5,"_51":43,"_52":53,"_54":53,"_55":-5,"_56":-5,"_18":57,"_58":44,"_59":26,"_60":26,"_61":-5,"_62":63,"_64":65,"_66":-5,"_67":-5,"_68":-5,"_69":-5,"_70":71,"_72":71,"_73":74,"_75":74,"_76":74,"_77":71,"_78":71,"_79":80,"_81":82,"_83":84,"_85":43},"version",4,"changes",[19,20],"aiChatInfo","userId",{"_21":42,"_23":-7,"_25":43,"_27":43,"_28":21,"_30":21},{"_21":22,"_23":24,"_25":26,"_27":26,"_28":29,"_30":29},"file",{"_31":32,"_33":29,"_34":29,"_35":36,"_37":38,"_39":14,"_40":41,"_25":26},"previous",{"_31":32,"_33":29,"_34":29,"_35":36},"deleted",true,"deletedHere","path","http","latestPath","fileId","521b1e39-8f4a-4f0f-8269-f7819b90943a","name","fileType","content","/** @jsxImportSource npm:hono@latest/jsx */\n\nimport { Hono } from \"npm:hono\";\nimport { Context } from \"npm:hono\";\nimport { PropsWithChildren } from \"npm:hono/jsx\";\nimport { jsxRenderer } from \"npm:hono/jsx-renderer\";\n\nimport ValTown from \"npm:@valtown/sdk\";\n\nconst app = new Hono();\n\n// File type definitions\ninterface FileType {\n name: string;\n extension: string;\n icon: string;\n color: string;\n description: string;\n template: string;\n}\n\nconst FILE_TYPES: Record = {\n http: {\n name: \"HTTP\",\n extension: \"ts\",\n icon: \"globe\",\n color: \"green\",\n description: \"HTTP endpoint handler\",\n template: `export default async function(req: Request): Promise {\n return new Response(\"Hello World\", {\n headers: { \"Content-Type\": \"text/plain\" }\n });\n}`,\n },\n cron: {\n name: \"Cron\",\n extension: \"ts\",\n icon: \"clock\",\n color: \"blue\",\n description: \"Scheduled task handler\",\n template: `export default async function(interval: Interval) {\n console.log(\"Cron job executed at:\", new Date().toISOString());\n // Your scheduled task logic here\n}`,\n },\n email: {\n name: \"Email\",\n extension: \"ts\",\n icon: \"mail\",\n color: \"purple\",\n description: \"Email handler\",\n template: `export default async function(email: Email) {\n console.log(\"Received email from:\", email.from);\n console.log(\"Subject:\", email.subject);\n console.log(\"Body:\", email.text);\n // Your email processing logic here\n}`,\n },\n json: {\n name: \"JSON\",\n extension: \"json\",\n icon: \"file-json\",\n color: \"yellow\",\n description: \"JSON configuration file\",\n template: `{\n \"name\": \"example\",\n \"version\": \"1.0.0\",\n \"description\": \"JSON configuration file\"\n}`,\n },\n ts: {\n name: \"TypeScript\",\n extension: \"ts\",\n icon: \"file-code\",\n color: \"blue\",\n description: \"TypeScript file\",\n template: `// TypeScript file\nexport function example(): string {\n return \"Hello from TypeScript!\";\n}`,\n },\n js: {\n name: \"JavaScript\",\n extension: \"js\",\n icon: \"file-code\",\n color: \"yellow\",\n description: \"JavaScript file\",\n template: `// JavaScript file\nexport function example() {\n return \"Hello from JavaScript!\";\n}`,\n },\n md: {\n name: \"Markdown\",\n extension: \"md\",\n icon: \"file-text\",\n color: \"gray\",\n description: \"Markdown documentation\",\n template: `# Title\n\nThis is a markdown file.\n\n## Features\n\n- Feature 1\n- Feature 2\n- Feature 3`,\n },\n};\n\n// Helper function to detect file type\nfunction detectFileType(filename: string, valType?: string): FileType {\n if (valType && FILE_TYPES[valType]) {\n return FILE_TYPES[valType];\n }\n\n const extension = filename.split(\".\").pop()?.toLowerCase();\n\n // Check by extension\n for (const [key, type] of Object.entries(FILE_TYPES)) {\n if (type.extension === extension) {\n return type;\n }\n }\n\n // Default to TypeScript\n return FILE_TYPES.ts;\n}\n\n// JSX renderer setup\napp.use(\n \"*\",\n jsxRenderer(({ children }: PropsWithChildren) => {\n return (\n \n \n Zon File Editor\n \n \n \n \n \n \n \n \n

{children}

\n \n \n \n \n {children}\n \n \n \n \n {children}\n

Diff · v4