\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\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\n// Middleware to check admin access\nconst checkAdminAccess = async (c, next) => {\n const { auth_module } = await import(\"https://esm.town/v/your-username/auth_module\");\n const isAdmin = await auth_module.isAdmin(c.get(\"email\"));\n if (!isAdmin) {\n return c.json({ error: \"Admin access required\" }, 403);\n }\n await next();\n};\n\n// Serve podcast episodes\napp.get(\"/api/podcast/:episodeId\", async (c) => {\n const episodeId = c.req.param(\"episodeId\");\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const key = `podcast_episodes/${episodeId}`;\n const content = await blob.get(key);\n const headers = new Headers();\n headers.set(\"Content-Type\", \"audio/mpeg\");\n headers.set(\"Content-Disposition\", `attachment; filename=\"${episodeId}.mp3\"`);\n return new Response(content, { headers });\n } catch (error) {\n if (error.name === \"ValTownBlobNotFoundError\") {\n return c.text(`Episode not found: ${episodeId}`, 404);\n }\n console.error(\"Error fetching podcast episode:\", error);\n return c.text(\"Failed to fetch podcast episode\", 500);\n }\n});\n\n// List podcast episodes\napp.get(\"/api/podcast/list\", checkAuth, checkAdminAccess, async (c) => {\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const episodes = await blob.list(\"podcast_episodes/\");\n return c.json(episodes);\n } catch (error) {\n console.error(\"Error listing podcast episodes:\", error);\n return c.json({ error: \"Failed to list podcast episodes\" }, 500);\n }\n});\n\n// Delete podcast episode\napp.delete(\"/api/podcast/:episodeId\", checkAuth, checkAdminAccess, async (c) => {\n const episodeId = c.req.param(\"episodeId\");\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const key = `podcast_episodes/${episodeId}`;\n await blob.delete(key);\n return c.text(\"Episode deleted successfully\");\n } catch (error) {\n console.error(\"Error deleting podcast episode:\", error);\n return c.text(\"Failed to delete podcast episode\", 500);\n }\n});\n\n// ... (previous routes remain unchanged)\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 Podcast Admin\n \n \n \n

