From 66387cce5a6962370cf52b13c45b6b6f5578ebaa Mon Sep 17 00:00:00 2001 From: hzrd149 Date: Wed, 21 Feb 2024 09:00:51 +0000 Subject: [PATCH] cleanup misc view --- src/App.svelte | 2 +- src/components/FileCard.svelte | 9 ++-- src/components/SpeedDialMenu.svelte | 2 +- src/components/UploadFileModal.svelte | 2 +- src/helpers/blob.ts | 10 ++++ src/helpers/number.ts | 22 +++++++++ src/helpers/tree.ts | 12 ++--- src/pages/Drive.svelte | 8 +-- src/pages/Misc.svelte | 70 ++++++++++++++++++++------- src/services/blobs.ts | 7 +-- vite.config.ts | 5 +- 11 files changed, 107 insertions(+), 42 deletions(-) create mode 100644 src/helpers/blob.ts create mode 100644 src/helpers/number.ts diff --git a/src/App.svelte b/src/App.svelte index 96debcf..365f206 100644 --- a/src/App.svelte +++ b/src/App.svelte @@ -27,7 +27,7 @@
{#if $activeUser} diff --git a/src/components/FileCard.svelte b/src/components/FileCard.svelte index dcbdcd3..2395548 100644 --- a/src/components/FileCard.svelte +++ b/src/components/FileCard.svelte @@ -5,6 +5,7 @@ import { servers } from "../services/servers"; import { DotsHorizontalSolid } from "flowbite-svelte-icons"; import { createEventDispatcher } from "svelte"; + import { getBlobURL } from "../helpers/blob"; export let file: TreeFile; export let selected = false; @@ -15,12 +16,10 @@ ? "border border-primary-200 dark:border-primary-700" : "border border-gray-200 dark:border-gray-700"; - $: link = $servers[0] - ? new URL(file.hash + (file.mimeType ? "." + mime.getExtension(file.mimeType) : ""), $servers[0]).toString() - : undefined; + $: link = getBlobURL(file, $servers[0]); - $: extension = file.mimeType ? mime.getExtension(file.mimeType) : "bin"; - $: preview = file.mimeType?.startsWith("image/") && file.size < 1024 * 100; + $: extension = file.type ? mime.getExtension(file.type) : "bin"; + $: preview = file.type?.startsWith("image/") && file.size < 1024 * 100; function toggleSelect() { if (selected) dispatch("unselect", file.name); diff --git a/src/components/SpeedDialMenu.svelte b/src/components/SpeedDialMenu.svelte index 0aff9ba..896db57 100644 --- a/src/components/SpeedDialMenu.svelte +++ b/src/components/SpeedDialMenu.svelte @@ -14,7 +14,7 @@ let newDriveModal = false; const createdDrive = (event: CustomEvent) => { - location.hash = "#/drive/" + event.detail.encode; + location.hash = "#/drive/" + event.detail.encode(); }; diff --git a/src/components/UploadFileModal.svelte b/src/components/UploadFileModal.svelte index 5895b03..4266fe8 100644 --- a/src/components/UploadFileModal.svelte +++ b/src/components/UploadFileModal.svelte @@ -56,7 +56,7 @@ const draft = cloneEvent(selectedDrive); const tree = getFileTree(draft); - setFile(tree, [...parsePath(path), name], { hash: blob.sha256, size: blob.size, mimeType: blob.type }); + setFile(tree, [...parsePath(path), name], { sha256: blob.sha256, size: blob.size, type: blob.type }); setDriveFileTree(draft, tree); diff --git a/src/helpers/blob.ts b/src/helpers/blob.ts new file mode 100644 index 0000000..d8c830d --- /dev/null +++ b/src/helpers/blob.ts @@ -0,0 +1,10 @@ +import type { Blob } from "blossom-client"; +import { servers } from "../services/servers"; +import { get } from "svelte/store"; +import mime from "mime"; + +export function getBlobURL(blob: { sha256: string; type?: string }, server = get(servers)[0]) { + return server + ? new URL(blob.sha256 + (blob.type ? "." + mime.getExtension(blob.type) : ""), server).toString() + : undefined; +} diff --git a/src/helpers/number.ts b/src/helpers/number.ts new file mode 100644 index 0000000..a5148ea --- /dev/null +++ b/src/helpers/number.ts @@ -0,0 +1,22 @@ +// Copied from https://git.v0l.io/Kieran/dtan/src/branch/main/src/const.ts#L220 +export const kiB = Math.pow(1024, 1); +export const MiB = Math.pow(1024, 2); +export const GiB = Math.pow(1024, 3); +export const TiB = Math.pow(1024, 4); +export const PiB = Math.pow(1024, 5); +export const EiB = Math.pow(1024, 6); +export const ZiB = Math.pow(1024, 7); +export const YiB = Math.pow(1024, 8); + +export function formatBytes(b: number, f?: number) { + f ??= 2; + if (b >= YiB) return (b / YiB).toFixed(f) + " YiB"; + if (b >= ZiB) return (b / ZiB).toFixed(f) + " ZiB"; + if (b >= EiB) return (b / EiB).toFixed(f) + " EiB"; + if (b >= PiB) return (b / PiB).toFixed(f) + " PiB"; + if (b >= TiB) return (b / TiB).toFixed(f) + " TiB"; + if (b >= GiB) return (b / GiB).toFixed(f) + " GiB"; + if (b >= MiB) return (b / MiB).toFixed(f) + " MiB"; + if (b >= kiB) return (b / kiB).toFixed(f) + " KiB"; + return b.toFixed(f) + " B"; +} diff --git a/src/helpers/tree.ts b/src/helpers/tree.ts index 1bf5530..39ba7a0 100644 --- a/src/helpers/tree.ts +++ b/src/helpers/tree.ts @@ -3,9 +3,9 @@ import type { NDKEvent, NDKTag } from "@nostr-dev-kit/ndk"; export type TreeFile = { t: "file"; name: string; - hash: string; + sha256: string; size: number; - mimeType?: string; + type?: string; }; export interface TreeFolder { [x: string]: TreeFile | TreeFolder; @@ -71,7 +71,7 @@ export function getFileTree(drive: NDKEvent) { if (hash && pathname && size) { const path = parsePath(pathname); - setFile(tree, path, { size, hash, mimeType }); + setFile(tree, path, { size, sha256: hash, type: mimeType }); } } if (tag[0] === "folder") getFolder(tree, parsePath(tag[1]), true); @@ -82,8 +82,8 @@ export function getFileTree(drive: NDKEvent) { export function getTreeTags(entry: TreeFolder | TreeFile, path: string[] = []): NDKTag[] { if (entry.t === "file") { const file = entry as TreeFile; - const base: NDKTag = ["x", file.hash, "/" + path.join("/"), String(entry.size)]; - if (file.mimeType) base.push(file.mimeType); + const base: NDKTag = ["x", file.sha256, "/" + path.join("/"), String(entry.size)]; + if (file.type) base.push(file.type); return [base]; } else if (Object.keys(entry).length === 0) { if (path.length > 0) return [["folder", "/" + path.join("/")]]; @@ -107,7 +107,7 @@ export function getFilePaths(dir: TreeFolder, hash: string, path: string[] = []) const paths: string[][] = []; for (const [name, entry] of Object.entries(dir)) { if ((entry.t = "file")) { - if (entry.hash === hash) paths.push([...path, name]); + if (entry.sha256 === hash) paths.push([...path, name]); } else { paths.push(...getFilePaths(dir[name] as TreeFolder, hash, [...path, name])); } diff --git a/src/pages/Drive.svelte b/src/pages/Drive.svelte index 5dfa388..45e9d41 100644 --- a/src/pages/Drive.svelte +++ b/src/pages/Drive.svelte @@ -155,9 +155,9 @@ let descriptor = await uploadFile(file); if (descriptor) { setFile(newTree, getPath(entry), { - hash: descriptor.sha256, + sha256: descriptor.sha256, size: descriptor.size, - mimeType: descriptor.type, + type: descriptor.type, }); } } catch (e) { @@ -179,9 +179,9 @@ let descriptor = await uploadFile(file); if (descriptor) { setFile(newTree, folder ? [...path, folder, file.name] : [...path, file.name], { - hash: descriptor.sha256, + sha256: descriptor.sha256, size: descriptor.size, - mimeType: descriptor.type, + type: descriptor.type, }); } } catch (e) { diff --git a/src/pages/Misc.svelte b/src/pages/Misc.svelte index c8e2979..7674801 100644 --- a/src/pages/Misc.svelte +++ b/src/pages/Misc.svelte @@ -1,24 +1,60 @@ -
- {#each miscBlobs as blob} - -
- {blob.mimeType} - -
-

{blob.created}

-

- {blob.sha256} -

-
- {/each} -
+ + + ID + Type + Size + Created + Drives + + Edit + + + + {#each miscBlobs as blob} + + + {blob.sha256} + + {blob.type} + {formatBytes(blob.size)} + {dayjs.unix(blob.created).format("ll")} + + {#each getBlobDrives(blob) as drive, i (drive.id)} + {#if i !== 0}, {/if} + {getDriveName(drive)} + {/each} + + +
+ Open + Delete +
+
+
+ {/each} +
+
diff --git a/src/services/blobs.ts b/src/services/blobs.ts index a4e6c66..4907b0e 100644 --- a/src/services/blobs.ts +++ b/src/services/blobs.ts @@ -1,13 +1,8 @@ import { get, writable } from "svelte/store"; import { activeUser } from "./ndk"; import { servers } from "./servers"; +import type { Blob } from "blossom-client"; -export type Blob = { - sha256: string; - type?: string; - created: number; - size: number; -}; type ServerList = { server: string; blobs: Blob[]; diff --git a/vite.config.ts b/vite.config.ts index a37a143..ec2571a 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -5,7 +5,10 @@ import { VitePWA } from "vite-plugin-pwa"; // https://vitejs.dev/config/ export default defineConfig({ base: process.env.VITE_BASE ?? "/", - build: { sourcemap: true }, + build: { + target: ["chrome89", "edge89", "firefox89", "safari15"], + sourcemap: true, + }, plugins: [ svelte(), VitePWA({