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:
@@ -5,10 +5,12 @@
|
||||
|
||||
interface Props {
|
||||
photos: Photo[];
|
||||
selectedId?: string | null;
|
||||
onSelect?: (index: number) => void;
|
||||
onOpen?: (index: number) => void;
|
||||
}
|
||||
|
||||
let { photos, onOpen }: Props = $props();
|
||||
let { photos, selectedId = null, onSelect, onOpen }: Props = $props();
|
||||
</script>
|
||||
|
||||
{#if photos.length === 0}
|
||||
@@ -22,8 +24,13 @@
|
||||
<li>
|
||||
<button
|
||||
type="button"
|
||||
class="border-border bg-bg-muted group relative block aspect-square w-full overflow-hidden rounded-lg border"
|
||||
onclick={() => onOpen?.(i)}
|
||||
class="border-border bg-bg-muted group relative block aspect-square w-full overflow-hidden rounded-lg border {photo.id ===
|
||||
selectedId
|
||||
? 'ring-primary ring-2'
|
||||
: ''}"
|
||||
aria-pressed={photo.id === selectedId}
|
||||
onclick={() => onSelect?.(i)}
|
||||
ondblclick={() => onOpen?.(i)}
|
||||
>
|
||||
{#if photo.thumb_url}
|
||||
<img
|
||||
|
||||
Reference in New Issue
Block a user