\n setIsVisible(true)}\n onMouseLeave={() => setIsVisible(false)}\n >\n {children}\n

\n {isVisible && (\n \n {content}\n

\n \n )}\n \n );\n}\n\nfunction formatBytes(bytes: number, decimals = 2) {\n if (bytes === 0) return \"0 Bytes\";\n const k = 1024;\n const dm = decimals < 0 ? 0 : decimals;\n const sizes = [\"Bytes\", \"KB\", \"MB\", \"GB\", \"TB\", \"PB\", \"EB\", \"ZB\", \"YB\"];\n const i = Math.floor(Math.log(bytes) / Math.log(k));\n return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + \" \" + sizes[i];\n}\n\nfunction copyToClipboard(text: string) {\n navigator.clipboard.writeText(text).then(() => {\n console.log(\"Text copied to clipboard\");\n }).catch(err => {\n console.error(\"Failed to copy text: \", err);\n });\n}\n\nfunction ActionMenu({ blob, onDownload, onRename, onDelete, onMoveToPublic, onMoveOutOfPublic }) {\n const [isOpen, setIsOpen] = useState(false);\n const menuRef = useRef(null);\n const isPublic = blob.key.startsWith(\"__public/\");\n const publicUrl = isPublic ? `${window.location.origin}/api/public/${encodeURIComponent(blob.key.slice(9))}` : null;\n\n useEffect(() => {\n function handleClickOutside(event) {\n if (menuRef.current && !menuRef.current.contains(event.target)) {\n event.stopPropagation();\n setIsOpen(false);\n }\n }\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n const handleAction = (e, action) => {\n e.stopPropagation();\n setIsOpen(false);\n action();\n };\n\n const handleClick = (e) => {\n e.stopPropagation();\n setIsOpen(!isOpen);\n };\n\n return (\n

\n \n {isOpen && (\n

\n handleAction(e, () => onDownload(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Download\n \n handleAction(e, () => onRename(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Rename\n \n handleAction(e, () => onDelete(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Delete\n \n {isPublic\n ? (\n handleAction(e, () => onMoveOutOfPublic(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Move out of public folder\n \n )\n : (\n handleAction(e, () => onMoveToPublic(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Move to public folder\n \n )}\n {isPublic && (\n handleAction(e, () => copyToClipboard(publicUrl))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Copy public link\n \n )}\n

\n )}\n

\n );\n}\n\nfunction BlobItem({ blob, onSelect, isSelected, onDownload, onRename, onDelete, onMoveToPublic, onMoveOutOfPublic }) {\n const [isLoading, setIsLoading] = useState(false);\n const decodedKey = decodeURIComponent(blob.key);\n const truncatedName = decodedKey;\n\n const handleClick = async () => {\n setIsLoading(!isSelected);\n await onSelect(blob);\n setIsLoading(false);\n };\n\n return (\n \n

\n \n \n \n

\n {truncatedName}\n

\n {formatBytes(blob.size)} • Last modified: {new Date(blob.lastModified).toLocaleString()}\n

\n {isLoading\n ?

\n : (\n \n )}\n

\n \n );\n}\n\ninterface Blob {\n key: string;\n size: number;\n lastModified: string;\n}\n\nfunction App({ initialEmail, initialProfile, sourceURL }) {\n const encodeKey = (key: string) => encodeURIComponent(key);\n const decodeKey = (key: string) => decodeURIComponent(key);\n\n const [blobs, setBlobs] = useState([]);\n const [searchPrefix, setSearchPrefix] = useState(\"\");\n const [limit, setLimit] = useState(20);\n const [selectedBlob, setSelectedBlob] = useState(null);\n const [editContent, setEditContent] = useState(\"\");\n const [email, setEmail] = useState(initialEmail);\n const [profile, setProfile] = useState(initialProfile);\n const [loading, setLoading] = useState(false);\n const [blobContentLoading, setBlobContentLoading] = useState(false);\n const [isDragging, setIsDragging] = useState(false);\n\n const fetchBlobs = useCallback(async () => {\n setLoading(true);\n try {\n const response = await fetch(`/api/blobs?prefix=${encodeKey(searchPrefix)}&limit=${limit}`);\n const data = await response.json();\n setBlobs(data);\n } catch (error) {\n console.error(\"Error fetching blobs:\", error);\n } finally {\n setLoading(false);\n }\n }, [searchPrefix, limit]);\n\n useEffect(() => {\n fetchBlobs();\n }, [fetchBlobs]);\n\n const handleSearch = (e) => {\n const value = e.target.value;\n setSearchPrefix(value);\n };\n\n const handleBlobClick = async (clickedBlob: Blob) => {\n if (selectedBlob && selectedBlob.key === clickedBlob.key) {\n // Deselect if the clicked blob is already selected\n setSelectedBlob(null);\n setEditContent(\"\");\n } else {\n setBlobContentLoading(true);\n try {\n const response = await fetch(`/api/blob?key=${encodeKey(clickedBlob.key)}`);\n const content = await response.text();\n setSelectedBlob({ ...clickedBlob, key: decodeKey(clickedBlob.key) });\n setEditContent(content);\n } catch (error) {\n console.error(\"Error fetching blob content:\", error);\n } finally {\n setBlobContentLoading(false);\n }\n }\n };\n\n const handleSave = async () => {\n try {\n await fetch(`/api/blob?key=${encodeKey(selectedBlob.key)}`, {\n method: \"PUT\",\n body: editContent,\n });\n setBlobs(blobs.map(b => b.key === selectedBlob.key ? { ...b, lastModified: new Date().toISOString() } : b));\n } catch (error) {\n console.error(\"Error saving blob:\", error);\n }\n };\n\n const handleDelete = async (key) => {\n try {\n await fetch(`/api/blob?key=${encodeKey(key)}`, { method: \"DELETE\" });\n setBlobs(blobs.filter(b => b.key !== key));\n if (selectedBlob && selectedBlob.key === key) {\n setSelectedBlob(null);\n }\n } catch (error) {\n console.error(\"Error deleting blob:\", error);\n }\n };\n\n const handleDrop = async (acceptedFiles) => {\n for (const file of acceptedFiles) {\n try {\n const formData = new FormData();\n formData.append(\"file\", file);\n const key = `${searchPrefix}${file.name}`;\n formData.append(\"key\", encodeKey(key));\n await fetch(\"/api/blob\", { method: \"POST\", body: formData });\n const newBlob = { key, size: file.size, lastModified: new Date().toISOString() };\n setBlobs([newBlob, ...blobs]);\n handleBlobClick(newBlob);\n } catch (error) {\n console.error(\"Error uploading file:\", error);\n }\n }\n fetchBlobs();\n };\n\n const { getRootProps, getInputProps, isDragActive } = useDropzone({\n onDrop: handleDrop,\n noClick: true,\n noKeyboard: true,\n });\n\n const handleCreateTextBlob = async () => {\n const key = prompt(\"Enter blob name:\");\n if (key) {\n try {\n const fullKey = `${searchPrefix}${key}`;\n await fetch(`/api/blob?key=${encodeKey(fullKey)}`, {\n method: \"PUT\",\n body: \"\",\n });\n const newBlob = { key: fullKey, size: 0, lastModified: new Date().toISOString() };\n setBlobs([newBlob, ...blobs]);\n handleBlobClick(newBlob);\n } catch (error) {\n console.error(\"Error creating text blob:\", error);\n }\n }\n };\n\n const handleDownload = async (key) => {\n try {\n const response = await fetch(`/api/blob?key=${encodeKey(key)}`);\n const blob = await response.blob();\n const url = window.URL.createObjectURL(blob);\n const a = document.createElement(\"a\");\n a.style.display = \"none\";\n a.href = url;\n a.download = key.split(\"/\").pop();\n document.body.appendChild(a);\n a.click();\n window.URL.revokeObjectURL(url);\n } catch (error) {\n console.error(\"Error downloading blob:\", error);\n }\n };\n\n const handleRename = async (oldKey) => {\n const newKey = prompt(\"Enter new blob name:\", oldKey);\n if (newKey && newKey !== oldKey) {\n try {\n const response = await fetch(`/api/blob?key=${encodeKey(oldKey)}`);\n const content = await response.blob();\n await fetch(`/api/blob?key=${encodeKey(newKey)}`, {\n method: \"PUT\",\n body: content,\n });\n await fetch(`/api/blob?key=${encodeKey(oldKey)}`, { method: \"DELETE\" });\n setBlobs(blobs.map(b => b.key === oldKey ? { ...b, key: newKey } : b));\n if (selectedBlob && selectedBlob.key === oldKey) {\n setSelectedBlob({ ...selectedBlob, key: newKey });\n }\n } catch (error) {\n console.error(\"Error renaming blob:\", error);\n }\n }\n };\n\n const handleMoveToPublic = async (key) => {\n const newKey = `__public/${key}`;\n try {\n const response = await fetch(`/api/blob?key=${encodeKey(key)}`);\n const content = await response.blob();\n await fetch(`/api/blob?key=${encodeKey(newKey)}`, {\n method: \"PUT\",\n body: content,\n });\n await fetch(`/api/blob?key=${encodeKey(key)}`, { method: \"DELETE\" });\n setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));\n if (selectedBlob && selectedBlob.key === key) {\n setSelectedBlob({ ...selectedBlob, key: newKey });\n }\n } catch (error) {\n console.error(\"Error moving blob to public folder:\", error);\n }\n };\n\n const handleMoveOutOfPublic = async (key) => {\n const newKey = key.slice(9); // Remove \"__public/\" prefix\n try {\n const response = await fetch(`/api/blob?key=${encodeKey(key)}`);\n const content = await response.blob();\n await fetch(`/api/blob?key=${encodeKey(newKey)}`, {\n method: \"PUT\",\n body: content,\n });\n await fetch(`/api/blob?key=${encodeKey(key)}`, { method: \"DELETE\" });\n setBlobs(blobs.map(b => b.key === key ? { ...b, key: newKey } : b));\n if (selectedBlob && selectedBlob.key === key) {\n setSelectedBlob({ ...selectedBlob, key: newKey });\n }\n } catch (error) {\n console.error(\"Error moving blob out of public folder:\", error);\n }\n };\n\n const handleCloseBlob = () => {\n setSelectedBlob(null);\n setEditContent(\"\");\n };\n\n return (\n

\n \n

Blob Admin

\n \n View Source\n \n

\n {profile && (\n

\n $\"Profile\"$ \n {profile.username}\n Logout\n

\n )}\n

\n {email\n ? (\n

\n \n

Blobs

\n \n New Text Blob\n \n {\n const file = e.target.files[0];\n if (file) {\n await handleDrop([file]);\n }\n }}\n className=\"hidden\"\n id=\"fileInput\"\n />\n \n Upload File\n \n

\n \n

\n Show:\n setLimit(Number(e.target.value))}\n className=\"px-3 py-2 border rounded bg-gray-700 text-white\"\n >\n \n \n \n \n

\n setSearchPrefix(\"__public/\")}\n className=\"text-blue-400 hover:text-blue-300 text-sm mb-2\"\n >\n View public folder\n \n \n ⓘ\n \n

\n {loading\n ? (\n

\n )\n : (\n

\n ))}\n

\n )}\n

\n {selectedBlob && (\n

{selectedBlob.key}

\n \n ✕\n \n

\n {selectedBlob.key.startsWith(\"__public/\") && (\n

\n Public URL:\n \n copyToClipboard(\n `${window.location.origin}/api/public/${encodeURIComponent(selectedBlob.key.slice(9))}`,\n )}\n className=\"text-blue-400 hover:text-blue-300 text-sm\"\n >\n Copy\n \n

\n )}\n

\n {blobContentLoading\n ? (\n

\n )\n : selectedBlob.key.match(/\\.(jpg|jpeg|png|gif)$/i)\n ? (\n \n console.error(\"Error loading image\")}\n />\n

\n )\n : (\n setEditContent(e.target.value)}\n className=\"w-full h-64 p-2 border rounded bg-gray-700 text-white\"\n />\n )}\n {!selectedBlob.key.match(/\\.(jpg|jpeg|png|gif)$/i) && (\n

\n \n Save\n \n

\n )}\n

\n )}\n \n )\n : (\n

\n \n via LastLogin\n

Want your own Blob Admin?

\n \n Fork This Val\n \n

Blob Admin Features:

Create and manage text and file blobs
Search and filter blobs by prefix
Upload files via drag-and-drop or file input
Edit text blob contents inline
Rename, delete, and download blobs
Create public shareable links for blobs
View and manage public folder
Preview images directly in the interface

\n )}\n \n \n );\n}\n\nconst root = document.getElementById(\"root\");\nconst initialEmail = window.email;\nconst initialProfile = window.profile;\nconst sourceURL = window.sourceURL;\ncreateRoot(root).render(\n ,\n);",[],[110,172],[110],{"_103":181,"_95":182,"_155":183,"_157":-5,"_158":141,"_159":100,"_161":22,"_105":184,"_99":185,"_163":186,"_165":187,"_166":22,"_167":-5,"_168":188,"_98":189},"2ccf8508-7a1e-11f0-9f43-0224a6c84d84","README.md","8cfe7c9c-42ea-11f0-b5eb-76b3cceeab13",["D",1755293046773],4,"file","# Blob Admin\n\nThis is a lightweight Blob Admin interface to view and debug your Blob data.\n\n![Screenshot 2024-11-22 at 15.43.43@2x.png](https://imagedelivery.net/iHX6Ovru0O7AjmyT5yZRoA/d075a4ee-93ec-4cdd-4823-7c8aee593f00/public)\n\nTo use this, fork it to your account. \nAuthentication is handled by @stevekrouse/lastlogin,\nso only the owner of the val will be able to see and edit their own blobs.",[],[182],{"_103":191,"_95":192,"_155":115,"_157":-5,"_158":141,"_159":100,"_161":22,"_105":193,"_99":194,"_163":195,"_165":196,"_166":22,"_167":197,"_168":198,"_98":199},"2ccf86fc-7a1e-11f0-9f43-0224a6c84d84","main.tsx",["D",1755293046773],49,"http","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { type Context, Hono } from \"https://esm.sh/hono\";\nimport { debounce } from \"https://esm.sh/lodash-es\";\nimport React, { ReactNode, useCallback, useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { parseProject, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin_safe\";\n\nconst app = new Hono();\n\napp.get(\"/public/*\", (c: Context) => {\n const url = new URL(c.req.url);\n return serveFile(url.pathname, import.meta.url);\n});\n\n// Public route without authentication\napp.get(\"/api/public/:id\", async (c) => {\n const key = `__public/${c.req.param(\"id\")}`;\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const originalResponse = await blob.get(key);\n if (key.endsWith(\".mp4\")) {\n // Clone original headers and set the correct Content-Type.\n const headers = new Headers(originalResponse.headers);\n headers.set(\"Content-Type\", \"video/mp4\");\n\n // Create a new Response with the same body and status.\n return new Response(originalResponse.body, {\n status: originalResponse.status,\n statusText: originalResponse.statusText,\n headers,\n });\n }\n return originalResponse;\n } catch (e) {\n return c.text(`Blob not found: ${key}`, 404);\n }\n});\n\n// Middleware to check authentication\nconst checkAuth = async (c, next) => {\n const email = c.req.header(\"X-LastLogin-Email\");\n\n if (!email) {\n return c.html(`\n \n \n Blob Admin\n \n \n \n

\n \n \n

\n \n \n `);\n }\n const { ValTown } = await import(\"npm:@valtown/sdk\");\n const vt = new ValTown();\n const { email: authorEmail, profileImageUrl, username } = await vt.me.profile.retrieve();\n // const authorEmail = me.email;\n\n if (email !== authorEmail) {\n return c.html(\n `\n \n \n Access Restricted\n \n \n \n

Access Restricted

\n This Blob Admin is only accessible to ${username}.\n

\n 🔒 You are currently signed in with:
\n ${email}\n

\n To access this val, you must:\n

Sign in with the email associated with your Val Town account
Ensure you are signed in as ${username}

\n \n Logout\n \n \n Sign In\n \n

\n \n View Val Source\n \n

\n \n \n `,\n 403,\n {\n \"X-Restricted-Access\": \"true\",\n },\n );\n }\n\n c.set(\"email\", email);\n c.set(\"profile\", { profileImageUrl, username });\n await next();\n};\n\napp.get(\"/api/blobs\", checkAuth, async (c) => {\n const prefix = c.req.query(\"prefix\") || \"\";\n const limit = parseInt(c.req.query(\"limit\") || \"20\", 10);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const blobList = await blob.list(prefix);\n const result = blobList.slice(0, limit).map(b => ({ ...b, isFolder: false }));\n return c.json(result);\n});\n\napp.get(\"/api/blob\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n if (!key) return c.text(\"Missing key parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const content = await blob.get(key);\n return content;\n});\n\napp.put(\"/api/blob\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n if (!key) return c.text(\"Missing key parameter\", 400);\n const content = await c.req.arrayBuffer();\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n await blob.set(key, content);\n return c.text(\"OK\");\n});\n\napp.delete(\"/api/blob\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n if (!key) return c.text(\"Missing key parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n await blob.delete(key);\n return c.text(\"OK\");\n});\n\napp.post(\"/api/blob\", checkAuth, async (c) => {\n const { file, key } = await c.req.parseBody();\n if (!file || !key) return c.text(\"Missing file or key\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n await blob.set(key, await file.arrayBuffer());\n return c.text(\"OK\");\n});\n\nconst sourceURL = parseProject(import.meta.url).links.self.project;\n\napp.get(\"*\", checkAuth, async (c) => {\n const email = c.get(\"email\");\n const profile = c.get(\"profile\");\n return c.html(`\n \n \n Blob Admin\n \n \n \n

\n \n \n \n \n \n `);\n});\n\nexport default lastlogin((request: Request) => app.fetch(request));","blob",[],[192],"files",[153,170,180,190],"counts",{"_204":32,"_205":121,"_206":207,"_208":32},"pulls","branches","forks",133,"envVars","contents",[211,214,217],{"_103":154,"_95":110,"_155":156,"_157":-5,"_158":141,"_159":160,"_161":22,"_105":212,"_99":32,"_163":164,"_165":-5,"_166":22,"_167":-5,"_98":213},["D",1750188484505],[110],{"_103":181,"_95":182,"_155":183,"_157":-5,"_158":141,"_159":100,"_161":22,"_105":215,"_99":185,"_163":186,"_165":187,"_166":22,"_167":-5,"_98":216},["D",1755293046773],[182],{"_103":191,"_95":192,"_155":115,"_157":-5,"_158":141,"_159":100,"_161":22,"_105":218,"_99":194,"_163":195,"_165":196,"_166":22,"_167":197,"_98":219},["D",1755293046773],[192],"upstreamProject","upstreamBranch","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_101":228,"_99":100,"_233":234},{"_103":104,"_95":96,"_105":229,"_107":-5,"_108":22,"_109":110,"_111":-5,"_112":-5,"_14":113,"_114":115,"_116":117,"_118":119,"_120":121,"_16":122,"_123":124,"_125":124,"_126":127,"_128":127,"_129":127,"_130":124,"_131":124,"_23":230,"_135":231,"_138":232,"_150":22},["D",1744657032829],{"_93":94,"_133":134},{"_93":94,"_137":134},{"_99":140,"_95":43,"_103":141,"_142":104,"_143":-5,"_144":-5,"_145":-5,"_146":-5,"_147":-5,"_148":96,"_149":94},"changes",[235,241],{"_186":236,"_238":239,"_98":192},{"_155":115,"_95":192,"_163":195,"_165":196,"_105":237,"_159":100,"_158":141},["D",1755293046773],"previous",{"_155":115,"_95":192,"_163":195,"_165":240},"/** @jsxImportSource npm:hono/jsx */\nimport { Hono } from \"npm:hono\";\nimport { blob } from \"https://esm.town/v/std/blob\";\nimport { liveReload } from \"https://esm.town/v/stevekrouse/live-reload/main.ts\";\nimport { Home } from \"./Home.tsx\";\nimport { BlobPage } from \"./BlobPage.tsx\";\nimport { isImage, isText } from \"./utils.ts\";\nimport { Layout } from \"./Layout.tsx\";\nimport { NewPage } from \"./NewPage.tsx\";\nimport { LoginPage } from \"./LoginPage.tsx\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin\";\nimport { ValTown } from \"npm:@valtown/sdk\";\nimport { NotAuthorizedPage } from \"./NotAuthorizedPage.tsx\";\n\nconst vt = new ValTown();\nconst { email: authorEmail, username } = await vt.me.profile.retrieve();\n\nconst app = new Hono();\n\n// For backwards-compatibility with the old blob-admin\n// TODO - test that more\napp.get(\"/api/public/:key\", (c) => {\n return blob.get(\"__public/\" + c.req.param(\"key\"));\n});\n\napp.get(\"/public/:key\", (c) => {\n return blob.get(\"__public/\" + c.req.param(\"key\"));\n});\n\napp.get(\"/login\", (c) => {\n const email = c.req.header(\"X-LastLogin-Email\");\n if (email) {\n return c.redirect(\"/\");\n }\n return c.html();\n});\n\n// auth middleware\napp.use(\"*\", async (c, next) => {\n const email = c.req.header(\"X-LastLogin-Email\");\n if (!email) {\n return c.redirect(\"/login\");\n } else if (email != authorEmail) {\n return c.html(\n ,\n );\n }\n await next();\n});\n\n// Home page (table list view)\napp.get(\"/\", async (c) => {\n const prefix = c.req.query(\"prefix\") || \"\";\n const limit = parseInt(c.req.query(\"limit\")) || 10;\n const page = parseInt(c.req.query(\"page\")) || 1;\n\n const blobs = await blob.list(prefix);\n const subset = blobs.slice((page - 1) * limit, page * limit);\n\n return c.html(\n ,\n );\n});\n\n// New page to add new blob\napp.get(\"/new\", (c) => {\n return c.html();\n});\n\n// Single blob page\napp.get(\"/blob/:key\", async (c) => {\n const key = c.req.param(\"key\");\n const matches = await blob.list(key);\n if (matches.length === 0) {\n return c.html();\n } else if (matches.length > 1) {\n return c.html();\n }\n const metadata = matches[0];\n if (isImage(metadata.key)) {\n return c.html();\n }\n if (metadata.size < 1024 || isText(metadata.key)) { // is text or small\n try {\n const blob_ = await blob.get(key);\n const text = await blob_.text();\n return c.html(\n ,\n );\n } catch (err: any) {\n return c.html(\n ,\n );\n }\n }\n return c.html();\n});\n\n// actually get the blob for downloading\napp.get(\"/raw/:key\", (c) => {\n return blob.get(c.req.param(\"key\"));\n});\n\napp.post(\"/blob/:key/delete\", async (c) => {\n const key = c.req.param(\"key\");\n await blob.delete(key);\n return c.redirect(\"/\");\n});\n\n// Used by BlobPage to update blobs\n// and by NewPage to create new blobs\napp.post(\"/update-blob\", async (c) => {\n const formData = await c.req.parseBody();\n const key = formData[\"key\"];\n const file = formData[\"file\"] as File;\n const name = key || file.name;\n if (!name) {\n return c.html(\n \n

Can't set blob without name

\n ,\n );\n }\n if (file instanceof File && file.size > 0) {\n console.log(\"is file\");\n console.log(file.name);\n await blob.set(name, file);\n return c.redirect(\"/blob/\" + encodeURIComponent(name));\n }\n const text = formData[\"text\"];\n if (typeof text === \"string\") {\n await blob.set(name, text);\n return c.redirect(\"/blob/\" + encodeURIComponent(name));\n }\n return c.html(\n \n

Invalid form data

\n ,\n );\n});\n\napp.onError((err) => Promise.reject(err));\nexport default liveReload(lastlogin(app.fetch), import.meta.url);",{"_186":242,"_238":244,"_98":182},{"_155":183,"_95":182,"_163":186,"_165":187,"_105":243,"_159":100,"_158":141},["D",1755293046773],{"_155":183,"_95":182,"_163":186,"_165":245},"# Blob Admin\n\nHand-crafted server-rendered Hono JSX. Back to basics.\n\n## Todo\n\n- [ ] Make a seperate val for hosting public files?\n- [ ] Explain how the public folder works\n- [ ] Button to move blobs into or out of the public folder\n- [ ] Merge this back to the orignal\n- [ ] Ability to rename blobs","actionData","errors"]