diff --git a/e2e/src/ui/specs/timeline/utils.ts b/e2e/src/ui/specs/timeline/utils.ts index b7003295cf..e67229d3c9 100644 --- a/e2e/src/ui/specs/timeline/utils.ts +++ b/e2e/src/ui/specs/timeline/utils.ts @@ -62,7 +62,7 @@ export const thumbnailUtils = { return page.locator(`[data-thumbnail-focus-container][data-asset="${assetId}"]`); }, selectButton(page: Page, assetId: string) { - return page.locator(`[data-thumbnail-focus-container][data-asset="${assetId}"] button`); + return page.locator(`[data-thumbnail-focus-container][data-asset="${assetId}"] button[role="checkbox"]`); }, selectedAsset(page: Page) { return page.locator('[data-thumbnail-focus-container][data-selected]'); diff --git a/web/src/lib/components/assets/thumbnail/thumbnail.svelte b/web/src/lib/components/assets/thumbnail/thumbnail.svelte index f7b9020d98..3413e912b0 100644 --- a/web/src/lib/components/assets/thumbnail/thumbnail.svelte +++ b/web/src/lib/components/assets/thumbnail/thumbnail.svelte @@ -19,6 +19,7 @@ mdiCheckCircle, mdiFileGifBox, mdiHeart, + mdiMagnifyPlusOutline, mdiMotionPauseOutline, mdiMotionPlayOutline, mdiRotate360, @@ -46,6 +47,7 @@ dimmed?: boolean; albumUsers?: UserResponseDto[]; onClick?: (asset: TimelineAsset) => void; + onPreview?: (asset: TimelineAsset) => void; onSelect?: (asset: TimelineAsset) => void; onMouseEvent?: (event: { isMouseOver: boolean; selectedGroupIndex: number }) => void; } @@ -65,6 +67,7 @@ showStackedIcon = true, albumUsers = [], onClick = undefined, + onPreview = undefined, onSelect = undefined, onMouseEvent = undefined, imageClass = '', @@ -442,6 +445,24 @@ {/if} + + {#if mouseOver && onPreview} + + {/if} +