public/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich.git synced 2025-11-24 23:40:45 +09:00
Code Issues Actions 8 Packages Projects Releases Wiki Activity

chore: migrate to UI lib icon (#22096)

Browse Source
This commit is contained in:
Daniel Dietzler
2025-09-16 21:40:43 +02:00
committed by GitHub
parent dac545496e
commit 7fe2f19258
78 changed files with 243 additions and 345 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
web/src/lib/modals/AlbumOptionsModal.svelte
View File

@@ -4,7 +4,6 @@
import SettingSwitch from '$lib/components/shared-components/settings/setting-switch.svelte';
import UserAvatar from '$lib/components/shared-components/user-avatar.svelte';
import type { RenderedOption } from '$lib/elements/Dropdown.svelte';
import Icon from '$lib/elements/Icon.svelte';
import { handleError } from '$lib/utils/handle-error';
import {
AlbumUserRole,
@@ -15,7 +14,7 @@
type AlbumResponseDto,
type UserResponseDto,
} from '@immich/sdk';
import { Modal, ModalBody, modalManager } from '@immich/ui';
import { Icon, Modal, ModalBody, modalManager } from '@immich/ui';
import { mdiArrowDownThin, mdiArrowUpThin, mdiDotsVertical, mdiPlus } from '@mdi/js';
import { findKey } from 'lodash-es';
import { t } from 'svelte-i18n';
@@ -142,7 +141,7 @@
<div class="p-2">
<button type="button" class="flex items-center gap-2" onclick={() => onClose({ action: 'shareUser' })}>
<div class="rounded-full w-10 h-10 border border-gray-500 flex items-center justify-center">
<div><Icon path={mdiPlus} size="25" /></div>
<div><Icon icon={mdiPlus} size="25" /></div>
</div>
<div>{$t('invite_people')}</div>
</button>

5
web/src/lib/modals/AlbumShareModal.svelte
View File

@@ -2,7 +2,6 @@
import AlbumSharedLink from '$lib/components/album-page/album-shared-link.svelte';
import { AppRoute } from '$lib/constants';
import Dropdown from '$lib/elements/Dropdown.svelte';
import Icon from '$lib/elements/Icon.svelte';
import QrCodeModal from '$lib/modals/QrCodeModal.svelte';
import { makeSharedLinkUrl } from '$lib/utils';
import {
@@ -14,7 +13,7 @@
type SharedLinkResponseDto,
type UserResponseDto,
} from '@immich/sdk';
import { Button, Link, Modal, ModalBody, Stack, Text } from '@immich/ui';
import { Button, Icon, Link, Modal, ModalBody, Stack, Text } from '@immich/ui';
import { mdiCheck, mdiEye, mdiLink, mdiPencil } from '@mdi/js';
import { onMount } from 'svelte';
import { t } from 'svelte-i18n';
@@ -87,7 +86,7 @@
<div
class="flex h-10 w-10 items-center justify-center rounded-full border bg-green-600 text-3xl text-white"
>
<Icon path={mdiCheck} size={24} />
<Icon icon={mdiCheck} size="24" />
</div>
<!-- <UserAvatar {user} size="md" /> -->

5
web/src/lib/modals/AssetTagModal.svelte
View File

@@ -1,8 +1,7 @@
<script lang="ts">
import Icon from '$lib/elements/Icon.svelte';
import { tagAssets } from '$lib/utils/asset-utils';
import { getAllTags, upsertTags, type TagResponseDto } from '@immich/sdk';
import { Button, HStack, Modal, ModalBody, ModalFooter } from '@immich/ui';
import { Button, HStack, Icon, Modal, ModalBody, ModalFooter } from '@immich/ui';
import { mdiClose, mdiTag } from '@mdi/js';
import { onMount } from 'svelte';
import { t } from 'svelte-i18n';
@@ -90,7 +89,7 @@
title={$t('remove_tag')}
onclick={() => handleRemove(tagId)}
>
<Icon path={mdiClose} />
<Icon icon={mdiClose} />
</button>
</div>
{/if}

19
web/src/lib/modals/HelpAndFeedbackModal.svelte
View File

@@ -1,8 +1,7 @@
<script lang="ts">
import { discordPath, discordViewBox } from '$lib/assets/svg-paths';
import Icon from '$lib/elements/Icon.svelte';
import { type ServerAboutResponseDto } from '@immich/sdk';
import { Modal, ModalBody } from '@immich/ui';
import { Icon, Modal, ModalBody } from '@immich/ui';
import { mdiBugOutline, mdiFaceAgent, mdiGit, mdiGithub, mdiInformationOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
@@ -20,7 +19,7 @@
<div class="flex flex-col sm:grid sm:grid-cols-2 gap-2 mt-5">
<div>
<a href="https://{info.version}.archive.immich.app/docs/overview/introduction" target="_blank" rel="noreferrer">
<Icon path={mdiInformationOutline} size="1.5em" class="inline-block" />
<Icon icon={mdiInformationOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="documentation-label"
@@ -32,7 +31,7 @@
<div>
<a href="https://github.com/immich-app/immich/" target="_blank" rel="noreferrer">
<Icon path={mdiGithub} size="1.5em" class="inline-block" />
<Icon icon={mdiGithub} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
@@ -44,7 +43,7 @@
<div>
<a href="https://discord.immich.app" target="_blank" rel="noreferrer">
<Icon path={discordPath} viewBox={discordViewBox} class="inline-block" size="1.5em" />
<Icon icon={discordPath} viewBox={discordViewBox} class="inline-block" size="1.5em" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
@@ -56,7 +55,7 @@
<div>
<a href="https://github.com/immich-app/immich/issues/new/choose" target="_blank" rel="noreferrer">
<Icon path={mdiBugOutline} size="1.5em" class="inline-block" />
<Icon icon={mdiBugOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
@@ -75,7 +74,7 @@
{#if info.thirdPartyDocumentationUrl}
<div>
<a href={info.thirdPartyDocumentationUrl} target="_blank" rel="noreferrer">
<Icon path={mdiInformationOutline} size="1.5em" class="inline-block" />
<Icon icon={mdiInformationOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="documentation-label"
@@ -89,7 +88,7 @@
{#if info.thirdPartySourceUrl}
<div>
<a href={info.thirdPartySourceUrl} target="_blank" rel="noreferrer">
<Icon path={mdiGit} size="1.5em" class="inline-block" />
<Icon icon={mdiGit} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
@@ -103,7 +102,7 @@
{#if info.thirdPartySupportUrl}
<div>
<a href={info.thirdPartySupportUrl} target="_blank" rel="noreferrer">
<Icon path={mdiFaceAgent} class="inline-block" size="1.5em" />
<Icon icon={mdiFaceAgent} class="inline-block" size="1.5em" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"
@@ -117,7 +116,7 @@
{#if info.thirdPartyBugFeatureUrl}
<div>
<a href={info.thirdPartyBugFeatureUrl} target="_blank" rel="noreferrer">
<Icon path={mdiBugOutline} size="1.5em" class="inline-block" />
<Icon icon={mdiBugOutline} size="1.5em" class="inline-block" />
<p
class="font-medium text-immich-primary dark:text-immich-dark-primary text-sm underline inline-block"
id="github-label"

7
web/src/lib/modals/PersonMergeSuggestionModal.svelte
View File

@@ -3,11 +3,10 @@
notificationController,
NotificationType,
} from '$lib/components/shared-components/notification/notification';
import Icon from '$lib/elements/Icon.svelte';
import { getPeopleThumbnailUrl } from '$lib/utils';
import { handleError } from '$lib/utils/handle-error';
import { mergePerson, type PersonResponseDto } from '@immich/sdk';
import { Button, HStack, IconButton, Modal, ModalBody, ModalFooter } from '@immich/ui';
import { Button, HStack, Icon, IconButton, Modal, ModalBody, ModalFooter } from '@immich/ui';
import { mdiArrowLeft, mdiCallMerge, mdiSwapHorizontal } from '@mdi/js';
import { onMount, tick } from 'svelte';
import { t } from 'svelte-i18n';
@@ -78,7 +77,7 @@
<div></div>
<div class="flex flex-col h-full items-center justify-center">
<div class="flex h-full items-center justify-center">
<Icon path={mdiCallMerge} size={48} class="rotate-90 dark:text-white" />
<Icon icon={mdiCallMerge} size="48" class="rotate-90 dark:text-white" />
</div>
</div>
<div>
@@ -115,7 +114,7 @@
{:else}
<div class="grid w-full grid-cols-1 gap-2">
<div class="px-2">
<button type="button" onclick={() => (choosePersonToMerge = false)}> <Icon path={mdiArrowLeft} /></button>
<button type="button" onclick={() => (choosePersonToMerge = false)}> <Icon icon={mdiArrowLeft} /></button>
</div>
<div class="flex items-center justify-center">
<div class="flex flex-wrap justify-center md:grid md:grid-cols-{potentialMergePeople.length}">

5
web/src/lib/modals/ServerAboutModal.svelte
View File

@@ -1,8 +1,7 @@
<script lang="ts">
import Icon from '$lib/elements/Icon.svelte';
import { locale } from '$lib/stores/preferences.store';
import { type ServerAboutResponseDto, type ServerVersionHistoryResponseDto } from '@immich/sdk';
import { Modal, ModalBody } from '@immich/ui';
import { Icon, Modal, ModalBody } from '@immich/ui';
import { mdiAlert } from '@mdi/js';
import { DateTime } from 'luxon';
import { t } from 'svelte-i18n';
@@ -159,7 +158,7 @@
{#if info.sourceRef === 'main' && info.repository === 'immich-app/immich'}
<div class="col-span-full p-4 flex gap-1">
<Icon path={mdiAlert} size="2em" color="#ffcc4d" />
<Icon icon={mdiAlert} size="2em" color="#ffcc4d" />
<p class="immich-form-label text-sm" id="main-warning">
{$t('main_branch_warning')}
</p>

5
web/src/lib/modals/ShortcutsModal.svelte
View File

@@ -1,6 +1,5 @@
<script lang="ts">
import Icon from '$lib/elements/Icon.svelte';
import { Modal, ModalBody } from '@immich/ui';
import { Icon, Modal, ModalBody } from '@immich/ui';
import { mdiInformationOutline } from '@mdi/js';
import { t } from 'svelte-i18n';
@@ -91,7 +90,7 @@
<div class="flex items-center gap-2">
<p class="mb-1 mt-1 flex">{shortcut.action}</p>
{#if shortcut.info}
<Icon path={mdiInformationOutline} title={shortcut.info} />
<Icon icon={mdiInformationOutline} title={shortcut.info} />
{/if}
</div>
</div>