immich-app/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-12-18 09:13:15 +03:00
Code Issues Packages Projects Releases 16 Wiki Activity

Use text color of enable/disable shared link properties

Browse Source
This commit is contained in:
Alex Tran
2025-12-15 20:30:51 +00:00
parent e2ec79dbf0
commit 3582e00ceb
2 changed files with 35 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

55
web/src/lib/components/sharedlinks-page/SharedLinkCard.svelte
View File

@@ -5,8 +5,7 @@
import { getSharedLinkActions } from '$lib/services/shared-link.service'; import { getSharedLinkActions } from '$lib/services/shared-link.service';
import { locale } from '$lib/stores/preferences.store'; import { locale } from '$lib/stores/preferences.store';
import { SharedLinkType, type SharedLinkResponseDto } from '@immich/sdk'; import { SharedLinkType, type SharedLinkResponseDto } from '@immich/sdk';
import { ContextMenuButton, Icon, MenuItemType, Text } from '@immich/ui'; import { ContextMenuButton, MenuItemType, Text } from '@immich/ui';
import { mdiDownload, mdiInformationOutline, mdiLink, mdiLock, mdiUpload } from '@mdi/js';
import { DateTime, type ToRelativeUnit } from 'luxon'; import { DateTime, type ToRelativeUnit } from 'luxon';
import { t } from 'svelte-i18n'; import { t } from 'svelte-i18n';
@@ -70,26 +69,38 @@
{/if} {/if}
</div> </div>
<div class="flex flex-wrap gap-1"> <div class="flex flex-wrap items-center gap-2">
{#if sharedLink.slug} <Text
<Icon icon={mdiLink} size="18" title={$t('custom_url')} /> size="small"
{/if} color={sharedLink.allowUpload ? 'primary' : 'muted'}
class={sharedLink.allowUpload ? 'font-medium' : 'opacity-50'}
{#if sharedLink.allowUpload} >
<Icon icon={mdiUpload} size="18" title={$t('upload')} /> {$t('upload')}
{/if} </Text>
<Text size="small" color="muted">•</Text>
{#if sharedLink.showMetadata && sharedLink.allowDownload} <Text
<Icon icon={mdiDownload} size="18" title={$t('download')} /> size="small"
{/if} color={sharedLink.allowDownload ? 'primary' : 'muted'}
class={sharedLink.allowDownload ? 'font-medium' : 'opacity-50'}
{#if sharedLink.showMetadata} >
<Icon icon={mdiInformationOutline} size="18" title={$t('exif')} /> {$t('download')}
{/if} </Text>
<Text size="small" color="muted">•</Text>
{#if sharedLink.password} <Text
<Icon icon={mdiLock} size="18" title={$t('password')} /> size="small"
{/if} color={sharedLink.showMetadata ? 'primary' : 'muted'}
class={sharedLink.showMetadata ? 'font-medium' : 'opacity-50'}
>
{$t('exif')}
</Text>
<Text size="small" color="muted">•</Text>
<Text
size="small"
color={sharedLink.password ? 'primary' : 'muted'}
class={sharedLink.password ? 'font-medium' : 'opacity-50'}
>
{$t('password')}
</Text>
</div> </div>
</div> </div>
</svelte:element> </svelte:element>

4
web/src/lib/services/shared-link.service.ts
View File

@@ -17,7 +17,7 @@ import {
type SharedLinkResponseDto, type SharedLinkResponseDto,
} from '@immich/sdk'; } from '@immich/sdk';
import { modalManager, toastManager, type ActionItem } from '@immich/ui'; import { modalManager, toastManager, type ActionItem } from '@immich/ui';
import { mdiContentCopy, mdiDeleteOutline, mdiPencilOutline, mdiQrcode } from '@mdi/js'; import { mdiContentCopy, mdiPencilOutline, mdiQrcode, mdiTrashCanOutline } from '@mdi/js';
import type { MessageFormatter } from 'svelte-i18n'; import type { MessageFormatter } from 'svelte-i18n';
export const getSharedLinkActions = ($t: MessageFormatter, sharedLink: SharedLinkResponseDto) => { export const getSharedLinkActions = ($t: MessageFormatter, sharedLink: SharedLinkResponseDto) => {
@@ -29,7 +29,7 @@ export const getSharedLinkActions = ($t: MessageFormatter, sharedLink: SharedLin
const Delete: ActionItem = { const Delete: ActionItem = {
title: $t('delete_link'), title: $t('delete_link'),
icon: mdiDeleteOutline, icon: mdiTrashCanOutline,
color: 'danger', color: 'danger',
onAction: () => handleDeleteSharedLink(sharedLink), onAction: () => handleDeleteSharedLink(sharedLink),
}; };