Jason Rasmussen
80 lines
2.5 KiB
Svelte
80 lines
2.5 KiB
Svelte
<script lang="ts">
|
|
import CircleIconButton from '$lib/components/elements/buttons/circle-icon-button.svelte';
|
|
import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
|
|
import {
|
|
NotificationType,
|
|
notificationController,
|
|
} from '$lib/components/shared-components/notification/notification';
|
|
import { getAlbumInfo, removeAssetFromAlbum, type AlbumResponseDto } from '@immich/sdk';
|
|
import { mdiDeleteOutline, mdiImageRemoveOutline } from '@mdi/js';
|
|
import MenuOption from '../../shared-components/context-menu/menu-option.svelte';
|
|
import { getAssetControlContext } from '../asset-select-control-bar.svelte';
|
|
import { s } from '$lib/utils';
|
|
|
|
export let album: AlbumResponseDto;
|
|
export let onRemove: ((assetIds: string[]) => void) | undefined;
|
|
export let menuItem = false;
|
|
|
|
const { getAssets, clearSelect } = getAssetControlContext();
|
|
|
|
let isShowConfirmation = false;
|
|
|
|
const removeFromAlbum = async () => {
|
|
try {
|
|
const ids = [...getAssets()].map((a) => a.id);
|
|
const results = await removeAssetFromAlbum({
|
|
id: album.id,
|
|
bulkIdsDto: { ids },
|
|
});
|
|
|
|
album = await getAlbumInfo({ id: album.id });
|
|
|
|
onRemove?.(ids);
|
|
|
|
const count = results.filter(({ success }) => success).length;
|
|
notificationController.show({
|
|
type: NotificationType.Info,
|
|
message: `Removed ${count} asset${s(count)}`,
|
|
});
|
|
|
|
clearSelect();
|
|
} catch (error) {
|
|
console.error('Error [album-viewer] [removeAssetFromAlbum]', error);
|
|
notificationController.show({
|
|
type: NotificationType.Error,
|
|
message: 'Error removing assets from album, check console for more details',
|
|
});
|
|
} finally {
|
|
isShowConfirmation = false;
|
|
}
|
|
};
|
|
</script>
|
|
|
|
{#if menuItem}
|
|
<MenuOption text="Remove from album" icon={mdiImageRemoveOutline} on:click={() => (isShowConfirmation = true)} />
|
|
{:else}
|
|
<CircleIconButton title="Remove from album" icon={mdiDeleteOutline} on:click={() => (isShowConfirmation = true)} />
|
|
{/if}
|
|
|
|
{#if isShowConfirmation}
|
|
<ConfirmDialogue
|
|
id="remove-from-album-modal"
|
|
title="Remove from {album.albumName}"
|
|
confirmText="Remove"
|
|
onConfirm={removeFromAlbum}
|
|
onClose={() => (isShowConfirmation = false)}
|
|
>
|
|
<svelte:fragment slot="prompt">
|
|
<p>
|
|
Are you sure you want to remove
|
|
{#if getAssets().size > 1}
|
|
these <b>{getAssets().size}</b> assets
|
|
{:else}
|
|
this asset
|
|
{/if}
|
|
from the album?
|
|
</p>
|
|
</svelte:fragment>
|
|
</ConfirmDialogue>
|
|
{/if}
|