\n \n \n \n \n `);\n});\n\nexport default lastlogin((request: Request) => app.fetch(request));",[],[99],"files",[154,174],"counts",{"_186":32,"_187":162,"_188":162,"_189":32},"pulls","branches","forks","envVars","contents",[],{"_103":175,"_95":99,"_157":116,"_159":-5,"_160":139,"_161":138,"_163":109,"_105":193,"_100":177,"_165":178,"_167":179,"_169":22,"_170":-5,"_98":194},["D",1743495768053],[99],"upstreamProject",{"_103":146,"_95":197,"_112":-5,"_113":-5,"_110":111,"_23":198},"blob_admin",{"_93":199,"_131":200},"stevekrouse","https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg","upstreamBranch",{"_103":142,"_105":203,"_204":205,"_95":43,"_140":146,"_100":206,"_141":-5,"_143":-5,"_207":208,"_107":-5,"_151":22,"_110":111,"_150":199,"_16":148,"_149":197},["D",1744657032829],"updatedAt",["D",1755556326672],62,"lockfileKey","1755556327825-esm.town_v_stevekrouse_blob_admin@62-main","emptyEnvVars","isNew","flags",[],"routes/_app.x.$handle.$name.branch.$branch.history_.$",{"_93":94,"_95":96,"_97":43,"_98":99,"_101":215,"_166":220,"_223":224,"_254":255,"_264":-7,"_265":32,"_266":22},{"_103":104,"_95":96,"_105":216,"_107":-5,"_108":109,"_110":111,"_112":-5,"_113":-5,"_14":114,"_115":116,"_117":109,"_118":-5,"_119":32,"_16":120,"_121":122,"_123":122,"_124":125,"_126":125,"_127":125,"_128":122,"_129":122,"_23":217,"_133":218,"_136":219,"_151":22},["D",1746128620731],{"_93":94,"_131":132},{"_93":94,"_135":132},{"_100":138,"_95":43,"_103":139,"_140":104,"_141":142,"_143":32,"_144":111,"_145":146,"_147":148,"_149":96,"_150":94},{"_103":175,"_95":99,"_157":116,"_159":-5,"_160":139,"_161":138,"_163":109,"_105":221,"_100":177,"_165":178,"_167":179,"_169":22,"_170":-5,"_98":222},["D",1743495768053],[99],"history",[225,227,232,236,241,246,250],{"_103":175,"_160":139,"_157":116,"_95":99,"_167":179,"_165":178,"_100":177,"_159":-5,"_105":226,"_161":138,"_170":-5},["D",1743495768053],{"_103":228,"_160":139,"_157":116,"_95":99,"_167":229,"_165":178,"_100":230,"_159":-5,"_105":231,"_161":177,"_170":-5},"9571c0c4-26c4-11f0-9a82-569c3dd06744","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { debounce } from \"https://esm.sh/lodash-es\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useDropzone } from \"https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0\";\nimport {\n FaFile,\n FaFileAlt,\n FaFileArchive,\n FaFileAudio,\n FaFileCode,\n FaFilePdf,\n FaFileVideo,\n FaFolder,\n FaImage,\n} from \"https://esm.sh/react-icons@4.10.1/fa?deps=react@18.2.0\";\nimport { dracula } from \"https://esm.sh/react-syntax-highlighter/dist/esm/styles/prism?deps=react@18.2.0\";\nimport { Prism as SyntaxHighlighter } from \"https://esm.sh/react-syntax-highlighter?deps=react@18.2.0\";\nimport React, { ReactNode, useCallback, useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin_safe\";\nimport { LoginWithGoogleButton } from \"https://esm.town/v/stevekrouse/LoginWithGoogleButton\";\n\ninterface TooltipProps {\n children: ReactNode;\n content: string;\n}\n\nfunction Tooltip({ children, content }: TooltipProps) {\n const [isVisible, setIsVisible] = useState(false);\n const tooltipRef = useRef(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (tooltipRef.current && !tooltipRef.current.contains(event.target as Node)) {\n setIsVisible(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n return (\n

\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 getFileIcon(fileName: string) {\n const extension = fileName.split(\".\").pop().toLowerCase();\n switch (extension) {\n case \"jpg\":\n case \"jpeg\":\n case \"png\":\n case \"gif\":\n return ;\n case \"txt\":\n case \"md\":\n return ;\n case \"js\":\n case \"ts\":\n case \"py\":\n case \"html\":\n case \"css\":\n return ;\n case \"pdf\":\n return ;\n case \"zip\":\n case \"rar\":\n case \"7z\":\n return ;\n case \"mp3\":\n case \"wav\":\n case \"ogg\":\n return ;\n case \"mp4\":\n case \"avi\":\n case \"mov\":\n return ;\n default:\n return ;\n }\n}\n\nfunction ActionMenu(\n { blob, onDownload, onRename, onDelete, onMoveToPublic, onMoveOutOfPublic, onShare, onEncrypt, onDecrypt },\n) {\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 handleAction(e, () => onShare(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Share\n \n handleAction(e, () => onEncrypt(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Encrypt\n \n handleAction(e, () => onDecrypt(blob.key))}\n className=\"block w-full text-left px-4 py-2 text-sm text-white hover:bg-gray-600\"\n >\n Decrypt\n \n

\n )}\n

\n );\n}\n\nfunction BlobItem(\n {\n blob,\n onSelect,\n isSelected,\n onDownload,\n onRename,\n onDelete,\n onMoveToPublic,\n onMoveOutOfPublic,\n onShare,\n onEncrypt,\n onDecrypt,\n onDragStart,\n onDragOver,\n onDrop,\n },\n) {\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 const handleDragStart = (e) => {\n e.dataTransfer.setData(\"text/plain\", blob.key);\n onDragStart(blob.key);\n };\n\n return (\n onDragOver(e, blob.key)}\n onDrop={(e) => onDrop(e, blob.key)}\n >\n

\n {blob.isFolder ? : getFileIcon(blob.key)}\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 isFolder: boolean;\n}\n\nfunction App({ initialEmail, initialProfile }) {\n const encodeKey = (key: string) => encodeURIComponent(key);\n const decodeKey = (key: string) => decodeURIComponent(key);\n\n const [blobs, setBlobs] = useState([]);\n const [currentFolder, setCurrentFolder] = 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 const [selectedFiles, setSelectedFiles] = useState([]);\n const [fileTypeFilter, setFileTypeFilter] = useState(\"\");\n const [uploadProgress, setUploadProgress] = useState<{ [key: string]: number }>({});\n const [isLocked, setIsLocked] = useState(false);\n\n const fetchBlobs = useCallback(async () => {\n setLoading(true);\n try {\n const response = await fetch(`/api/blobs?prefix=${encodeKey(currentFolder)}&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 }, [currentFolder, limit]);\n\n useEffect(() => {\n fetchBlobs();\n }, [fetchBlobs]);\n\n const handleSearch = debounce(async (e) => {\n const value = e.target.value;\n setSearchPrefix(value);\n try {\n const response = await fetch(`/api/search?query=${encodeKey(value)}`);\n const data = await response.json();\n setBlobs(data);\n } catch (error) {\n console.error(\"Error searching blobs:\", error);\n }\n }, 300);\n\n const handleBlobClick = async (clickedBlob: Blob) => {\n if (clickedBlob.isFolder) {\n setCurrentFolder(clickedBlob.key);\n return;\n }\n\n if (selectedBlob && selectedBlob.key === clickedBlob.key) {\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 if (isLocked) {\n alert(\"This file is currently locked for editing.\");\n return;\n }\n\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 = `${currentFolder}${file.name}`;\n formData.append(\"key\", encodeKey(key));\n\n const xhr = new XMLHttpRequest();\n xhr.open(\"POST\", \"/api/blob\", true);\n xhr.upload.onprogress = (event) => {\n if (event.lengthComputable) {\n const percentComplete = (event.loaded / event.total) * 100;\n setUploadProgress(prev => ({ ...prev, [key]: percentComplete }));\n }\n };\n xhr.onload = () => {\n if (xhr.status === 200) {\n const newBlob = { key, size: file.size, lastModified: new Date().toISOString(), isFolder: false };\n setBlobs(prev => [newBlob, ...prev]);\n handleBlobClick(newBlob);\n setUploadProgress(prev => {\n const newProgress = { ...prev };\n delete newProgress[key];\n return newProgress;\n });\n }\n };\n xhr.send(formData);\n } catch (error) {\n console.error(\"Error uploading file:\", error);\n }\n }\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 = `${currentFolder}${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(), isFolder: false };\n setBlobs([newBlob, ...blobs]);\n handleBlobClick(newBlob);\n } catch (error) {\n console.error(\"Error creating text blob:\", error);\n }\n }\n };\n\n const handleCreateFolder = async () => {\n const folderName = prompt(\"Enter folder name:\");\n if (folderName) {\n const fullKey = `${currentFolder}${folderName}/`;\n const newFolder = { key: fullKey, size: 0, lastModified: new Date().toISOString(), isFolder: true };\n setBlobs([newFolder, ...blobs]);\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 handleShare = async (key) => {\n try {\n const response = await fetch(`/api/share?key=${encodeKey(key)}`);\n const { shareUrl } = await response.json();\n alert(`Share URL: ${shareUrl}`);\n } catch (error) {\n console.error(\"Error sharing blob:\", error);\n }\n };\n\n const handleEncrypt = async (key) => {\n const password = prompt(\"Enter encryption password:\");\n if (password) {\n try {\n await fetch(`/api/encrypt?key=${encodeKey(key)}&password=${encodeKey(password)}`, { method: \"POST\" });\n alert(\"File encrypted successfully.\");\n } catch (error) {\n console.error(\"Error encrypting blob:\", error);\n }\n }\n };\n\n const handleDecrypt = async (key) => {\n const password = prompt(\"Enter decryption password:\");\n if (password) {\n try {\n await fetch(`/api/decrypt?key=${encodeKey(key)}&password=${encodeKey(password)}`, { method: \"POST\" });\n alert(\"File decrypted successfully.\");\n } catch (error) {\n console.error(\"Error decrypting blob:\", error);\n }\n }\n };\n\n const handleCloseBlob = () => {\n setSelectedBlob(null);\n setEditContent(\"\");\n };\n\n const handleDragStart = (key) => {\n setIsDragging(true);\n };\n\n const handleDragOver = (e, targetKey) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const handleItemDrop = async (e, targetKey) => {\n e.preventDefault();\n e.stopPropagation();\n setIsDragging(false);\n\n const sourceKey = e.dataTransfer.getData(\"text/plain\");\n if (sourceKey === targetKey) return;\n\n try {\n await fetch(`/api/move?sourceKey=${encodeKey(sourceKey)}&targetKey=${encodeKey(targetKey)}`, { method: \"POST\" });\n fetchBlobs();\n } catch (error) {\n console.error(\"Error moving blob:\", error);\n }\n };\n\n const handleFileSelection = (key) => {\n setSelectedFiles(prev => {\n if (prev.includes(key)) {\n return prev.filter(k => k !== key);\n } else {\n return [...prev, key];\n }\n });\n };\n\n const handleBatchDelete = async () => {\n if (window.confirm(`Are you sure you want to delete ${selectedFiles.length} files?`)) {\n try {\n await Promise.all(selectedFiles.map(key => fetch(`/api/blob?key=${encodeKey(key)}`, { method: \"DELETE\" })));\n setBlobs(blobs.filter(b => !selectedFiles.includes(b.key)));\n setSelectedFiles([]);\n } catch (error) {\n console.error(\"Error deleting files:\", error);\n }\n }\n };\n\n const handleBatchMove = async () => {\n const targetFolder = prompt(\"Enter target folder:\");\n if (targetFolder) {\n try {\n await Promise.all(\n selectedFiles.map(key =>\n fetch(\n `/api/move?sourceKey=${encodeKey(key)}&targetKey=${encodeKey(`${targetFolder}/${key.split(\"/\").pop()}`)}`,\n { method: \"POST\" },\n )\n ),\n );\n fetchBlobs();\n setSelectedFiles([]);\n } catch (error) {\n console.error(\"Error moving files:\", error);\n }\n }\n };\n\n const handleLock = async () => {\n if (selectedBlob) {\n try {\n await fetch(`/api/lock?key=${encodeKey(selectedBlob.key)}`, { method: \"POST\" });\n setIsLocked(true);\n } catch (error) {\n console.error(\"Error locking file:\", error);\n }\n }\n };\n\n const handleUnlock = async () => {\n if (selectedBlob) {\n try {\n await fetch(`/api/unlock?key=${encodeKey(selectedBlob.key)}`, { method: \"POST\" });\n setIsLocked(false);\n } catch (error) {\n console.error(\"Error unlocking file:\", error);\n }\n }\n };\n\n const filteredBlobs = blobs.filter(blob => {\n if (!fileTypeFilter) return true;\n const extension = blob.key.split(\".\").pop().toLowerCase();\n return fileTypeFilter === extension;\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 New Folder\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 setFileTypeFilter(e.target.value)}\n className=\"px-3 py-2 border rounded bg-gray-700 text-white\"\n >\n \n \n \n \n \n \n \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 setCurrentFolder(currentFolder.split(\"/\").slice(0, -2).join(\"/\") + \"/\")}\n className=\"text-blue-400 hover:text-blue-300 text-sm\"\n disabled={currentFolder === \"\"}\n >\n ⬆️ Up\n \n {currentFolder || \"Root\"}\n

\n {selectedFiles.length > 0 && (\n

\n \n Delete Selected\n \n \n Move Selected\n \n

\n )}\n

\n {loading\n ? (\n

\n )\n : (\n

handleItemDrop(e, blob.key)}\n />\n ))}\n

\n )}\n {Object.keys(uploadProgress).length > 0 && (\n

Upload Progress

\n {Object.entries(uploadProgress).map(([key, progress]) => (\n

{key}

\n \n

\n ))}\n

\n )}\n

