[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_282":283,"_284":285},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":-7,"_18":19,"_17":-7,"_213":-5,"_20":214,"_22":215,"_216":217,"_218":219,"_26":220,"_24":221,"_222":-5,"_223":-5,"_224":55,"_225":226,"_227":46,"_228":-5,"_229":-5,"_230":231},"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","wolf","name","EmailAttachmentLog","branchName","main","version","path","shared","project",{"_34":158,"_13":14,"_47":159,"_160":-5,"_161":55,"_162":163,"_164":163,"_165":166,"_167":-5,"_168":169,"_170":93,"_171":46,"_172":-5,"_173":44,"_174":60,"_175":176,"_177":-5,"_178":-5,"_179":-5,"_180":-5,"_181":182,"_183":182,"_184":185,"_186":185,"_187":185,"_188":182,"_189":182,"_190":191,"_192":193,"_194":195,"_196":55},"tree",[64,65,66,67,68,69,70],"file",{"_34":58,"_41":42,"_37":40,"_13":19,"_52":-5,"_50":59,"_17":60,"_39":-5,"_47":61,"_43":62,"_56":-5,"_18":63},"contents",[33],"upstream","pull","ahead","behind","envVars",{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":57},"id","967ddab0-206c-11f0-81fd-569c3dd06744","storage.ts","fileId","8794604a-2068-11f0-8d10-569c3dd06744","parentId","8ec4cb88-7999-4fd0-8f61-4264c3581755","branchId","64a8d8a0-2067-11f0-93e9-569c3dd06744","branchVersion",109,"latest",true,"createdAt",["D",1745431120175],9,"fileType","script","content","import { blob } from \"https://esm.town/v/std/blob\";\n\n// Blob storage prefix to organize data\nconst BLOB_PREFIX = \"email-attachment-viewer/\";\n\nexport interface Attachment {\n id: string;\n filename: string;\n contentType: string;\n size: number;\n receivedAt: string;\n from: string;\n subject: string;\n}\n\n// Store an attachment\nexport async function storeAttachment(id: string, content: string, metadata: Attachment): Promise {\n // Store content if available\n if (content) {\n await blob.set(`${BLOB_PREFIX}attachment:${id}:content`, content);\n }\n\n // Always store metadata\n await blob.setJSON(`${BLOB_PREFIX}attachment:${id}:metadata`, metadata);\n\n // Update list of attachments\n let ids = [];\n try {\n const list = await blob.getJSON(`${BLOB_PREFIX}attachments:list`);\n ids = Array.isArray(list) ? list : [];\n } catch {\n ids = [];\n }\n\n ids.push(id);\n await blob.setJSON(`${BLOB_PREFIX}attachments:list`, ids);\n}\n\n// Get all attachments\nexport async function getAllAttachments(): Promise {\n try {\n // Get list of IDs\n let ids = [];\n try {\n const list = await blob.getJSON(`${BLOB_PREFIX}attachments:list`);\n ids = Array.isArray(list) ? list : [];\n } catch {\n return [];\n }\n\n // Get metadata for each attachment\n const attachments = [];\n for (const id of ids) {\n try {\n const metadata = await blob.getJSON(`${BLOB_PREFIX}attachment:${id}:metadata`);\n attachments.push(metadata);\n } catch {\n // Skip attachments with missing metadata\n }\n }\n\n // Sort by date (newest first)\n return attachments.sort((a, b) => new Date(b.receivedAt).getTime() - new Date(a.receivedAt).getTime());\n } catch (error) {\n console.error(\"Error getting attachments:\", error);\n return [];\n }\n}\n\n// Get attachment content\nexport async function getAttachment(id: string): Promise<{ metadata: Attachment; content: string } | null> {\n try {\n // Get metadata\n const metadata = await blob.getJSON(`${BLOB_PREFIX}attachment:${id}:metadata`);\n if (!metadata) {\n return null;\n }\n\n // Try to get content\n let content;\n try {\n content = await blob.get(`${BLOB_PREFIX}attachment:${id}:content`);\n } catch (error) {\n console.log(`Content not available for attachment ${id}`);\n content = \"Content not available\";\n }\n\n return { metadata, content: content || \"Content not available\" };\n } catch (error) {\n console.error(`Error retrieving attachment ${id}:`, error);\n return null;\n }\n}","deleted",false,"label",[19,36],"2aa60154-2068-11f0-9a9c-569c3dd06744","directory",0,["D",1745429221259],10,[19],{"_34":143,"_13":144,"_37":145,"_39":-5,"_41":42,"_43":146,"_45":46,"_47":147,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_79":148,"_18":149},{"_34":117,"_13":118,"_37":119,"_39":-5,"_41":42,"_43":76,"_45":46,"_47":120,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_79":121,"_18":122},{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":62,"_45":46,"_47":110,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_79":111,"_18":112},{"_34":102,"_13":103,"_37":104,"_39":-5,"_41":42,"_43":105,"_45":46,"_47":106,"_17":60,"_50":24,"_52":107,"_54":55,"_56":-5,"_79":108,"_18":109},{"_34":91,"_13":92,"_37":93,"_39":-5,"_41":42,"_43":94,"_45":46,"_47":95,"_17":96,"_50":97,"_52":98,"_54":55,"_56":99,"_79":100,"_18":101},{"_34":82,"_13":83,"_37":84,"_39":-5,"_41":42,"_43":85,"_45":46,"_47":86,"_17":87,"_50":51,"_52":88,"_54":55,"_56":-5,"_79":89,"_18":90},{"_34":71,"_13":72,"_37":73,"_39":-5,"_41":42,"_43":74,"_45":46,"_47":75,"_17":76,"_50":77,"_52":78,"_54":55,"_56":-5,"_79":80,"_18":81},"8ba9440e-6edb-11f0-9850-0224a6c84d84","handler.ts","79cc476c-206c-11f0-83bf-569c3dd06744",127,["D",1754054966843],13,"email","import { storeAttachment } from \"./shared/storage.ts\";\n\nexport default async function (e: Email) {\n if (!e.attachments || e.attachments.length === 0) {\n console.log(\"No attachments found in email\");\n return;\n }\n\n const file = e.attachments[0];\n const id = crypto.randomUUID();\n\n let b64Content: string;\n try {\n // Get the file as an ArrayBuffer\n const arrayBuffer = await file.arrayBuffer();\n\n // Convert to Base64 for storage\n b64Content = arrayBufferToB64(arrayBuffer);\n\n console.log(`Successfully extracted content as Base64, length: ${b64Content.length}`);\n } catch (error) {\n console.error(\"Error extracting file content:\", error);\n b64Content = \"\";\n }\n\n await storeAttachment(id, b64Content, {\n id,\n filename: file.name || \"unnamed-file\",\n contentType: file.type || \"application/octet-stream\",\n size: file.size || 0,\n receivedAt: new Date().toISOString(),\n from: e.from,\n subject: e.subject || \"(No subject)\",\n });\n}\n\nfunction arrayBufferToB64(buffer) {\n const bytes = new Uint8Array(buffer);\n const binary = Array.from(bytes)\n .map((byte) => String.fromCharCode(byte))\n .join(\"\");\n return btoa(binary);\n}","children",[],[72],"3a69b5be-206c-11f0-a7f4-569c3dd06744","getFiles.ts","9df3fc92-2068-11f0-a2cb-569c3dd06744",96,["D",1745430965693],2,"// Email trigger entry point\nimport emailHandler from \"./email-handler.ts\";\n\nexport default emailHandler;",[],[83],"47286116-6edb-11f0-849f-0224a6c84d84","dashboard.ts","9ae7f526-2068-11f0-a255-569c3dd06744",121,["D",1754054851905],3,"http","import app from \"./backend/index.ts\";\n\nexport default app;","emailed",[],[92],"a3952c70-2068-11f0-9398-569c3dd06744","README.md","a3952d6a-2068-11f0-9398-569c3dd06744",40,["D",1745429424155],"# Minimal Email Attachment Dashboard\n\nA minimal Val Town project that receives email attachments and displays them in a clean, black and white dashboard.\n\n## Structure\n\n```\n├── backend/\n│ └── index.ts # Minimal Hono app\n├── frontend/\n│ ├── App.tsx # React component\n│ └── index.html # Minimal HTML shell\n├── shared/\n│ └── storage.ts # Blob storage utilities\n├── dashboard.ts # HTTP entry point\n├── email-handler.ts # Email processing\n└── getFiles.ts # Email trigger\n```\n\n## Features\n\n- Receives emails with attachments\n- Stores attachments in blob storage\n- Displays attachments in a minimal React UI\n- Allows viewing and downloading attachments\n\n## Tech\n\n- React 18\n- Hono\n- Tailwind CSS\n- Val Town blob storage",[],[103],["D",1745429221259],[113],[19],{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":114,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_79":115,"_18":116},["D",1745431120175],[],[19,36],"46ea0e6e-2068-11f0-8e52-569c3dd06744","frontend","8d277cca-cfd5-45bf-b361-a361e0c7e013",["D",1745429268683],[123,124],[118],{"_34":134,"_13":135,"_37":136,"_39":119,"_41":42,"_43":137,"_45":46,"_47":138,"_17":139,"_50":51,"_52":140,"_54":55,"_56":-5,"_79":141,"_18":142},{"_34":125,"_13":126,"_37":127,"_39":119,"_41":42,"_43":128,"_45":46,"_47":129,"_17":130,"_50":24,"_52":131,"_54":55,"_56":-5,"_79":132,"_18":133},"fc8197d8-2068-11f0-b589-569c3dd06744","index.html","7574ce9a-2068-11f0-89db-569c3dd06744",45,["D",1745429573339],1,"\n\n\n \n \n Attachments\n \n \n\n\n

\n \n\n",[],[118,126],"b2f15416-206b-11f0-afe4-569c3dd06744","App.tsx","f59ecbba-2069-11f0-83a5-569c3dd06744",86,["D",1745430738411],16,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport React, { useEffect, useState, useRef } from \"https://esm.sh/react@18.2.0\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport copy from \"https://esm.sh/copy-to-clipboard@3.3.3\";\n\ninterface Attachment {\n id: string;\n filename: string;\n contentType: string;\n size: number;\n receivedAt: string;\n from: string;\n subject: string;\n}\n\nconst App: React.FC = () => {\n const [attachments, setAttachments] = useState([]);\n const [loading, setLoading] = useState(true);\n const [error, setError] = useState(null);\n const [selectedAttachment, setSelectedAttachment] = useState(null);\n const [copied, setCopied] = useState(false);\n const [isFullscreen, setIsFullscreen] = useState(false);\n const viewerRef = useRef(null);\n \n // Get email address from window object (injected by the server)\n const emailAddress = (window as any).emailAddress || \"unknown@example.com\";\n const sourceUrl = (window as any).sourceUrl || \"#\";\n const appName = (window as any).appName || \"Remarkable Viewer\";\n\n const copyEmailToClipboard = () => {\n copy(emailAddress);\n setCopied(true);\n setTimeout(() => setCopied(false), 2000); // Reset after 2 seconds\n };\n \n const toggleFullscreen = () => {\n setIsFullscreen(!isFullscreen);\n };\n\n useEffect(() => {\n const fetchAttachments = async () => {\n try {\n const response = await fetch(\"/api/attachments\");\n if (!response.ok) {\n throw new Error(\"Failed to fetch attachments\");\n }\n const data = await response.json();\n setAttachments(data);\n } catch (err) {\n setError(err instanceof Error ? err.message : \"Unknown error\");\n } finally {\n setLoading(false);\n }\n };\n\n fetchAttachments();\n }, []);\n\n const formatDate = (dateString: string) => {\n const date = new Date(dateString);\n return date.toLocaleString();\n };\n\n const formatFileSize = (bytes: number) => {\n if (bytes < 1024) return bytes + \" bytes\";\n else if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + \" KB\";\n else return (bytes / (1024 * 1024)).toFixed(1) + \" MB\";\n };\n \n const formatSender = (email: string) => {\n // Extract name or username from email if possible\n const match = email.match(/^\"?([^\"@]+)\"?\\s*<.*>$/) || email.match(/^([^@]+)@/);\n return match ? match[1] : email;\n };\n\n return (\n

{appName}

\n View your Remarkable documents sent via email to: {\" \"}\n \n {emailAddress}\n {copied && ✓ Copied!}\n \n

\n View Source\n

\n\n {loading ? (\n

Loading documents...

\n ) : error ? (\n

Error: {error}

\n ) : attachments.length === 0 ? (\n

No documents found

\n Send PDF documents to {\" \"}\n \n {emailAddress}\n {copied && ✓ Copied!}\n \n {\" \"} to view them here.\n

\n ) : (\n

Documents

setSelectedAttachment(attachment.id)}\n >\n
{attachment.filename}
\n
\n {formatFileSize(attachment.size)}\n {formatDate(attachment.receivedAt)}\n
\n

\n \n

\n {selectedAttachment ? (\n <>\n

\n {attachments.find(a => a.id === selectedAttachment)?.filename || \"Document\"}\n

\n \n \n Download\n \n \n