Zon Gallery

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_258":259,"_260":261},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_197":-5,"_20":198,"_22":199,"_200":201,"_202":203,"_26":204,"_24":205,"_206":-5,"_207":-5,"_208":52,"_209":210,"_211":43,"_212":-5,"_213":-5,"_214":215},"routes/_app.x.$handle.$name.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":-5,"_29":-5,"_30":-5,"_31":-5,"_32":-5},"handle","dinavinter","name","registry","branchName","main","version","path","sync","project",{"_33":143,"_13":14,"_44":144,"_145":-5,"_146":52,"_147":148,"_149":148,"_150":-5,"_151":-5,"_152":153,"_154":118,"_155":43,"_156":43,"_157":-5,"_158":159,"_160":161,"_162":-5,"_163":-5,"_164":-5,"_165":-5,"_166":167,"_168":167,"_169":170,"_171":170,"_172":170,"_173":167,"_174":167,"_175":176,"_177":178,"_179":180,"_181":52},"tree",[55,56,57,58,59,60,61,62,63],"file",{"_33":34,"_13":19,"_35":36,"_37":-5,"_38":39,"_40":41,"_42":43,"_44":45,"_17":46,"_47":48,"_49":50,"_51":52,"_53":-5,"_18":54},"contents",[],"upstream","pull","ahead","behind","envVars","id","fa26a754-43a8-11f0-b323-76b3cceeab13","fileId","ac6c4b76-438b-11f0-8544-76b3cceeab13","parentId","branchId","11ccc098-4389-11f0-8ad2-76b3cceeab13","branchVersion",196,"latest",true,"createdAt",["D",1749305347880],12,"fileType","interval","content","import * as Y from \"https://esm.sh/yjs@13.6.23?target=esnext\";\nimport { connectYjs } from \"https://esm.town/v/dinavinter/connect\";\nimport { openKv } from \"https://esm.town/v/pomdtr/kv\";\nimport ValTown from \"npm:@valtown/sdk\";\n\nconst kv = openKv();\nconst valsDoc = connectYjs(`@vals`);\nconst fileMap = valsDoc.getMap<{ path: string; type: \"file\" | \"http\" | \"directory\" }>(\"files\");\nconst client = new ValTown();\n\nexport default async function(interval: Interval) {\n try {\n await sync();\n } catch (err) {\n console.error(err);\n return;\n }\n console.log(\"Finished syncing all Val Town vals and files to both Yjs and KV storage\");\n}\n\nexport async function sync() {\n console.log(`Running Val Town to Yjs and KV sync: ${new Date().toISOString()}`);\n\n const vals = await client.me.vals.list({\n limit: 100,\n offset: 0,\n }).then(res => res.data);\n\n // Store list of zons in KV for the zons page\n const zonsList = vals.map(val => ({\n name: val.name,\n id: val.id,\n description: val.description || \"\",\n createdAt: val.createdAt || \"\",\n author: val.author || { username: \"\" },\n type: val.type || \"\",\n likeCount: 0,\n referenceCount: 0,\n }));\n \n await kv.set(\"zons:list\", zonsList);\n console.log(`Stored ${zonsList.length} zons in KV list`);\n\n for (const val of vals) {\n await valSync(val);\n }\n}\n\ntype File = {\n path: string;\n type: \"file\" | \"directory\" | \"http\";\n name: string;\n val: string;\n key: string;\n lastModified: string;\n version: string;\n} & Record;\n\nasync function valSync({ id, name, ...meta }: { name: string; id: string }) {\n try {\n const files = await (client.vals.files.retrieve(id, {\n path: \"\",\n recursive: true,\n }) as Promise<{ data: File[] }>)\n .then(res => res.data)\n .then(ff =>\n ff.map(({ path, name: fileName, ...file }) => ({\n ...file,\n key: `${name}:${path || fileName}`,\n path,\n name: fileName,\n val: id,\n }))\n );\n\n const filteredFiles = files.filter(({ type }) => type !== \"directory\");\n\n // Sync to Yjs\n const valMap = valsDoc.getMap(name);\n valsDoc.transact(() => {\n valMap.set(\"name\", name);\n valMap.set(\"id\", id);\n for (const [key, val] of Object.entries(meta)) {\n valMap.set(key, val);\n }\n valMap.set(\"files\", filteredFiles.map(({ key }) => key));\n\n filteredFiles.forEach(({ key, ...file }) =>\n fileMap.set(key, {\n ...file,\n val: id,\n })\n );\n });\n\n // Store val metadata in KV\n const valData = {\n name,\n id,\n ...meta,\n files: filteredFiles.map(({ key }) => key),\n };\n \n await kv.set(`val:${name}`, valData);\n\n // Store each file metadata and content in KV, and sync content to Yjs\n for (const { key, ...file } of filteredFiles) {\n // Store file metadata in KV\n await kv.set(`file:${key}`, {\n ...file,\n val: id,\n });\n\n // Get and store file content\n try {\n const content = await client.vals.files.getContent(id, { \n path: file.path, \n name: file.name \n }).then(res => res.text());\n \n // Sync content to Yjs\n const yText = valsDoc.getText(key);\n valsDoc.transact(() => {\n yText.delete(0, yText.length);\n yText.insert(0, content);\n });\n \n // Store content in KV (with size limit)\n if (content.length < 1000000) {\n await kv.set(`content:${key}`, content);\n } else {\n console.warn(`Skipping large file ${key} (${content.length} chars) for KV storage`);\n }\n \n console.log(`Synced file to both Yjs and KV: ${key}`);\n } catch (err) {\n console.error(`Error syncing content for ${key}:`, err);\n }\n }\n\n console.log(`Synced val to both Yjs and KV: ${name} with ${filteredFiles.length} files`);\n } catch (err) {\n console.error(`Error syncing val ${name}:`, err);\n }\n}","deleted",false,"label",[19],{"_33":135,"_13":136,"_35":137,"_37":-5,"_38":39,"_40":138,"_42":43,"_44":139,"_17":46,"_47":24,"_49":140,"_51":52,"_53":-5,"_72":141,"_18":142},{"_33":126,"_13":127,"_35":128,"_37":-5,"_38":39,"_40":129,"_42":43,"_44":130,"_17":131,"_47":24,"_49":132,"_51":52,"_53":-5,"_72":133,"_18":134},{"_33":117,"_13":24,"_35":118,"_37":-5,"_38":39,"_40":119,"_42":43,"_44":120,"_17":121,"_47":70,"_49":122,"_51":52,"_53":123,"_72":124,"_18":125},{"_33":107,"_13":108,"_35":109,"_37":-5,"_38":39,"_40":110,"_42":43,"_44":111,"_17":112,"_47":70,"_49":113,"_51":52,"_53":114,"_72":115,"_18":116},{"_33":97,"_13":98,"_35":99,"_37":-5,"_38":39,"_40":100,"_42":43,"_44":101,"_17":102,"_47":70,"_49":103,"_51":52,"_53":104,"_72":105,"_18":106},{"_33":87,"_13":88,"_35":89,"_37":-5,"_38":39,"_40":90,"_42":43,"_44":91,"_17":92,"_47":70,"_49":93,"_51":52,"_53":94,"_72":95,"_18":96},{"_33":34,"_13":19,"_35":36,"_37":-5,"_38":39,"_40":41,"_42":43,"_44":84,"_17":46,"_47":48,"_49":50,"_51":52,"_53":-5,"_72":85,"_18":86},{"_33":75,"_13":76,"_35":77,"_37":-5,"_38":39,"_40":78,"_42":43,"_44":79,"_17":80,"_47":70,"_49":81,"_51":52,"_53":76,"_72":82,"_18":83},{"_33":64,"_13":65,"_35":66,"_37":-5,"_38":39,"_40":67,"_42":43,"_44":68,"_17":69,"_47":70,"_49":71,"_51":52,"_53":65,"_72":73,"_18":74},"8d8bb764-43a9-11f0-b2b2-76b3cceeab13","zons","2e1b0a5c-4389-11f0-9ba6-76b3cceeab13",202,["D",1749305595167],18,"http","/** @jsxImportSource https://esm.sh/hono@latest/jsx */\nimport { jsxRenderer } from \"https://esm.sh/hono/jsx-renderer\";\nimport { openKv } from \"https://esm.town/v/pomdtr/kv\";\nimport { Hono } from \"npm:hono\";\nimport { PropsWithChildren } from \"npm:hono/jsx\";\nimport config from \"./config.json\" with { type: \"json\" };\n\nconst app = new Hono();\n\napp.use(\n \"/*\",\n jsxRenderer(({ children }: PropsWithChildren) => {\n return (\n \n \n \n \n Zon Gallery\n \n \n \n \n \n {children}\n \n \n \n \n {children}\n \n \n \n \n \n \n

{children}

\n \n \n \n \n \n \n

{children}

\n \n \n \n \n \n \n

{children}

\n \n \n \n \n \n \n

{children}