\n {selectedBlob && (\n

{selectedBlob.key}

\n {isLocked\n ? (\n \n Unlock\n \n )\n : (\n \n Lock\n \n )}\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 ml-2\"\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 : selectedBlob.key.match(/\\.(pdf)$/i)\n ? (\n \n \n )\n : selectedBlob.key.match(/\\.(mp3|wav|ogg)$/i)\n ? (\n

\n )\n : selectedBlob.key.match(/\\.(mp4|webm|ogg)$/i)\n ? (\n

\n )\n : selectedBlob.key.match(/\\.(js|ts|py|html|css|json)$/i)\n ? (\n \n {editContent}\n \n )\n : (\n setEditContent(e.target.value)}\n className=\"w-full h-64 p-2 border rounded bg-gray-700 text-white\"\n readOnly={isLocked}\n />\n )}\n {!selectedBlob.key.match(/\\.(jpg|jpeg|png|gif|pdf|mp3|wav|ogg|mp4|webm)$/i) && (\n

\n \n Save\n \n

\n )}\n

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

\n \n \n via LastLogin\n \n

\n )}\n \n \n );\n}\n\nfunction client() {\n const initialEmail = document.getElementById(\"root\").getAttribute(\"data-email\");\n const initialProfile = JSON.parse(document.getElementById(\"root\").getAttribute(\"data-profile\"));\n createRoot(document.getElementById(\"root\")).render(\n ,\n );\n}\n\nif (typeof document !== \"undefined\") {\n client();\n}\n\nconst app = new Hono();\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 try {\n const blobList = await blob.list(prefix);\n const result = blobList.slice(0, limit).map(b => ({ ...b, isFolder: b.key.endsWith(\"/\") }));\n return c.json(result);\n } catch (error) {\n console.error(\"Error fetching blobs:\", error);\n return c.json({ error: \"Failed to fetch blobs\" }, 500);\n }\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 try {\n const content = await blob.get(key);\n return content;\n } catch (error) {\n if (error.name === \"ValTownBlobNotFoundError\") {\n return c.text(`Blob not found: ${key}`, 404);\n }\n console.error(\"Error fetching blob:\", error);\n return c.text(\"Failed to fetch blob\", 500);\n }\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 try {\n await blob.set(key, content);\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error saving blob:\", error);\n return c.text(\"Failed to save blob\", 500);\n }\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 try {\n await blob.delete(key);\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error deleting blob:\", error);\n return c.text(\"Failed to delete blob\", 500);\n }\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 try {\n await blob.set(key, await file.arrayBuffer());\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error uploading blob:\", error);\n return c.text(\"Failed to upload blob\", 500);\n }\n});\n\napp.post(\"/api/move\", checkAuth, async (c) => {\n const sourceKey = c.req.query(\"sourceKey\");\n const targetKey = c.req.query(\"targetKey\");\n if (!sourceKey || !targetKey) return c.text(\"Missing sourceKey or targetKey parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const content = await blob.get(sourceKey);\n await blob.set(targetKey, content);\n await blob.delete(sourceKey);\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error moving blob:\", error);\n return c.text(\"Failed to move blob\", 500);\n }\n});\n\napp.get(\"/api/search\", checkAuth, async (c) => {\n const query = c.req.query(\"query\");\n if (!query) return c.text(\"Missing query parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const blobList = await blob.list(\"\");\n const results = blobList.filter(b => b.key.toLowerCase().includes(query.toLowerCase()));\n return c.json(results);\n } catch (error) {\n console.error(\"Error searching blobs:\", error);\n return c.json({ error: \"Failed to search blobs\" }, 500);\n }\n});\n\napp.post(\"/api/share\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n if (!key) return c.text(\"Missing key parameter\", 400);\n // Generate a unique share ID\n const shareId = Math.random().toString(36).substring(2, 15);\n const shareUrl = `${c.req.url.origin}/api/shared/${shareId}`;\n // Store the mapping between shareId and key\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n await blob.set(`__shares/${shareId}`, key);\n return c.json({ shareUrl });\n } catch (error) {\n console.error(\"Error sharing blob:\", error);\n return c.json({ error: \"Failed to share blob\" }, 500);\n }\n});\n\napp.get(\"/api/shared/:id\", async (c) => {\n const shareId = c.req.param(\"id\");\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const key = await blob.get(`__shares/${shareId}`);\n if (!key) return c.text(\"Share not found\", 404);\n const content = await blob.get(key);\n return content;\n } catch (error) {\n console.error(\"Error fetching shared blob:\", error);\n return c.text(\"Failed to fetch shared blob\", 500);\n }\n});\n\napp.post(\"/api/encrypt\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n const password = c.req.query(\"password\");\n if (!key || !password) return c.text(\"Missing key or password parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const content = await blob.get(key);\n // Implement encryption logic here\n const encryptedContent = content; // Replace with actual encryption\n await blob.set(key, encryptedContent);\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error encrypting blob:\", error);\n return c.text(\"Failed to encrypt blob\", 500);\n }\n});\n\napp.post(\"/api/decrypt\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n const password = c.req.query(\"password\");\n if (!key || !password) return c.text(\"Missing key or password parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n try {\n const encryptedContent = await blob.get(key);\n // Implement decryption logic here\n const decryptedContent = encryptedContent; // Replace with actual decryption\n await blob.set(key, decryptedContent);\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error decrypting blob:\", error);\n return c.text(\"Failed to decrypt blob\", 500);\n }\n});\n\napp.post(\"/api/lock\", 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 try {\n await blob.set(`__locks/${key}`, \"locked\");\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error locking file:\", error);\n return c.text(\"Failed to lock file\", 500);\n }\n});\n\napp.post(\"/api/unlock\", 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 try {\n await blob.delete(`__locks/${key}`);\n return c.text(\"OK\");\n } catch (error) {\n console.error(\"Error unlocking file:\", error);\n return c.text(\"Failed to unlock file\", 500);\n }\n});\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\nexport default lastlogin((request: Request) => app.fetch(request));",5,["D",1742609298525],{"_103":233,"_160":139,"_157":116,"_95":99,"_167":229,"_165":178,"_100":234,"_159":-5,"_105":235,"_161":230,"_170":-5},"95679e50-26c4-11f0-9a82-569c3dd06744",4,["D",1742609298232],{"_103":237,"_160":139,"_157":116,"_95":99,"_167":238,"_165":178,"_100":239,"_159":-5,"_105":240,"_161":234,"_170":-5},"955c5428-26c4-11f0-9a82-569c3dd06744","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { debounce } from \"https://esm.sh/lodash-es\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useDropzone } from \"https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0\";\nimport {\n FaFile,\n FaFileAlt,\n FaFileArchive,\n FaFileAudio,\n FaFileCode,\n FaFilePdf,\n FaFileVideo,\n FaFolder,\n FaImage,\n} from \"https://esm.sh/react-icons@4.10.1/fa?deps=react@18.2.0\";\nimport { dracula } from \"https://esm.sh/react-syntax-highlighter/dist/esm/styles/prism?deps=react@18.2.0\";\nimport { Prism as SyntaxHighlighter } from \"https://esm.sh/react-syntax-highlighter?deps=react@18.2.0\";\nimport React, { ReactNode, useCallback, useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin_safe\";\nimport { LoginWithGoogleButton } from \"https://esm.town/v/stevekrouse/LoginWithGoogleButton\";\n\ninterface TooltipProps {\n children: ReactNode;\n content: string;\n}\n\nfunction Tooltip({ children, content }: TooltipProps) {\n const [isVisible, setIsVisible] = useState(false);\n const tooltipRef = useRef(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (tooltipRef.current && !tooltipRef.current.contains(event.target as Node)) {\n setIsVisible(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n return (\n

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

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

\n \n {isOpen && (\n

\n )}\n

\n {blob.isFolder ? : getFileIcon(blob.key)}\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

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 New Folder\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 {selectedFiles.length > 0 && (\n

\n \n Delete Selected\n \n \n Move Selected\n \n

\n )}\n

\n {loading\n ? (\n

\n )\n : (\n

handleItemDrop(e, blob.key)}\n />\n ))}\n

