refactor: replace link-button component with immich-ui buttons (#15374)
* refactor: replace link-button component with immich-ui buttons * minor styling tweak --------- Co-authored-by: Alex Tran <alex.tran1502@gmail.com>
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
<script lang="ts">
|
||||
import { goto } from '$app/navigation';
|
||||
import empty3Url from '$lib/assets/empty-3.svg';
|
||||
import LinkButton from '$lib/components/elements/buttons/link-button.svelte';
|
||||
import Icon from '$lib/components/elements/icon.svelte';
|
||||
import UserPageLayout from '$lib/components/layouts/user-page-layout.svelte';
|
||||
import DeleteAssets from '$lib/components/photos-page/actions/delete-assets.svelte';
|
||||
@@ -9,23 +8,24 @@
|
||||
import SelectAllAssets from '$lib/components/photos-page/actions/select-all-assets.svelte';
|
||||
import AssetGrid from '$lib/components/photos-page/asset-grid.svelte';
|
||||
import AssetSelectControlBar from '$lib/components/photos-page/asset-select-control-bar.svelte';
|
||||
import { dialogController } from '$lib/components/shared-components/dialog/dialog';
|
||||
import EmptyPlaceholder from '$lib/components/shared-components/empty-placeholder.svelte';
|
||||
import {
|
||||
NotificationType,
|
||||
notificationController,
|
||||
} from '$lib/components/shared-components/notification/notification';
|
||||
import { AppRoute } from '$lib/constants';
|
||||
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
|
||||
import { AssetStore } from '$lib/stores/assets.store';
|
||||
import { featureFlags, serverConfig } from '$lib/stores/server-config.store';
|
||||
import { handlePromiseError } from '$lib/utils';
|
||||
import { handleError } from '$lib/utils/handle-error';
|
||||
import { emptyTrash, restoreTrash } from '@immich/sdk';
|
||||
import { Button, HStack } from '@immich/ui';
|
||||
import { mdiDeleteForeverOutline, mdiHistory } from '@mdi/js';
|
||||
import type { PageData } from './$types';
|
||||
import { handlePromiseError } from '$lib/utils';
|
||||
import { dialogController } from '$lib/components/shared-components/dialog/dialog';
|
||||
import { t } from 'svelte-i18n';
|
||||
import { onDestroy } from 'svelte';
|
||||
import { AssetInteraction } from '$lib/stores/asset-interaction.svelte';
|
||||
import { t } from 'svelte-i18n';
|
||||
import type { PageData } from './$types';
|
||||
|
||||
interface Props {
|
||||
data: PageData;
|
||||
@@ -113,20 +113,28 @@
|
||||
{#if $featureFlags.loaded && $featureFlags.trash}
|
||||
<UserPageLayout hideNavbar={assetInteraction.selectionActive} title={data.meta.title} scrollbar={false}>
|
||||
{#snippet buttons()}
|
||||
<div class="flex place-items-center gap-2">
|
||||
<LinkButton onclick={handleRestoreTrash} disabled={assetInteraction.selectionActive}>
|
||||
<div class="flex place-items-center gap-2 text-sm">
|
||||
<Icon path={mdiHistory} size="18" />
|
||||
{$t('restore_all')}
|
||||
</div>
|
||||
</LinkButton>
|
||||
<LinkButton onclick={() => handleEmptyTrash()} disabled={assetInteraction.selectionActive}>
|
||||
<div class="flex place-items-center gap-2 text-sm">
|
||||
<Icon path={mdiDeleteForeverOutline} size="18" />
|
||||
{$t('empty_trash')}
|
||||
</div>
|
||||
</LinkButton>
|
||||
</div>
|
||||
<HStack gap={0}>
|
||||
<Button
|
||||
onclick={handleRestoreTrash}
|
||||
disabled={assetInteraction.selectionActive}
|
||||
variant="ghost"
|
||||
color="secondary"
|
||||
size="small"
|
||||
>
|
||||
<Icon path={mdiHistory} />
|
||||
{$t('restore_all')}
|
||||
</Button>
|
||||
<Button
|
||||
onclick={() => handleEmptyTrash()}
|
||||
disabled={assetInteraction.selectionActive}
|
||||
variant="ghost"
|
||||
color="secondary"
|
||||
size="small"
|
||||
>
|
||||
<Icon path={mdiDeleteForeverOutline} />
|
||||
{$t('empty_trash')}
|
||||
</Button>
|
||||
</HStack>
|
||||
{/snippet}
|
||||
|
||||
<AssetGrid enableRouting={true} {assetStore} {assetInteraction} onEscape={handleEscape}>
|
||||
|
||||
Reference in New Issue
Block a user