github-mirrors/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2026-03-08 02:57:48 +03:00
Code Issues Packages Projects Releases Wiki Activity

chore(web): context menu improvements (#10475)

Browse Source 
- ability to add custom hover colors
- migrate activity menu to ButtonContextMenu component
- onClick callbacks rather than events for menu options
- remove slots
- configurable menu option colors
- improve menu option layout
This commit is contained in:
Ben
2024-06-20 21:15:36 +00:00
committed by GitHub
parent 5cde52eec9
commit 0fda67543d
19 changed files with 102 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/src/lib/components/photos-page/actions/add-to-album.svelte
View File

@@ -33,7 +33,7 @@
</script>
<MenuOption
on:click={() => (showAlbumPicker = true)}
onClick={() => (showAlbumPicker = true)}
text={shared ? $t('add_to_shared_album') : $t('add_to_album')}
icon={shared ? mdiShareVariantOutline : mdiImageAlbum}
/>

2
web/src/lib/components/photos-page/actions/archive-action.svelte
View File

@@ -33,7 +33,7 @@
</script>
{#if menuItem}
<MenuOption {text} {icon} on:click={handleArchive} />
<MenuOption {text} {icon} onClick={handleArchive} />
{/if}
{#if !menuItem}

2
web/src/lib/components/photos-page/actions/asset-job-actions.svelte
View File

@@ -34,6 +34,6 @@
{#each jobs as job}
{#if isAllVideos || job !== AssetJobName.TranscodeVideo}
<MenuOption text={getAssetJobName(job)} icon={getAssetJobIcon(job)} on:click={() => handleRunJob(job)} />
<MenuOption text={getAssetJobName(job)} icon={getAssetJobIcon(job)} onClick={() => handleRunJob(job)} />
{/if}
{/each}

2
web/src/lib/components/photos-page/actions/change-date-action.svelte
View File

@@ -28,7 +28,7 @@
</script>
{#if menuItem}
<MenuOption text={$t('change_date')} icon={mdiCalendarEditOutline} on:click={() => (isShowChangeDate = true)} />
<MenuOption text={$t('change_date')} icon={mdiCalendarEditOutline} onClick={() => (isShowChangeDate = true)} />
{/if}
{#if isShowChangeDate}
<ChangeDate

2
web/src/lib/components/photos-page/actions/change-location-action.svelte
View File

@@ -31,7 +31,7 @@
<MenuOption
text={$t('change_location')}
icon={mdiMapMarkerMultipleOutline}
on:click={() => (isShowChangeLocation = true)}
onClick={() => (isShowChangeLocation = true)}
/>
{/if}
{#if isShowChangeLocation}

2
web/src/lib/components/photos-page/actions/delete-assets.svelte
View File

@@ -39,7 +39,7 @@
</script>
{#if menuItem}
<MenuOption text={label} icon={mdiDeleteOutline} on:click={handleTrash} />
<MenuOption text={label} icon={mdiDeleteOutline} onClick={handleTrash} />
{:else if loading}
<CircleIconButton title={$t('loading')} icon={mdiTimerSand} />
{:else}

2
web/src/lib/components/photos-page/actions/download-action.svelte
View File

@@ -27,7 +27,7 @@
</script>
{#if menuItem}
<MenuOption text={$t('download')} icon={menuItemIcon} on:click={handleDownloadFiles} />
<MenuOption text={$t('download')} icon={menuItemIcon} onClick={handleDownloadFiles} />
{:else}
<CircleIconButton title={$t('download')} icon={mdiCloudDownloadOutline} on:click={handleDownloadFiles} />
{/if}

2
web/src/lib/components/photos-page/actions/favorite-action.svelte
View File

@@ -58,7 +58,7 @@
</script>
{#if menuItem}
<MenuOption {text} {icon} on:click={handleFavorite} />
<MenuOption {text} {icon} onClick={handleFavorite} />
{/if}
{#if !menuItem}

2
web/src/lib/components/photos-page/actions/remove-from-album.svelte
View File

@@ -57,7 +57,7 @@
</script>
{#if menuItem}
<MenuOption text={$t('remove_from_album')} icon={mdiImageRemoveOutline} on:click={removeFromAlbum} />
<MenuOption text={$t('remove_from_album')} icon={mdiImageRemoveOutline} onClick={removeFromAlbum} />
{:else}
<CircleIconButton title={$t('remove_from_album')} icon={mdiDeleteOutline} on:click={removeFromAlbum} />
{/if}

4
web/src/lib/components/photos-page/actions/stack-action.svelte
View File

@@ -40,7 +40,7 @@
</script>
{#if unstack}
<MenuOption text={$t('unstack')} icon={mdiImageMinusOutline} on:click={handleUnstack} />
<MenuOption text={$t('unstack')} icon={mdiImageMinusOutline} onClick={handleUnstack} />
{:else}
<MenuOption text={$t('stack')} icon={mdiImageMultipleOutline} on:click={handleStack} />
<MenuOption text={$t('stack')} icon={mdiImageMultipleOutline} onClick={handleStack} />
{/if}