feat(archive): red-cross flash + instant tile removal on archive/delete

Archive/delete now flash a red cross then drop tiles from the grid
immediately, instead of a green check that lingered until the slow
server-reconcile refetch landed. Keyboard `x` archive previously never
called markRemoved, so tiles only vanished on refetch — that lag is gone.

- Add 'removed' bulk state + removedBulk() helper (red cross overlay)
- gridKeyNav archive/delete: removedBulk -> 500ms flash -> markRemoved,
  clearRemoved once refetch settles; restore stays green check
- BulkActionBar: BulkConfig.removing routes archive/delete through the
  red flash; approve/restore/label/note unchanged

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-17 23:45:38 +02:00
parent 3e164c48d0
commit 5be6fd9047
4 changed files with 81 additions and 14 deletions

View File

@@ -6,6 +6,8 @@
* startBulk → pill spins, all target tiles go "pending"
* setDetail → pill shows the filename currently being processed (fan-out ops)
* doneBulk → pill shows completion label, tiles flash green, auto-clears after 3 s
* removedBulk→ destructive completion (archive / delete): tiles flash a red cross,
* then the caller hides them via markRemoved; map auto-clears after 3 s
* failBulk → tiles flash red, auto-clears after 2 s
*/
@@ -21,7 +23,7 @@ export const bulkAction = $state<BulkActionState>({ active: false, label: '' });
// SvelteMap (not `$state(new Map())`) so a `.get(uid)` read in a PhotoTile
// reliably re-runs when the entry flips — the plain-Map proxy form wasn't
// re-rendering the timeline tiles' overlay.
export const bulkPhotoStates = new SvelteMap<string, 'pending' | 'done' | 'error'>();
export const bulkPhotoStates = new SvelteMap<string, 'pending' | 'done' | 'error' | 'removed'>();
/**
* UIDs hidden from the timeline grid the instant a removing action (archive /
@@ -71,6 +73,24 @@ export function doneBulk(label: string, ids: string[]): void {
}, 3000);
}
/**
* Destructive completion (archive / permanent delete): flash a red cross on the
* target tiles instead of the green check. The caller hides the tiles via
* markRemoved shortly after the flash; this timer only cleans up the state map.
*/
export function removedBulk(label: string, ids: string[]): void {
for (const id of ids) bulkPhotoStates.set(id, 'removed');
bulkAction.active = false;
bulkAction.label = label;
bulkAction.detail = undefined;
if (doneTimer !== null) clearTimeout(doneTimer);
doneTimer = setTimeout(() => {
bulkAction.label = '';
bulkPhotoStates.clear();
doneTimer = null;
}, 3000);
}
export function failBulk(ids: string[]): void {
for (const id of ids) bulkPhotoStates.set(id, 'error');
bulkAction.active = false;