\n )}\n {Object.keys(uploadProgress).length > 0 && (\n

Upload Progress

\n {Object.entries(uploadProgress).map(([key, progress]) => (\n

{key}

\n \n

\n ))}\n

\n )}\n

\n {selectedBlob && (\n

{selectedBlob.key}

\n {isLocked\n ? (\n \n Unlock\n \n )\n : (\n \n Lock\n \n )}\n \n ✕\n \n

\n {selectedBlob.key.startsWith(\"__public/\") && (\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 : selectedBlob.key.match(/\\.(pdf)$/i)\n ? (\n \n \n )\n : selectedBlob.key.match(/\\.(mp3|wav|ogg)$/i)\n ? (\n

\n )\n : selectedBlob.key.match(/\\.(mp4|webm|ogg)$/i)\n ? (\n

\n \n Save\n \n

\n )}\n

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

\n \n \n via LastLogin\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: b.key.endsWith(\"/\") }));\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\napp.post(\"/api/move\", checkAuth, async (c) => {\n const sourceKey = c.req.query(\"sourceKey\");\n const targetKey = c.req.query(\"targetKey\");\n if (!sourceKey || !targetKey) return c.text(\"Missing sourceKey or targetKey parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const content = await blob.get(sourceKey);\n await blob.set(targetKey, content);\n await blob.delete(sourceKey);\n return c.text(\"OK\");\n});\n\napp.get(\"/api/search\", checkAuth, async (c) => {\n const query = c.req.query(\"query\");\n if (!query) return c.text(\"Missing query parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const blobList = await blob.list(\"\");\n const results = blobList.filter(b => b.key.toLowerCase().includes(query.toLowerCase()));\n return c.json(results);\n});\n\napp.post(\"/api/share\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n if (!key) return c.text(\"Missing key parameter\", 400);\n // Generate a unique share ID\n const shareId = Math.random().toString(36).substring(2, 15);\n const shareUrl = `${c.req.url.origin}/api/shared/${shareId}`;\n // Store the mapping between shareId and key\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n await blob.set(`__shares/${shareId}`, key);\n return c.json({ shareUrl });\n});\n\napp.get(\"/api/shared/:id\", async (c) => {\n const shareId = c.req.param(\"id\");\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const key = await blob.get(`__shares/${shareId}`);\n if (!key) return c.text(\"Share not found\", 404);\n const content = await blob.get(key);\n return content;\n});\n\napp.post(\"/api/encrypt\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n const password = c.req.query(\"password\");\n if (!key || !password) return c.text(\"Missing key or password parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const content = await blob.get(key);\n // Implement encryption logic here\n const encryptedContent = content; // Replace with actual encryption\n await blob.set(key, encryptedContent);\n return c.text(\"OK\");\n});\n\napp.post(\"/api/decrypt\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n const password = c.req.query(\"password\");\n if (!key || !password) return c.text(\"Missing key or password parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const encryptedContent = await blob.get(key);\n // Implement decryption logic here\n const decryptedContent = encryptedContent; // Replace with actual decryption\n await blob.set(key, decryptedContent);\n return c.text(\"OK\");\n});\n\napp.post(\"/api/lock\", 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.set(`__locks/${key}`, \"locked\");\n return c.text(\"OK\");\n});\n\napp.post(\"/api/unlock\", 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(`__locks/${key}`);\n return c.text(\"OK\");\n});\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\nexport default lastlogin((request: Request) => app.fetch(request));",3,["D",1742552460360],{"_103":242,"_160":139,"_157":116,"_95":99,"_167":243,"_165":178,"_100":244,"_159":-5,"_105":245,"_161":239,"_170":-5},"95520360-26c4-11f0-9a82-569c3dd06744","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { debounce } from \"https://esm.sh/lodash-es\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useDropzone } from \"https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0\";\nimport React, { ReactNode, useCallback, useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin_safe\";\nimport { LoginWithGoogleButton } from \"https://esm.town/v/stevekrouse/LoginWithGoogleButton\";\nimport { FaFile, FaFolder, FaImage, FaFileAlt, FaFileCode, FaFilePdf, FaFileArchive, FaFileAudio, FaFileVideo } from \"https://esm.sh/react-icons@4.10.1/fa?deps=react@18.2.0\";\nimport { Prism as SyntaxHighlighter } from \"https://esm.sh/react-syntax-highlighter?deps=react@18.2.0\";\nimport { dracula } from \"https://esm.sh/react-syntax-highlighter/dist/esm/styles/prism?deps=react@18.2.0\";\n\ninterface TooltipProps {\n children: ReactNode;\n content: string;\n}\n\nfunction Tooltip({ children, content }: TooltipProps) {\n const [isVisible, setIsVisible] = useState(false);\n const tooltipRef = useRef(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (tooltipRef.current && !tooltipRef.current.contains(event.target as Node)) {\n setIsVisible(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n return (\n

\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 getFileIcon(fileName: string) {\n const extension = fileName.split('.').pop().toLowerCase();\n switch (extension) {\n case 'jpg':\n case 'jpeg':\n case 'png':\n case 'gif':\n return ;\n case 'txt':\n case 'md':\n return ;\n case 'js':\n case 'ts':\n case 'py':\n case 'html':\n case 'css':\n return ;\n case 'pdf':\n return ;\n case 'zip':\n case 'rar':\n case '7z':\n return ;\n case 'mp3':\n case 'wav':\n case 'ogg':\n return ;\n case 'mp4':\n case 'avi':\n case 'mov':\n return ;\n default:\n return ;\n }\n}\n\nfunction ActionMenu({ blob, onDownload, onRename, onDelete, onMoveToPublic, onMoveOutOfPublic, onShare, onEncrypt, onDecrypt }) {\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 )}\n

\n );\n}\n\nfunction BlobItem({ blob, onSelect, isSelected, onDownload, onRename, onDelete, onMoveToPublic, onMoveOutOfPublic, onShare, onEncrypt, onDecrypt, onDragStart, onDragOver, onDrop }) {\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 const handleDragStart = (e) => {\n e.dataTransfer.setData('text/plain', blob.key);\n onDragStart(blob.key);\n };\n\n return (\n onDragOver(e, blob.key)}\n onDrop={(e) => onDrop(e, blob.key)}\n >\n

\n {blob.isFolder ? : getFileIcon(blob.key)}\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 isFolder: boolean;\n}\n\nfunction App({ initialEmail, initialProfile }) {\n const encodeKey = (key: string) => encodeURIComponent(key);\n const decodeKey = (key: string) => decodeURIComponent(key);\n\n const [blobs, setBlobs] = useState([]);\n const [currentFolder, setCurrentFolder] = 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 const [selectedFiles, setSelectedFiles] = useState([]);\n const [fileTypeFilter, setFileTypeFilter] = useState(\"\");\n const [uploadProgress, setUploadProgress] = useState<{ [key: string]: number }>({});\n const [isLocked, setIsLocked] = useState(false);\n\n const fetchBlobs = useCallback(async () => {\n setLoading(true);\n try {\n const response = await fetch(`/api/blobs?prefix=${encodeKey(currentFolder)}&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 }, [currentFolder, limit]);\n\n useEffect(() => {\n fetchBlobs();\n }, [fetchBlobs]);\n\n const handleSearch = debounce(async (e) => {\n const value = e.target.value;\n setSearchPrefix(value);\n try {\n const response = await fetch(`/api/search?query=${encodeKey(value)}`);\n const data = await response.json();\n setBlobs(data);\n } catch (error) {\n console.error(\"Error searching blobs:\", error);\n }\n }, 300);\n\n const handleBlobClick = async (clickedBlob: Blob) => {\n if (clickedBlob.isFolder) {\n setCurrentFolder(clickedBlob.key);\n return;\n }\n\n if (selectedBlob && selectedBlob.key === clickedBlob.key) {\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 if (isLocked) {\n alert(\"This file is currently locked for editing.\");\n return;\n }\n\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 = `${currentFolder}${file.name}`;\n formData.append(\"key\", encodeKey(key));\n\n const xhr = new XMLHttpRequest();\n xhr.open(\"POST\", \"/api/blob\", true);\n xhr.upload.onprogress = (event) => {\n if (event.lengthComputable) {\n const percentComplete = (event.loaded / event.total) * 100;\n setUploadProgress(prev => ({ ...prev, [key]: percentComplete }));\n }\n };\n xhr.onload = () => {\n if (xhr.status === 200) {\n const newBlob = { key, size: file.size, lastModified: new Date().toISOString(), isFolder: false };\n setBlobs(prev => [newBlob, ...prev]);\n handleBlobClick(newBlob);\n setUploadProgress(prev => {\n const newProgress = { ...prev };\n delete newProgress[key];\n return newProgress;\n });\n }\n };\n xhr.send(formData);\n } catch (error) {\n console.error(\"Error uploading file:\", error);\n }\n }\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 = `${currentFolder}${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(), isFolder: false };\n setBlobs([newBlob, ...blobs]);\n handleBlobClick(newBlob);\n } catch (error) {\n console.error(\"Error creating text blob:\", error);\n }\n }\n };\n\n const handleCreateFolder = async () => {\n const folderName = prompt(\"Enter folder name:\");\n if (folderName) {\n const fullKey = `${currentFolder}${folderName}/`;\n const newFolder = { key: fullKey, size: 0, lastModified: new Date().toISOString(), isFolder: true };\n setBlobs([newFolder, ...blobs]);\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 handleShare = async (key) => {\n try {\n const response = await fetch(`/api/share?key=${encodeKey(key)}`);\n const { shareUrl } = await response.json();\n alert(`Share URL: ${shareUrl}`);\n } catch (error) {\n console.error(\"Error sharing blob:\", error);\n }\n };\n\n const handleEncrypt = async (key) => {\n const password = prompt(\"Enter encryption password:\");\n if (password) {\n try {\n await fetch(`/api/encrypt?key=${encodeKey(key)}&password=${encodeKey(password)}`, { method: \"POST\" });\n alert(\"File encrypted successfully.\");\n } catch (error) {\n console.error(\"Error encrypting blob:\", error);\n }\n }\n };\n\n const handleDecrypt = async (key) => {\n const password = prompt(\"Enter decryption password:\");\n if (password) {\n try {\n await fetch(`/api/decrypt?key=${encodeKey(key)}&password=${encodeKey(password)}`, { method: \"POST\" });\n alert(\"File decrypted successfully.\");\n } catch (error) {\n console.error(\"Error decrypting blob:\", error);\n }\n }\n };\n\n const handleCloseBlob = () => {\n setSelectedBlob(null);\n setEditContent(\"\");\n };\n\n const handleDragStart = (key) => {\n setIsDragging(true);\n };\n\n const handleDragOver = (e, targetKey) => {\n e.preventDefault();\n e.stopPropagation();\n };\n\n const handleDrop = async (e, targetKey) => {\n e.preventDefault();\n e.stopPropagation();\n setIsDragging(false);\n\n const sourceKey = e.dataTransfer.getData('text/plain');\n if (sourceKey === targetKey) return;\n\n try {\n await fetch(`/api/move?sourceKey=${encodeKey(sourceKey)}&targetKey=${encodeKey(targetKey)}`, { method: \"POST\" });\n fetchBlobs();\n } catch (error) {\n console.error(\"Error moving blob:\", error);\n }\n };\n\n const handleFileSelection = (key) => {\n setSelectedFiles(prev => {\n if (prev.includes(key)) {\n return prev.filter(k => k !== key);\n } else {\n return [...prev, key];\n }\n });\n };\n\n const handleBatchDelete = async () => {\n if (window.confirm(`Are you sure you want to delete ${selectedFiles.length} files?`)) {\n try {\n await Promise.all(selectedFiles.map(key => fetch(`/api/blob?key=${encodeKey(key)}`, { method: \"DELETE\" })));\n setBlobs(blobs.filter(b => !selectedFiles.includes(b.key)));\n setSelectedFiles([]);\n } catch (error) {\n console.error(\"Error deleting files:\", error);\n }\n }\n };\n\n const handleBatchMove = async () => {\n const targetFolder = prompt(\"Enter target folder:\");\n if (targetFolder) {\n try {\n await Promise.all(selectedFiles.map(key => \n fetch(`/api/move?sourceKey=${encodeKey(key)}&targetKey=${encodeKey(`${targetFolder}/${key.split('/').pop()}`)}`, { method: \"POST\" })\n ));\n fetchBlobs();\n setSelectedFiles([]);\n } catch (error) {\n console.error(\"Error moving files:\", error);\n }\n }\n };\n\n const handleLock = async () => {\n if (selectedBlob) {\n try {\n await fetch(`/api/lock?key=${encodeKey(selectedBlob.key)}`, { method: \"POST\" });\n setIsLocked(true);\n } catch (error) {\n console.error(\"Error locking file:\", error);\n }\n }\n };\n\n const handleUnlock = async () => {\n if (selectedBlob) {\n try {\n await fetch(`/api/unlock?key=${encodeKey(selectedBlob.key)}`, { method: \"POST\" });\n setIsLocked(false);\n } catch (error) {\n console.error(\"Error unlocking file:\", error);\n }\n }\n };\n\n const filteredBlobs = blobs.filter(blob => {\n if (!fileTypeFilter) return true;\n const extension = blob.key.split('.').pop().toLowerCase();\n return fileTypeFilter === extension;\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 New Folder\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 setCurrentFolder(currentFolder.split('/').slice(0, -2).join('/') + '/')}\n className=\"text-blue-400 hover:text-blue-300 text-sm\"\n disabled={currentFolder === \"\"}\n >\n ⬆️ Up\n \n {currentFolder || \"Root\"}\n

\n {selectedFiles.length > 0 && (\n

\n \n Delete Selected\n \n \n Move Selected\n \n

\n )}\n

\n {loading\n ? (\n

\n )\n : (\n

\n ))}\n

\n )}\n {Object.keys(uploadProgress).length > 0 && (\n

Upload Progress

\n {Object.entries(uploadProgress).map(([key, progress]) => (\n

{key}

\n ))}\n

\n )}\n

