feat(frontend): select photo in album grid and show info in panel

- single click selects a photo (ring + aria-pressed) and shows its info in the right panel without navigating; double click opens the viewer
- shared 'selection' store; panel uses the route photo in viewer mode and the selected photo in album mode; selection resets on album change
- openspec: sync lightroom-workspace-ui (grid-selection requirement, viewer chrome wording without timers, nested f fullscreen, tasks 9.9/9.10)
This commit is contained in:
iu
2026-10-10 21:33:59 +03:00
parent 642e3bcf8a
commit 78996bc053
8 changed files with 114 additions and 33 deletions
@@ -8,6 +8,7 @@
import Icon from '$lib/components/Icon.svelte';
import { auth } from '$lib/stores/auth.svelte';
import { albums } from '$lib/stores/albums.svelte';
import { selection } from '$lib/stores/selection.svelte';
import { SSEClient, type SSEEvent } from '$lib/sse';
import type { Album, Photo } from '$lib/types';
@@ -50,6 +51,7 @@
$effect(() => {
const id = albumId;
selection.clear();
loading = true;
error = '';
Promise.all([loadAlbum(), loadPhotos()])
@@ -200,6 +202,11 @@
{:else}
<PhotoGrid
{photos}
selectedId={selection.albumId === albumId ? (selection.photo?.id ?? null) : null}
onSelect={(i) => {
const p = photos[i];
if (p) selection.select(albumId, p);
}}
onOpen={(i) => {
const p = photos[i];
if (p) goto(`/albums/${albumId}/photos/${p.id}`);