@axium/storage 0.22.3 → 0.23.1

package/dist/client/api.d.ts

@@ -1,32 +1,18 @@
 import type { GetItemOptions, StorageItemUpdate, UserStorage, UserStorageInfo, UserStorageOptions } from '../common.js';
 import { StorageItemMetadata } from '../common.js';
 import '../polyfills.js';
-declare global {
-    interface NetworkInformation {
-        readonly downlink: number;
-        readonly downlinkMax?: number;
-        readonly effectiveType: 'slow-2g' | '2g' | '3g' | '4g';
-        readonly rtt: number;
-        readonly saveData: boolean;
-        readonly type: 'bluetooth' | 'cellular' | 'ethernet' | 'none' | 'wifi' | 'wimax' | 'other' | 'unknown';
-    }
-    interface Navigator {
-        connection?: NetworkInformation;
-    }
-}
-export interface UploadOptions {
+type ProgressHandler = (this: void, uploaded: number, total: number) => void;
+export declare function createDirectory(name: string, parentId?: string): Promise<StorageItemMetadata>;
+export interface CreateItemInit {
+    onProgress?: ProgressHandler;
     parentId?: string;
-    name?: string;
-    onProgress?(this: void, uploaded: number, total: number): void;
-}
-export declare function uploadItem(file: Blob | File, opt?: UploadOptions): Promise<StorageItemMetadata>;
-export interface UploadStreamOptions extends UploadOptions {
     name: string;
     size: number;
     type: string;
 }
-export declare function uploadItemStream(stream: ReadableStream<Uint8Array<ArrayBuffer>>, opt: UploadStreamOptions): Promise<StorageItemMetadata>;
-export declare function updateItem(fileId: string, data: Blob): Promise<StorageItemMetadata>;
+export declare function createItem(stream: ReadableStream<Uint8Array<ArrayBuffer>>, init: CreateItemInit): Promise<StorageItemMetadata>;
+export declare function createItemFromFile(file: File, init: Partial<CreateItemInit>): Promise<StorageItemMetadata>;
+export declare function updateItem(fileId: string, newSize: number | bigint, stream: ReadableStream<Uint8Array<ArrayBuffer>>, onProgress?: ProgressHandler): Promise<StorageItemMetadata>;
 export declare function getItemMetadata(fileId: string, options?: GetItemOptions): Promise<StorageItemMetadata>;
 /** Gets the metadata for all items in a directory. */
 export declare function getDirectoryMetadata(parentId: string): Promise<StorageItemMetadata[]>;
@@ -39,3 +25,4 @@ export declare function getUserStats(userId: string): Promise<UserStorageInfo>;
 export declare function getUserTrash(userId: string): Promise<StorageItemMetadata[]>;
 export declare function itemsSharedWith(userId: string): Promise<StorageItemMetadata[]>;
 export declare function getUserStorageRoot(userId: string): Promise<StorageItemMetadata[]>;
+export {};

package/dist/client/api.js

@@ -1,22 +1,9 @@
 import { fetchAPI, prefix, token } from '@axium/client/requests';
-import { blake2b } from 'blakejs';
+import { pick } from 'utilium';
 import { prettifyError } from 'zod';
 import { StorageItemMetadata } from '../common.js';
 import '../polyfills.js';
-const uploadConfig = {
-    /**
-     * Requests below this amount in MB will be hashed client-side to avoid bandwidth usage.
-     * This is most useful when the client has plenty of compute but a poor network connection.
-     * For good connections, this isn't really useful since it takes longer than just uploading.
-     * Note that hashing takes a really long time client-side though.
-     */
-    hashThreshold: 10,
-    /**
-     * Set an upper limit for chunk size in MB, independent of `max_transfer_size`.
-     * Smaller chunks means better UX but more latency from RTT and more requests.
-     */
-    uxChunkSize: 10,
-};
+import { warnOnce } from 'ioium';
 function rawStorage(suffix) {
     const raw = '/raw/storage' + (suffix ? '/' + suffix : '');
     if (prefix[0] == '/')
@@ -25,12 +12,6 @@ function rawStorage(suffix) {
     url.pathname = raw;
     return url;
 }
-const conTypeToSpeed = {
-    'slow-2g': 1,
-    '2g': 4,
-    '3g': 16,
-    '4g': 64,
-};
 function handleFetchFailed(e) {
     if (!(e instanceof Error) || e.message != 'fetch failed')
         throw e;
@@ -58,120 +39,107 @@ async function handleResponse(response) {
         throw prettifyError(e);
     }
 }
-export async function uploadItem(file, opt = {}) {
-    if (file instanceof File)
-        opt.name ||= file.name;
-    if (!opt.name)
-        throw 'item name is required';
-    const content = await file.bytes();
-    /** For big files, it takes a *really* long time to compute the hash, so we just don't do it ahead of time and leave it up to the server. */
-    const hash = content.length < uploadConfig.hashThreshold * 1_000_000 ? blake2b(content).toHex() : null;
-    const upload = await fetchAPI('PUT', 'storage', {
-        parentId: opt.parentId,
-        name: opt.name,
-        type: file.type,
-        size: file.size,
-        hash,
-    });
-    if (upload.status == 'created')
-        return upload.item;
-    const chunkSize = Math.min(upload.max_transfer_size, globalThis.navigator?.connection ? conTypeToSpeed[globalThis.navigator.connection.effectiveType] : uploadConfig.uxChunkSize) * 1_000_000;
-    opt.onProgress?.(0, content.length);
-    let response;
-    for (let offset = 0; offset < content.length; offset += chunkSize) {
-        const size = Math.min(chunkSize, content.length - offset);
-        const headers = {
-            'x-upload': upload.token,
-            'x-offset': offset.toString(),
-            'content-length': size.toString(),
-            'content-type': 'application/octet-stream',
-        };
-        if (token)
-            headers.authorization = 'Bearer ' + token;
-        response = await fetch(rawStorage('chunk'), {
-            method: 'POST',
-            headers,
-            body: content.slice(offset, offset + size),
-        }).catch(handleFetchFailed);
-        if (!response.ok)
-            await handleError(response);
-        opt.onProgress?.(offset + size, content.length);
-        if (offset + size != content.length && response.status != 204)
-            console.warn('Unexpected end of upload before last chunk');
-    }
-    return await handleResponse(response);
-}
-export async function uploadItemStream(stream, opt) {
-    opt.onProgress?.(0, opt.size);
-    const upload = await fetchAPI('PUT', 'storage', { ...opt, hash: null });
+async function _upload(upload, stream, itemSize, onProgress) {
     if (upload.status == 'created')
         return upload.item;
-    const chunkSize = upload.max_transfer_size * 1_000_000;
+    const targetChunkSize = upload.max_transfer_size * 1_000_000;
     let response;
     const reader = stream.getReader();
     let buffer = new Uint8Array(0);
-    for (let offset = 0; offset < opt.size; offset += chunkSize) {
-        const size = Math.min(chunkSize, opt.size - offset);
+    for (let offset = 0; offset < itemSize; offset += targetChunkSize) {
+        const chunkSize = Math.min(targetChunkSize, itemSize - offset);
         let bytesReadForChunk = 0;
         const headers = {
             'x-upload': upload.token,
             'x-offset': offset.toString(),
-            'content-length': size.toString(),
+            'x-chunk-size': chunkSize.toString(),
+            'content-length': chunkSize.toString(),
             'content-type': 'application/octet-stream',
         };
         if (token)
             headers.authorization = 'Bearer ' + token;
-        response = await fetch(rawStorage('chunk'), {
-            method: 'POST',
-            headers,
-            body: new ReadableStream({
-                type: 'bytes',
-                async pull(controller) {
-                    if (bytesReadForChunk >= size) {
+        let body = new ReadableStream({
+            async pull(controller) {
+                if (bytesReadForChunk >= chunkSize) {
+                    controller.close();
+                    return;
+                }
+                if (!buffer.length) {
+                    const { done, value } = await reader.read();
+                    if (done) {
                         controller.close();
                         return;
                     }
-                    if (!buffer.length) {
-                        const { done, value } = await reader.read();
-                        if (done) {
-                            controller.close();
-                            return;
-                        }
-                        buffer = value;
-                    }
-                    const take = Math.min(buffer.length, size - bytesReadForChunk);
-                    const chunk = buffer.subarray(0, take);
-                    buffer = buffer.subarray(take);
-                    bytesReadForChunk += take;
-                    controller.enqueue(chunk);
-                    opt.onProgress?.(offset + bytesReadForChunk, opt.size);
-                },
-            }),
-            // @ts-expect-error 2769
-            duplex: 'half',
+                    buffer = value;
+                }
+                const take = Math.min(buffer.length, chunkSize - bytesReadForChunk);
+                const chunk = buffer.subarray(0, take);
+                buffer = buffer.subarray(take);
+                bytesReadForChunk += take;
+                controller.enqueue(chunk);
+                onProgress?.(offset + bytesReadForChunk, itemSize);
+            },
+        });
+        let init = { duplex: 'half' };
+        /**
+         * @see https://bugzilla.mozilla.org/show_bug.cgi?id=1387483
+         */
+        if (globalThis.navigator?.userAgent?.toLowerCase().includes('firefox')) {
+            await body.cancel();
+            init = {};
+            warnOnce('Using a workaround for uploading on Firefox [https://bugzilla.mozilla.org/show_bug.cgi?id=1387483]');
+            const chunkData = new Uint8Array(chunkSize);
+            let bytesReadForChunk = 0;
+            if (buffer.length > 0) {
+                const take = Math.min(buffer.length, chunkSize);
+                chunkData.set(buffer.subarray(0, take), 0);
+                buffer = buffer.subarray(take);
+                bytesReadForChunk += take;
+            }
+            while (bytesReadForChunk < chunkSize) {
+                const { done, value } = await reader.read();
+                if (done)
+                    break;
+                const take = Math.min(value.length, chunkSize - bytesReadForChunk);
+                chunkData.set(value.subarray(0, take), bytesReadForChunk);
+                buffer = value.subarray(take);
+                bytesReadForChunk += take;
+            }
+            body = chunkData.subarray(0, bytesReadForChunk);
+            onProgress?.(offset + bytesReadForChunk, itemSize);
+        }
+        response = await fetch(rawStorage('chunk'), {
+            method: 'POST',
+            headers,
+            body,
+            ...init,
         }).catch(handleFetchFailed);
         if (!response.ok)
             await handleError(response);
-        if (offset + size != opt.size && response.status != 204)
+        if (offset + chunkSize != itemSize && response.status != 204)
             console.warn('Unexpected end of upload before last chunk');
     }
     return await handleResponse(response);
 }
-export async function updateItem(fileId, data) {
-    const init = {
-        method: 'POST',
-        headers: {
-            'Content-Type': data.type,
-            'Content-Length': data.size.toString(),
-        },
-        body: data,
-    };
-    if (data instanceof File)
-        init.headers['X-Name'] = data.name;
-    if (token)
-        init.headers.Authorization = 'Bearer ' + token;
-    const response = await fetch(rawStorage(fileId), init).catch(handleFetchFailed);
-    return await handleResponse(response);
+export async function createDirectory(name, parentId) {
+    const upload = await fetchAPI('PUT', 'storage', { name, parentId, type: 'inode/directory', size: 0, hash: null });
+    if (upload.status != 'created')
+        throw new Error('Bug! Creating a directory resulted in an `accepted` status');
+    return upload.item;
+}
+export async function createItem(stream, init) {
+    init.onProgress?.(0, init.size);
+    if (!init.name)
+        throw 'item name is required';
+    const upload = await fetchAPI('PUT', 'storage', { ...init, hash: null });
+    return await _upload(upload, stream, init.size, init.onProgress);
+}
+export async function createItemFromFile(file, init) {
+    return await createItem(file.stream(), { ...pick(file, 'name', 'size', 'type'), ...init });
+}
+export async function updateItem(fileId, newSize, stream, onProgress) {
+    const upload = await fetchAPI('POST', 'storage/item/:id', newSize, fileId);
+    return await _upload(upload, stream, Number(newSize), onProgress);
 }
 export async function getItemMetadata(fileId, options = {}) {
     return await fetchAPI('GET', 'storage/item/:id', options, fileId);

package/dist/client/cli/commands.js

@@ -82,7 +82,7 @@ export const mkdir = new Command('mkdir')
     .argument('<path>', 'remote folder path to create')
     .action(async (path) => {
     const { parent, name } = await resolvePathWithParent(path);
-    const item = await api.uploadItem(new Blob([], { type: 'inode/directory' }), { parentId: parent?.id, name });
+    const item = await api.createDirectory(name, parent?.id);
     const { items } = await syncCache();
     items.push(item);
     writeCache();
@@ -135,7 +135,7 @@ export const upload = new Command('upload')
         const stream = Readable.toWeb(fs.createReadStream(local));
         const type = mime.getType(local) || 'application/octet-stream';
         const _ = __addDisposableResource(env_1, io.start('Uploading ' + name), false);
-        const item = await api.uploadItemStream(stream, {
+        const item = await api.createItem(stream, {
             parentId: parent?.id,
             name,
             size: stats.size,

package/dist/client/sync.js

@@ -5,10 +5,11 @@ import mime from 'mime';
 import { createHash } from 'node:crypto';
 import * as fs from 'node:fs';
 import { basename, dirname, join, matchesGlob, relative } from 'node:path';
+import { Readable, Writable } from 'node:stream';
 import { pick } from 'utilium';
 import * as z from 'zod';
 import '../polyfills.js';
-import { deleteItem, downloadItem, updateItem, uploadItem } from './api.js';
+import { deleteItem, downloadItemStream, updateItem, createItem, createDirectory } from './api.js';
 /**
  * A Sync is a storage item that has been selected for synchronization by the user.
  * Importantly, it is *only* the "top-level" item.
@@ -134,13 +135,15 @@ export async function doSync(sync, opt) {
             name: dirent.name,
         };
         if (dirent.isDirectory()) {
-            const dir = await uploadItem(new Blob([], { type: 'inode/directory' }), uploadOpts);
-            _items.set(dirent._path, Object.assign(pick(dir, 'id', 'modifiedAt'), { path: dirent._path, hash: null }));
+            const dir = await createDirectory(dirent.name, uploadOpts.parentId);
+            _items.set(dirent._path, Object.assign(pick(dir, 'id', 'modifiedAt'), { path: dirent._path }));
         }
         else {
             const type = mime.getType(dirent._path) || 'application/octet-stream';
-            const content = fs.readFileSync(join(sync.local_path, dirent._path));
-            const file = await uploadItem(new Blob([content], { type }), uploadOpts);
+            const { size } = fs.statSync(join(sync.local_path, dirent._path));
+            // cast because Node.js' internals use different types from lib.dom.d.ts
+            const stream = Readable.toWeb(fs.createReadStream(join(sync.local_path, dirent._path)));
+            const file = await createItem(stream, { ...uploadOpts, type, size });
             _items.set(dirent._path, Object.assign(pick(file, 'id', 'modifiedAt', 'hash'), { path: dirent._path }));
         }
     });
@@ -165,24 +168,24 @@ export async function doSync(sync, opt) {
             fs.mkdirSync(fullPath, { recursive: true });
         }
         else {
-            const blob = await downloadItem(item.id);
-            const content = await blob.bytes();
-            fs.writeFileSync(fullPath, content);
+            const writeStream = fs.createWriteStream(fullPath);
+            const stream = await downloadItemStream(item.id);
+            await stream.pipeTo(Writable.toWeb(writeStream));
         }
     });
     if (!opt.verbose && delta.modified.length)
         io.start('Syncing modified items');
     await applyAction(opt, delta.modified, item => (opt.verbose ? 'Updating ' : '') + item.path, async (item) => {
         if (item.modifiedAt.getTime() > fs.statSync(join(sync.local_path, item.path)).mtime.getTime()) {
-            const blob = await downloadItem(item.id);
-            const content = await blob.bytes();
-            fs.writeFileSync(join(sync.local_path, item.path), content);
+            const writeStream = fs.createWriteStream(join(sync.local_path, item.path));
+            const stream = await downloadItemStream(item.id);
+            await stream.pipeTo(Writable.toWeb(writeStream));
             return 'server.';
         }
         else {
-            const type = mime.getType(item.path) || 'application/octet-stream';
-            const content = fs.readFileSync(join(sync.local_path, item.path));
-            const updated = await updateItem(item.id, new Blob([content], { type }));
+            const { size } = fs.statSync(join(sync.local_path, item.path));
+            const stream = Readable.toWeb(fs.createReadStream(join(sync.local_path, item.path)));
+            const updated = await updateItem(item.id, size, stream);
             _items.set(item.path, Object.assign(pick(updated, 'id', 'modifiedAt', 'hash'), { path: item.path }));
             return 'local.';
         }

package/dist/common.d.ts

@@ -1,4 +1,6 @@
 import * as z from 'zod';
+export declare const StorageItemSize: z.ZodCoercedBigInt<unknown>;
+export declare const StorageItemName: z.ZodString;
 /**
  * An update to file metadata.
  */
@@ -58,7 +60,7 @@ export interface StorageItemMetadata<T extends Record<string, unknown> = Record<
 }
 export declare const StorageItemSorting: z.ZodObject<{
     descending: z.ZodOptional<z.ZodBoolean>;
-    by: z.ZodLiteral<"name" | "createdAt" | "modifiedAt" | "size">;
+    by: z.ZodLiteral<"name" | "size" | "createdAt" | "modifiedAt">;
 }, z.core.$strip>;
 export interface StorageItemSorting extends z.infer<typeof StorageItemSorting> {
 }
@@ -147,7 +149,7 @@ export interface UserStorage extends z.infer<typeof UserStorage> {
 export declare const UserStorageOptions: z.ZodDefault<z.ZodObject<{
     sort: z.ZodOptional<z.ZodObject<{
         descending: z.ZodOptional<z.ZodBoolean>;
-        by: z.ZodLiteral<"name" | "createdAt" | "modifiedAt" | "size">;
+        by: z.ZodLiteral<"name" | "size" | "createdAt" | "modifiedAt">;
     }, z.core.$strip>>;
 }, z.core.$strip>>;
 export interface UserStorageOptions extends z.infer<typeof UserStorageOptions> {
@@ -295,7 +297,7 @@ declare const StorageAPI: {
         readonly GET: readonly [z.ZodDefault<z.ZodObject<{
             sort: z.ZodOptional<z.ZodObject<{
                 descending: z.ZodOptional<z.ZodBoolean>;
-                by: z.ZodLiteral<"name" | "createdAt" | "modifiedAt" | "size">;
+                by: z.ZodLiteral<"name" | "size" | "createdAt" | "modifiedAt">;
             }, z.core.$strip>>;
         }, z.core.$strip>>, z.ZodObject<{
             items: z.ZodArray<z.ZodObject<{
@@ -725,6 +727,58 @@ declare const StorageAPI: {
                 name: z.ZodString;
             }, z.core.$strip>>>;
         }, z.core.$strip>];
+        readonly POST: readonly [z.ZodCoercedBigInt<unknown>, z.ZodDiscriminatedUnion<[z.ZodObject<{
+            batch: z.ZodObject<{
+                enabled: z.ZodBoolean;
+                max_items: z.ZodInt;
+                max_item_size: z.ZodInt;
+            }, z.core.$strip>;
+            max_transfer_size: z.ZodInt;
+            status: z.ZodLiteral<"accepted">;
+            token: z.ZodBase64;
+        }, z.core.$strip>, z.ZodObject<{
+            status: z.ZodLiteral<"created">;
+            item: z.ZodObject<{
+                createdAt: z.ZodCoercedDate<unknown>;
+                dataURL: z.ZodString;
+                hash: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+                id: z.ZodUUID;
+                immutable: z.ZodBoolean;
+                modifiedAt: z.ZodCoercedDate<unknown>;
+                name: z.ZodString;
+                userId: z.ZodUUID;
+                parentId: z.ZodNullable<z.ZodUUID>;
+                size: z.ZodCoercedBigInt<unknown>;
+                trashedAt: z.ZodNullable<z.ZodCoercedDate<unknown>>;
+                type: z.ZodString;
+                metadata: z.ZodRecord<z.ZodString, z.ZodUnknown>;
+                acl: z.ZodOptional<z.ZodArray<z.ZodObject<{
+                    itemId: z.ZodUUID;
+                    userId: z.ZodOptional<z.ZodNullable<z.ZodUUID>>;
+                    role: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+                    tag: z.ZodOptional<z.ZodNullable<z.ZodString>>;
+                    user: z.ZodOptional<z.ZodNullable<z.ZodObject<{
+                        id: z.ZodUUID;
+                        name: z.ZodString;
+                        email: z.ZodOptional<z.ZodEmail>;
+                        emailVerified: z.ZodOptional<z.ZodOptional<z.ZodNullable<z.ZodCoercedDate<unknown>>>>;
+                        preferences: z.ZodOptional<z.ZodLazy<z.ZodObject<{
+                            debug: z.ZodDefault<z.ZodBoolean>;
+                        }, z.core.$strip>>>;
+                        roles: z.ZodArray<z.ZodString>;
+                        tags: z.ZodOptional<z.ZodArray<z.ZodString>>;
+                        registeredAt: z.ZodCoercedDate<unknown>;
+                        isAdmin: z.ZodOptional<z.ZodBoolean>;
+                        isSuspended: z.ZodOptional<z.ZodBoolean>;
+                    }, z.core.$strip>>>;
+                    createdAt: z.ZodCoercedDate<unknown>;
+                }, z.core.$catchall<z.ZodBoolean>>>>;
+                parents: z.ZodOptional<z.ZodArray<z.ZodObject<{
+                    id: z.ZodUUID;
+                    name: z.ZodString;
+                }, z.core.$strip>>>;
+            }, z.core.$strip>;
+        }, z.core.$strip>], "status">];
     };
     readonly 'storage/directory/:id': {
         readonly GET: z.ZodArray<z.ZodObject<{

package/dist/common.js

@@ -1,11 +1,13 @@
 import { $API, AccessControl, serverConfigs } from '@axium/core';
 import * as z from 'zod';
+export const StorageItemSize = z.coerce.bigint().nonnegative();
+export const StorageItemName = z.string().nonempty().max(255);
 /**
  * An update to file metadata.
  */
 export const StorageItemUpdate = z
     .object({
-    name: z.string(),
+    name: StorageItemName,
     owner: z.uuid(),
     trash: z.boolean(),
 })
@@ -23,10 +25,10 @@ export const StorageItemMetadata = z.object({
     id: z.uuid(),
     immutable: z.boolean(),
     modifiedAt: z.coerce.date(),
-    name: z.string(),
+    name: StorageItemName,
     userId: z.uuid(),
     parentId: z.uuid().nullable(),
-    size: z.coerce.bigint().nonnegative(),
+    size: StorageItemSize,
     trashedAt: z.coerce.date().nullable(),
     type: z.string(),
     metadata: z.record(z.string(), z.unknown()),
@@ -125,8 +127,8 @@ export const StorageConfig = StoragePublicConfig.safeExtend({
 });
 serverConfigs.set('@axium/storage', StorageConfig);
 export const StorageItemInit = z.object({
-    name: z.string(),
-    size: z.coerce.bigint().nonnegative(),
+    name: StorageItemName,
+    size: StorageItemSize,
     type: z.string(),
     parentId: z.uuid().nullish(),
     hash: z.hex().nullish(),
@@ -170,6 +172,7 @@ const StorageAPI = {
         GET: [GetItemOptions, StorageItemMetadata],
         DELETE: StorageItemMetadata,
         PATCH: [StorageItemUpdate, StorageItemMetadata],
+        POST: [StorageItemSize, UploadInitResult],
     },
     'storage/directory/:id': {
         GET: StorageItemMetadata.array(),

package/dist/server/api.js

@@ -6,11 +6,11 @@ import { error, json, parseBody, parseSearch, withError } from '@axium/server/re
 import { addRoute } from '@axium/server/routes';
 import { pick } from 'utilium';
 import * as z from 'zod';
-import { batchFormatVersion, GetItemOptions, StorageItemInit, StorageItemUpdate, syncProtocolVersion, UserStorageOptions, } from '../common.js';
+import { batchFormatVersion, GetItemOptions, StorageItemInit, StorageItemSize, StorageItemUpdate, syncProtocolVersion, UserStorageOptions, } from '../common.js';
 import '../polyfills.js';
 import { getLimits } from './config.js';
 import { deleteRecursive, getParents, getRecursive, getUserStats, parseItem } from './db.js';
-import { checkNewItem, createNewItem, startUpload } from './item.js';
+import { checkItemUpdate, checkNewItem, createNewItem, startUpload } from './item.js';
 addRoute({
     path: '/api/storage',
     OPTIONS() {
@@ -34,7 +34,7 @@ addRoute({
         return json({
             ...pick(rest, 'batch', 'max_transfer_size'),
             status: 'accepted',
-            token: startUpload(init, session),
+            token: startUpload(init, session, null),
         }, { status: 202 });
     },
 });
@@ -73,6 +73,20 @@ addRoute({
             .executeTakeFirstOrThrow()
             .catch(withError('Could not update item')));
     },
+    async POST(request, { id: itemId }) {
+        const { enabled, ...rest } = getConfig('@axium/storage');
+        if (!enabled)
+            error(503, 'User storage is disabled');
+        const size = await parseBody(request, StorageItemSize);
+        const { item, session } = await checkItemUpdate(request, itemId);
+        if (!session)
+            error(401, 'You must be logged in to change file contents');
+        return json({
+            ...pick(rest, 'batch', 'max_transfer_size'),
+            status: 'accepted',
+            token: startUpload({ ...item, size }, session, itemId),
+        }, { status: 202 });
+    },
     async DELETE(request, { id: itemId }) {
         if (!getConfig('@axium/storage').enabled)
             error(503, 'User storage is disabled');

package/dist/server/item.d.ts

@@ -1,5 +1,5 @@
 import { type Session } from '@axium/core';
-import { type SessionAndUser } from '@axium/server/auth';
+import { type SessionAndUser, type SessionInternal } from '@axium/server/auth';
 import { type Hash } from 'node:crypto';
 import type { StorageItemInit, StorageItemMetadata } from '../common.js';
 import '../polyfills.js';
@@ -12,15 +12,25 @@ export interface NewItemResult {
 export declare function useCAS(type: string): boolean;
 export declare function checkNewItem(init: StorageItemInit, session: SessionAndUser): Promise<NewItemResult>;
 export declare function createNewItem(init: StorageItemInit, userId: string, writeContent?: (path: string) => void): Promise<StorageItemMetadata>;
+export interface ItemUpdateCheckResult {
+    item: StorageItemMetadata;
+    session?: SessionInternal;
+}
+export declare function checkItemUpdate(request: Request, itemId: string): Promise<ItemUpdateCheckResult>;
+export declare function finishItemUpdate(itemId: string, size: bigint, hash: Uint8Array<ArrayBuffer>, writeContent?: (path: string) => void): Promise<StorageItemMetadata>;
 export interface UploadInfo {
     file: string;
-    fd: number;
+    stream: WritableStream;
     hash: Hash;
+    hashStream: WritableStream;
     uploadedBytes: bigint;
     sessionId: string;
     userId: string;
     init: StorageItemInit;
+    /** If set we are updating an existing item. Explicit null used to avoid bugs */
+    itemId: string | null;
+    /** Remove the upload from pending and clean up resources */
     remove(): void;
 }
-export declare function startUpload(init: StorageItemInit, session: Session): string;
+export declare function startUpload(init: StorageItemInit, session: Session, itemId: string | null): string;
 export declare function requireUpload(request: Request): Promise<UploadInfo>;

package/dist/server/item.js

@@ -1,10 +1,12 @@
 import { getConfig } from '@axium/core';
-import { authSessionForItem, requireSession } from '@axium/server/auth';
+import { audit } from '@axium/server/audit';
+import { authRequestForItem, authSessionForItem, requireSession } from '@axium/server/auth';
 import { database } from '@axium/server/database';
 import { error, withError } from '@axium/server/requests';
 import { createHash, randomBytes } from 'node:crypto';
-import { closeSync, linkSync, mkdirSync, openSync } from 'node:fs';
+import { createWriteStream, linkSync, mkdirSync } from 'node:fs';
 import { join } from 'node:path';
+import { Writable } from 'node:stream';
 import * as z from 'zod';
 import '../polyfills.js';
 import { defaultCASMime, getLimits } from './config.js';
@@ -16,13 +18,8 @@ export function useCAS(type) {
         (defaultCASMime.some(pattern => pattern.test(type)) || cas.include?.some(mime => type.match(mime))));
 }
 export async function checkNewItem(init, session) {
-    const { userId } = session;
-    const { size, name, type, hash } = init;
-    const [usage, limits] = await Promise.all([getUserStats(userId), getLimits(userId)]).catch(withError('Could not fetch usage and/or limits'));
-    if (!name)
-        error(400, 'Missing name');
-    if (name.length > 255)
-        error(400, 'Name is too long');
+    const { size, type, hash } = init;
+    const [usage, limits] = await Promise.all([getUserStats(session.userId), getLimits(session.userId)]).catch(withError('Could not fetch usage and/or limits'));
     const parentId = init.parentId
         ? await z
             .uuid()
@@ -31,8 +28,6 @@ export async function checkNewItem(init, session) {
         : null;
     if (parentId)
         await authSessionForItem('storage', parentId, { write: true }, session);
-    if (BigInt(size) < 0n)
-        error(411, 'Missing or invalid content length');
     if (limits.user_items && usage.itemCount >= limits.user_items)
         error(409, 'Too many items');
     if (limits.user_size && (usage.usedBytes + size) / 1000000n >= limits.user_size)
@@ -101,29 +96,71 @@ export async function createNewItem(init, userId, writeContent) {
         throw withError('Could not create item', 500)(error);
     }
 }
+export async function checkItemUpdate(request, itemId) {
+    if (!getConfig('@axium/storage').enabled)
+        error(503, 'User storage is disabled');
+    const { item, session } = await authRequestForItem(request, 'storage', itemId, { write: true }, true);
+    if (item.immutable)
+        error(405, 'Item is immutable');
+    if (item.type == 'inode/directory')
+        error(409, 'Directories do not have content');
+    if (item.trashedAt)
+        error(410, 'Trashed items can not be changed');
+    const type = request.headers.get('content-type') || 'application/octet-stream';
+    if (type != item.type) {
+        await audit('storage_type_mismatch', session?.userId, { item: item.id });
+        error(400, 'Content type does not match existing item type');
+    }
+    return { item: parseItem(item), session };
+}
+export async function finishItemUpdate(itemId, size, hash, writeContent) {
+    const tx = await database.startTransaction().execute();
+    const { data: dataDir } = getConfig('@axium/storage');
+    const path = join(dataDir, itemId);
+    try {
+        const result = await tx
+            .updateTable('storage')
+            .where('id', '=', itemId)
+            .set({ size, modifiedAt: new Date(), hash })
+            .returningAll()
+            .executeTakeFirstOrThrow();
+        if (!writeContent)
+            error(501, 'Missing writeContent (this is a bug!)');
+        writeContent(path);
+        await tx.commit().execute();
+        return parseItem(result);
+    }
+    catch (error) {
+        await tx.rollback().execute();
+        throw withError('Could not update item', 500)(error);
+    }
+}
 const inProgress = new Map();
-export function startUpload(init, session) {
+export function startUpload(init, session, itemId) {
     const { temp_dir, upload_timeout } = getConfig('@axium/storage');
     const token = randomBytes(32);
     mkdirSync(temp_dir, { recursive: true });
     const file = join(temp_dir, token.toHex());
-    const fd = openSync(file, 'a');
     let removed = false;
     function remove() {
         if (removed)
             return;
         removed = true;
         inProgress.delete(token.toBase64());
-        closeSync(fd);
+        void stream.close();
+        hash.end();
     }
+    const hash = createHash('BLAKE2b512'), stream = Writable.toWeb(createWriteStream(file));
     inProgress.set(token.toBase64(), {
-        hash: createHash('BLAKE2b512'),
+        hash,
+        hashStream: Writable.toWeb(hash),
         file,
-        fd,
+        stream,
         uploadedBytes: 0n,
         sessionId: session.id,
         userId: session.userId,
         init,
+        itemId,
         remove,
     });
     setTimeout(() => {

package/dist/server/raw.js

@@ -1,18 +1,17 @@
 import { getConfig } from '@axium/core';
 import { audit } from '@axium/server/audit';
 import { authRequestForItem, requireSession } from '@axium/server/auth';
-import { database } from '@axium/server/database';
 import { error, withError } from '@axium/server/requests';
 import { addRoute } from '@axium/server/routes';
 import { createHash } from 'node:crypto';
-import { copyFileSync, createReadStream, renameSync, unlinkSync, writeFileSync, writeSync } from 'node:fs';
+import { copyFileSync, createReadStream, renameSync, unlinkSync, writeFileSync } from 'node:fs';
 import { join } from 'node:path/posix';
 import { Readable } from 'node:stream';
 import * as z from 'zod';
 import '../polyfills.js';
 import { getLimits } from './config.js';
-import { getUserStats, parseItem } from './db.js';
-import { checkNewItem, createNewItem, requireUpload } from './item.js';
+import { getUserStats } from './db.js';
+import { checkItemUpdate, checkNewItem, createNewItem, finishItemUpdate, requireUpload } from './item.js';
 export function _contentDispositionFor(name, suffix = '') {
     const fallback = name
         .replace(/[\r\n]/g, '')
@@ -50,22 +49,36 @@ addRoute({
         if (!getConfig('@axium/storage').enabled)
             error(503, 'User storage is disabled');
         const upload = await requireUpload(request);
-        const size = BigInt(request.headers.get('content-length') || -1);
+        const size = BigInt(request.headers.get('x-chunk-size') || -1);
         if (size < 0n)
-            error(411, 'Missing or invalid content length');
+            error(411, 'Missing or invalid chunk size');
         if (upload.uploadedBytes + size > upload.init.size)
             error(413, 'Upload exceeds allowed size');
-        const content = await request.bytes();
-        if (content.byteLength != Number(size)) {
-            await audit('storage_size_mismatch', upload.userId, { item: null });
-            error(400, `Content length mismatch: expected ${size}, got ${content.byteLength}`);
-        }
         const offset = BigInt(request.headers.get('x-offset') || -1);
         if (offset != upload.uploadedBytes)
             error(400, `Expected offset ${upload.uploadedBytes} but got ${offset}`);
-        writeSync(upload.fd, content); // opened with 'a', this appends
-        upload.hash.update(content);
-        upload.uploadedBytes += BigInt(size);
+        if (!request.body)
+            error(400, 'Missing request body');
+        let actualSize = 0n;
+        const counter = new TransformStream({
+            transform(chunk, controller) {
+                actualSize += BigInt(chunk.length);
+                controller.enqueue(chunk);
+            },
+        });
+        const [forFile, forHash] = request.body.pipeThrough(counter).tee();
+        /* @todo Figure out if we need to handle stream cancellation differently.
+        Right now an error with this chunk cancels the streams but may not cleanly fail the upload */
+        await Promise.all([
+            forFile.pipeTo(upload.stream, { preventClose: true }),
+            forHash.pipeTo(upload.hashStream, { preventClose: true }),
+        ]);
+        if (actualSize != size) {
+            upload.remove();
+            await audit('storage_size_mismatch', upload.userId, { item: null });
+            error(400, `Content length mismatch: expected ${size}, got ${actualSize}`);
+        }
+        upload.uploadedBytes += actualSize;
         if (upload.uploadedBytes != upload.init.size)
             return new Response(null, { status: 204 });
         const hash = upload.hash.digest();
@@ -73,7 +86,7 @@ addRoute({
         if (hash.toHex() != upload.init.hash)
             error(409, 'Hash mismatch');
         upload.remove();
-        const item = await createNewItem(upload.init, upload.userId, path => {
+        function writeContent(path) {
             try {
                 renameSync(upload.file, path);
             }
@@ -82,7 +95,10 @@ addRoute({
                     throw e;
                 copyFileSync(upload.file, path);
             }
-        });
+        }
+        const item = upload.itemId
+            ? await finishItemUpdate(upload.itemId, upload.init.size, hash, writeContent)
+            : await createNewItem(upload.init, upload.userId, writeContent);
         try {
             unlinkSync(upload.file);
         }
@@ -92,6 +108,19 @@ addRoute({
         return item;
     },
 });
+function parseRange(itemSize, range) {
+    let start = 0, end = Number(itemSize - 1n), length = Number(itemSize);
+    if (range) {
+        const [_start, _end = end] = range
+            .replace(/bytes=/, '')
+            .split('-')
+            .map(val => (val && Number.isSafeInteger(parseInt(val)) ? parseInt(val) : undefined));
+        start = typeof _start == 'number' ? _start : Number(itemSize) - _end;
+        end = typeof _start == 'number' ? _end : end;
+        length = end - start + 1;
+    }
+    return { start, end, length };
+}
 addRoute({
     path: '/raw/storage/:id',
     params: { id: z.uuid() },
@@ -103,17 +132,7 @@ addRoute({
         if (item.trashedAt)
             error(410, 'Trashed items can not be downloaded');
         const path = join(config.data, item.id);
-        const range = request.headers.get('range');
-        let start = 0, end = Number(item.size - 1n), length = Number(item.size);
-        if (range) {
-            const [_start, _end = end] = range
-                .replace(/bytes=/, '')
-                .split('-')
-                .map(val => (val && Number.isSafeInteger(parseInt(val)) ? parseInt(val) : undefined));
-            start = typeof _start == 'number' ? _start : Number(item.size) - _end;
-            end = typeof _start == 'number' ? _end : end;
-            length = end - start + 1;
-        }
+        const { start, end, length } = parseRange(item.size, request.headers.get('range'));
         if (start >= item.size || end >= item.size || start > end || start < 0) {
             return new Response(null, {
                 status: 416,
@@ -133,20 +152,7 @@ addRoute({
         });
     },
     async POST(request, { id: itemId }) {
-        if (!getConfig('@axium/storage').enabled)
-            error(503, 'User storage is disabled');
-        const { item, session } = await authRequestForItem(request, 'storage', itemId, { write: true }, true);
-        if (item.immutable)
-            error(405, 'Item is immutable');
-        if (item.type == 'inode/directory')
-            error(409, 'Directories do not have content');
-        if (item.trashedAt)
-            error(410, 'Trashed items can not be changed');
-        const type = request.headers.get('content-type') || 'application/octet-stream';
-        if (type != item.type) {
-            await audit('storage_type_mismatch', session?.userId, { item: item.id });
-            error(400, 'Content type does not match existing item type');
-        }
+        const { item, session } = await checkItemUpdate(request, itemId);
         const size = Number(request.headers.get('content-length'));
         if (Number.isNaN(size))
             error(411, 'Missing or invalid content length header');
@@ -161,21 +167,8 @@ addRoute({
             error(400, 'Actual content length does not match header');
         }
         const hash = createHash('BLAKE2b512').update(content).digest();
-        const tx = await database.startTransaction().execute();
-        try {
-            const result = await tx
-                .updateTable('storage')
-                .where('id', '=', itemId)
-                .set({ size: BigInt(size), modifiedAt: new Date(), hash })
-                .returningAll()
-                .executeTakeFirstOrThrow();
-            writeFileSync(join(getConfig('@axium/storage').data, result.id), content);
-            await tx.commit().execute();
-            return parseItem(result);
-        }
-        catch (error) {
-            await tx.rollback().execute();
-            throw withError('Could not update item', 500)(error);
-        }
+        return await finishItemUpdate(itemId, BigInt(size), hash, path => {
+            writeFileSync(path, content);
+        });
     },
 });

package/lib/Add.svelte

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { forMime } from '@axium/core/icons';
 	import { FormDialog, Icon, Popover, Upload } from '@axium/client/components';
-	import { uploadItem } from '@axium/storage/client';
+	import { createItemFromFile } from '@axium/storage/client';
 	import type { StorageItemMetadata } from '@axium/storage/common';
 	import { text } from '@axium/client';
 
@@ -46,7 +46,7 @@
 	cancel={() => (files = new DataTransfer().files)}
 	submit={async () => {
 		for (const [i, file] of Array.from(files!).entries()) {
-			const item = await uploadItem(file, {
+			const item = await createItemFromFile(file, {
 				parentId,
 				onProgress(uploaded, total) {
 					uploadProgress[i] = [uploaded, total];
@@ -64,7 +64,7 @@
 	submitText={text('storage.Add.create')}
 	submit={async (data: { name: string; content?: string }) => {
 		const file = new File(createIncludesContent ? [data.content!] : [], data.name, { type: createType });
-		const item = await uploadItem(file, { parentId });
+		const item = await createItemFromFile(file, { parentId });
 		onAdd?.(item);
 	}}
 >

package/lib/List.svelte

@@ -21,8 +21,8 @@
 		user,
 	}: { appMode?: boolean; items: (StorageItemMetadata & AccessControllable)[]; emptyText?: string; user?: UserPublic } = $props();
 
-	let activeIndex = $state<number>(0);
-	const activeItem = $derived(items[activeIndex]);
+	let activeId = $state<string>();
+	const activeItem = $derived(items.find(item => item.id === activeId));
 	const activeItemName = $derived(formatItemName(activeItem));
 	const dialogs = $state<Record<string, HTMLDialogElement>>({});
 
@@ -38,25 +38,31 @@
 	}
 
 	const sortedItems = $derived(
-		items
-			.map((item, i) => [item, i] as const)
-			.toSorted(
-				sort
-					? ([_a], [_b]) => {
-							const [a, b] = sort?.descending ? [_b, _a] : [_a, _b];
-							// @ts-expect-error 2362 — `Date`s have a `valueOf` and can be treated like numbers
-							return sort.by == 'name' ? a.name.localeCompare(b.name) : a[sort.by] - b[sort.by];
-						}
-					: undefined
-			)
+		items.toSorted(
+			sort
+				? (_a, _b) => {
+						const [a, b] = sort?.descending ? [_b, _a] : [_a, _b];
+						// @ts-expect-error 2362 — `Date`s have a `valueOf` and can be treated like numbers
+						return sort.by == 'name' ? a.name.localeCompare(b.name) : a[sort.by] - b[sort.by];
+					}
+				: undefined
+		)
 	);
+
+	function removeActiveItem() {
+		const index = items.findIndex(item => item.id === activeId);
+		if (index == -1) return console.warn('Can not remove active item because it does not exist');
+		items.splice(index, 1);
+		activeId = undefined;
+		dialogs.preview.close();
+	}
 </script>
 
-{#snippet action(name: string, icon: string, i: number)}
+{#snippet action(name: string, icon: string, id: string)}
 	<span
 		class="icon-text action"
 		onclick={() => {
-			activeIndex = i;
+			activeId = id;
 			dialogs[name].showModal();
 		}}
 	>
@@ -79,32 +85,33 @@
 			</span>
 		{/each}
 	</div>
-	{#each sortedItems as [item, i] (item.id)}
+	{#each sortedItems as item (item.id)}
 		{@const trash = () => {
-			activeIndex = i;
-			toastStatus(
-				updateItemMetadata(activeItem.id, { trash: true }).then(() => items.splice(activeIndex, 1)),
-				text('storage.generic.trash_success')
-			);
+			activeId = item.id;
+			toastStatus(updateItemMetadata(activeId, { trash: true }).then(removeActiveItem), text('storage.generic.trash_success'));
 		}}
 		<div
 			class="list-item"
 			onclick={async () => {
 				if (item.type != 'inode/directory') {
-					activeIndex = i;
+					activeId = item.id;
 					dialogs.preview.showModal();
 				} else if (appMode) location.href = '/files/' + item.id;
 				else items = await getDirectoryMetadata(item.id);
 			}}
 			{@attach contextMenu(
-				{ i: 'pencil', text: text('storage.generic.rename'), action: () => ((activeIndex = i), dialogs.rename.showModal()) },
+				{ i: 'pencil', text: text('storage.generic.rename'), action: () => ((activeId = item.id), dialogs.rename.showModal()) },
 				{
 					i: 'user-group',
 					text: text('storage.List.share'),
-					action: () => ((activeIndex = i), dialogs['share:' + item.id].showModal()),
+					action: () => ((activeId = item.id), dialogs['share:' + item.id].showModal()),
 				},
-				{ i: 'download', text: text('storage.generic.download'), action: () => ((activeIndex = i), dialogs.download.showModal()) },
-				{ i: 'link-horizontal', text: text('storage.List.copy_link'), action: () => ((activeIndex = i), copyShortURL(item)) },
+				{
+					i: 'download',
+					text: text('storage.generic.download'),
+					action: () => ((activeId = item.id), dialogs.download.showModal()),
+				},
+				{ i: 'link-horizontal', text: text('storage.List.copy_link'), action: () => ((activeId = item.id), copyShortURL(item)) },
 				{ i: 'trash', text: text('storage.generic.trash'), action: trash },
 				user?.preferences?.debug && {
 					i: 'hashtag',
@@ -126,9 +133,9 @@
 					e.stopImmediatePropagation();
 				}}
 			>
-				{@render action('rename', 'pencil', i)}
-				{@render action('share:' + item.id, 'user-group', i)}
-				{@render action('download', 'download', i)}
+				{@render action('rename', 'pencil', item.id)}
+				{@render action('share:' + item.id, 'user-group', item.id)}
+				{@render action('download', 'download', item.id)}
 				<span class="icon-text action" onclick={trash}>
 					<Icon i="trash" --size="14px" />
 				</span>
@@ -142,12 +149,7 @@
 
 <dialog bind:this={dialogs.preview} class="preview" onclick={e => e.stopPropagation()} {@attach closeOnBackGesture}>
 	{#if activeItem}
-		<Preview
-			item={activeItem}
-			previewDialog={dialogs.preview}
-			shareDialog={dialogs['share:' + activeItem.id]}
-			onDelete={() => items.splice(activeIndex, 1)}
-		/>
+		<Preview item={activeItem} previewDialog={dialogs.preview} shareDialog={dialogs['share:' + activeId]} onDelete={removeActiveItem} />
 	{/if}
 </dialog>
 
@@ -155,8 +157,8 @@
 	bind:dialog={dialogs.rename}
 	submitText={text('storage.generic.rename')}
 	submit={async (data: { name: string }) => {
-		if (!activeItem) throw text('storage.generic.no_item');
-		await updateItemMetadata(activeItem.id, data);
+		if (!activeId || !activeItem) throw text('storage.generic.no_item');
+		await updateItemMetadata(activeId, data);
 		activeItem.name = data.name;
 	}}
 >
@@ -168,8 +170,10 @@
 <FormDialog
 	bind:dialog={dialogs.download}
 	submitText={text('storage.generic.download')}
-	submit={async () =>
-		open(activeItem.type != 'inode/directory' ? activeItem.dataURL : '/raw/storage/directory-zip/' + activeItem.id, '_blank')}
+	submit={async () => {
+		if (!activeId || !activeItem) throw text('storage.generic.no_item');
+		open(activeItem.type != 'inode/directory' ? activeItem.dataURL : '/raw/storage/directory-zip/' + activeId, '_blank');
+	}}
 >
 	<p>{text('storage.generic.download_confirm_named', { name: activeItemName })}</p>
 </FormDialog>

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@axium/storage",
-	"version": "0.22.3",
+	"version": "0.23.1",
 	"author": "James Prevett <axium@jamespre.dev>",
 	"description": "User file storage for Axium",
 	"funding": {
@@ -45,7 +45,7 @@
 		"@axium/server": ">=0.39.0",
 		"@sveltejs/kit": "^2.27.3",
 		"commander": "^14.0.0",
-		"ioium": "^1.2.0",
+		"ioium": "^1.3.0",
 		"kysely": "^0.28.15",
 		"mime": "^4.1.0",
 		"utilium": "^3.1.0"

package/routes/files/trash/+page.svelte

@@ -13,18 +13,26 @@
 	let restoreDialog = $state<HTMLDialogElement>()!;
 	let deleteDialog = $state<HTMLDialogElement>()!;
 
-	let activeIndex = $state<number>(-1);
-	const activeItem = $derived(activeIndex == -1 ? null : items[activeIndex]);
+	let activeId = $state<string>();
+	const activeItem = $derived(items.find(item => item.id === activeId));
 	const activeItemName = $derived(formatItemName(activeItem));
 
-	function action(index: number, dialog: () => HTMLDialogElement) {
+	function action(id: string, dialog: () => HTMLDialogElement) {
 		return (e: Event) => {
 			e.stopPropagation();
 			e.preventDefault();
-			activeIndex = index;
+			activeId = id;
 			dialog().showModal();
 		};
 	}
+
+	function useAndClearActive(thunk: () => any) {
+		if (!activeItem) throw text('storage.generic.no_item');
+		const result = thunk();
+		const index = items.findIndex(item => item.id === activeId);
+		if (index !== -1) items.splice(index, 1);
+		return result;
+	}
 </script>
 
 <svelte:head>
@@ -38,16 +46,16 @@
 		<span>{text('page.files.trash_page.last_modified')}</span>
 		<span>{text('storage.List.size')}</span>
 	</div>
-	{#each items as item, i (item.id)}
+	{#each items as item (item.id)}
 		<div class="list-item">
 			<dfn title={item.type}><Icon i={iconForMime(item.type)} /></dfn>
 			<span class="name">{item.name}</span>
 			<span>{item.modifiedAt.toLocaleString()}</span>
 			<span>{formatBytes(item.size)}</span>
-			<span class="action" onclick={action(i, () => restoreDialog)}>
+			<span class="action" onclick={action(item.id, () => restoreDialog)}>
 				<Icon i="rotate-left" --size="14px" />
 			</span>
-			<span class="action" onclick={action(i, () => deleteDialog)}>
+			<span class="action" onclick={action(item.id, () => deleteDialog)}>
 				<Icon i="trash-can-xmark" --size="14px" --fill="#c44" />
 			</span>
 		</div>
@@ -59,11 +67,7 @@
 <FormDialog
 	bind:dialog={restoreDialog}
 	submitText={text('page.files.trash_page.restore')}
-	submit={async () => {
-		if (!activeItem) throw text('storage.generic.no_item');
-		await updateItemMetadata(activeItem.id, { trash: false });
-		items.splice(activeIndex, 1);
-	}}
+	submit={useAndClearActive(() => updateItemMetadata(activeId!, { trash: false }))}
 >
 	<p>{text('page.files.trash_page.restore_confirm', { name: activeItemName })}</p>
 </FormDialog>
@@ -71,15 +75,9 @@
 	bind:dialog={deleteDialog}
 	submitText={text('page.files.trash_page.delete')}
 	submitDanger
-	submit={async () => {
-		if (!activeItem) throw text('storage.generic.no_item');
-		await deleteItem(activeItem.id);
-		items.splice(activeIndex, 1);
-	}}
+	submit={useAndClearActive(() => deleteItem(activeId!))}
 >
-	<p>
-		{text('page.files.trash_page.delete_confirm', { name: activeItemName })}
-	</p>
+	<p>{text('page.files.trash_page.delete_confirm', { name: activeItemName })}</p>
 </FormDialog>
 
 <style>