\n {selectedBlob && (\n

{selectedBlob.key}

\n {isLocked ? (\n \n Unlock\n \n ) : (\n \n Lock\n \n )}\n \n ✕\n \n

\n {selectedBlob.key.startsWith(\"__public/\") && (\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 : selectedBlob.key.match(/\\.(pdf)$/i)\n ? (\n \n )\n : selectedBlob.key.match(/\\.(mp3|wav|ogg)$/i)\n ? (\n

\n )\n : selectedBlob.key.match(/\\.(mp4|webm|ogg)$/i)\n ? (\n

\n \n Save\n \n

\n )}\n

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

\n \n \n via LastLogin\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: b.key.endsWith('/') }));\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\napp.post(\"/api/move\", checkAuth, async (c) => {\n const sourceKey = c.req.query(\"sourceKey\");\n const targetKey = c.req.query(\"targetKey\");\n if (!sourceKey || !targetKey) return c.text(\"Missing sourceKey or targetKey parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const content = await blob.get(sourceKey);\n await blob.set(targetKey, content);\n await blob.delete(sourceKey);\n return c.text(\"OK\");\n});\n\napp.get(\"/api/search\", checkAuth, async (c) => {\n const query = c.req.query(\"query\");\n if (!query) return c.text(\"Missing query parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const blobList = await blob.list(\"\");\n const results = blobList.filter(b => b.key.toLowerCase().includes(query.toLowerCase()));\n return c.json(results);\n});\n\napp.post(\"/api/share\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n if (!key) return c.text(\"Missing key parameter\", 400);\n // Generate a unique share ID\n const shareId = Math.random().toString(36).substring(2, 15);\n const shareUrl = `${c.req.url.origin}/api/shared/${shareId}`;\n // Store the mapping between shareId and key\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n await blob.set(`__shares/${shareId}`, key);\n return c.json({ shareUrl });\n});\n\napp.get(\"/api/shared/:id\", async (c) => {\n const shareId = c.req.param(\"id\");\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const key = await blob.get(`__shares/${shareId}`);\n if (!key) return c.text(\"Share not found\", 404);\n const content = await blob.get(key);\n return content;\n});\n\napp.post(\"/api/encrypt\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n const password = c.req.query(\"password\");\n if (!key || !password) return c.text(\"Missing key or password parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const content = await blob.get(key);\n // Implement encryption logic here\n const encryptedContent = content; // Replace with actual encryption\n await blob.set(key, encryptedContent);\n return c.text(\"OK\");\n});\n\napp.post(\"/api/decrypt\", checkAuth, async (c) => {\n const key = c.req.query(\"key\");\n const password = c.req.query(\"password\");\n if (!key || !password) return c.text(\"Missing key or password parameter\", 400);\n const { blob } = await import(\"https://esm.town/v/std/blob\");\n const encryptedContent = await blob.get(key);\n // Implement decryption logic here\n const decryptedContent = encryptedContent; // Replace with actual decryption\n await blob.set(key, decryptedContent);\n return c.text(\"OK\");\n});\n\napp.post(\"/api/lock\", 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.set(`__locks/${key}`, \"locked\");\n return c.text(\"OK\");\n});\n\napp.post(\"/api/unlock\", 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(`__locks/${key}`);\n return c.text(\"OK\");\n});\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\nexport default lastlogin((request: Request) => app.fetch(request));",2,["D",1742552072767],{"_103":247,"_160":139,"_157":116,"_95":99,"_167":248,"_165":178,"_100":162,"_159":-5,"_105":249,"_161":244,"_170":-5},"9546ac04-26c4-11f0-9a82-569c3dd06744","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { debounce } from \"https://esm.sh/lodash-es\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useDropzone } from \"https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0\";\nimport React, { ReactNode, useCallback, useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin_safe\";\nimport { LoginWithGoogleButton } from \"https://esm.town/v/stevekrouse/LoginWithGoogleButton\";\n\ninterface TooltipProps {\n children: ReactNode;\n content: string;\n}\n\nfunction Tooltip({ children, content }: TooltipProps) {\n const [isVisible, setIsVisible] = useState(false);\n const tooltipRef = useRef(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (tooltipRef.current && !tooltipRef.current.contains(event.target as Node)) {\n setIsVisible(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n return (\n

\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 )}\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 }) {\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 )}\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 \n via LastLogin\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 \n `);\n});\n\nexport default lastlogin((request: Request) => app.fetch(request));",["D",1742551506858],{"_103":251,"_160":139,"_157":116,"_95":99,"_167":252,"_165":178,"_100":32,"_159":-5,"_105":253,"_161":162,"_170":-5},"953ddf52-26c4-11f0-9a82-569c3dd06744","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Hono } from \"https://esm.sh/hono\";\nimport { debounce } from \"https://esm.sh/lodash-es\";\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { useDropzone } from \"https://esm.sh/react-dropzone?deps=react@18.2.0,react-dom@18.2.0\";\nimport React, { ReactNode, useCallback, useEffect, useRef, useState } from \"https://esm.sh/react@18.2.0\";\nimport { lastlogin } from \"https://esm.town/v/stevekrouse/lastlogin_safe\";\nimport { LoginWithGoogleButton } from \"https://esm.town/v/stevekrouse/LoginWithGoogleButton\";\n\ninterface TooltipProps {\n children: ReactNode;\n content: string;\n}\n\nfunction Tooltip({ children, content }: TooltipProps) {\n const [isVisible, setIsVisible] = useState(false);\n const tooltipRef = useRef(null);\n\n useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n if (tooltipRef.current && !tooltipRef.current.contains(event.target as Node)) {\n setIsVisible(false);\n }\n };\n\n document.addEventListener(\"mousedown\", handleClickOutside);\n return () => {\n document.removeEventListener(\"mousedown\", handleClickOutside);\n };\n }, []);\n\n return (\n

\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 )}\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

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 )}\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 \n via LastLogin\n \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 `);\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 \n `);\n});\n\nexport default lastlogin((request: Request) => app.fetch(request));",["D",1742551268404],"versions",[256,258,259,260,261,262,263],{"_166":225,"_257":227},"previous",{"_166":227,"_257":232},{"_166":232,"_257":236},{"_166":236,"_257":241},{"_166":241,"_257":246},{"_166":246,"_257":250},{"_166":250,"_257":-5},"versionNumber","page","hasNext","actionData","errors"]

History for main.tsx