helpy4/immich
1
0
Fork 0
mirror of https://github.com/immich-app/immich synced 2025-11-07 17:27:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

chore(web): replace window.confirm by ConfirmDialogues and cleanup existing ones (#3039)

Browse source 
* chore(web): replace window.confirm by ConfirmDialogues and cleanup existing ones

* fix(web): linter and svelte-check issues

* fix(web): rephrase some confirm dialogs

* fix(web): run prettier

* fix(web): merge with last version and run prettier again

* fix(web): run prettier
This commit is contained in:
Ethan Margaillan 2023-06-30 21:53:16 +02:00 • committed by GitHub
parent 734f8e02b5
commit 5869648f19
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
14 changed files with 313 additions and 228 deletions
Download patch file Download diff file Expand all files Collapse all files

37
web/src/lib/components/photos-page/actions/delete-assets.svelte
View file

@ -13,7 +13,7 @@
export let onAssetDelete: OnAssetDelete;
const { getAssets, clearSelect } = getAssetControlContext();
let confirm = false;
let isShowConfirmation = false;
const handleDelete = async () => {
try {
@ -32,24 +32,43 @@
}
}
notificationController.show({ message: `Deleted ${count}`, type: NotificationType.Info });
notificationController.show({
message: `Deleted ${count}`,
type: NotificationType.Info
});
clearSelect();
} catch (e) {
handleError(e, 'Error deleting assets');
} finally {
isShowConfirmation = false;
}
};
</script>
<CircleIconButton title="Delete" logo={DeleteOutline} on:click={() => (confirm = true)} />
<CircleIconButton
title="Delete"
logo={DeleteOutline}
on:click={() => (isShowConfirmation = true)}
/>
{#if confirm}
{#if isShowConfirmation}
<ConfirmDialogue
prompt="Are you sure you want to delete {getAssets()
.size} assets? This step also deletes assets in the album(s) to which they belong. You can not undo this action!"
title="Delete assets?"
title="Delete Asset{getAssets().size > 1 ? 's' : ''}"
confirmText="Delete"
on:confirm={handleDelete}
on:cancel={() => (confirm = false)}
/>
on:cancel={() => (isShowConfirmation = false)}
>
<svelte:fragment slot="prompt">
<p>
Are you sure you want to delete
{#if getAssets().size > 1}
these <b>{getAssets().size}</b> assets? This will also remove them from their album(s).
{:else}
this asset? This will also remove it from its album(s).
{/if}
</p>
<p><b>You cannot undo this action!</b></p>
</svelte:fragment>
</ConfirmDialogue>
{/if}

66
web/src/lib/components/photos-page/actions/remove-from-album.svelte
View file

@ -7,32 +7,60 @@
import { AlbumResponseDto, api } from '@api';
import DeleteOutline from 'svelte-material-icons/DeleteOutline.svelte';
import { getAssetControlContext } from '../asset-select-control-bar.svelte';
import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
export let album: AlbumResponseDto;
const { getAssets, clearSelect } = getAssetControlContext();
const handleRemoveFromAlbum = async () => {
if (window.confirm('Do you want to remove selected assets from the album?')) {
try {
const { data } = await api.albumApi.removeAssetFromAlbum({
id: album.id,
removeAssetsDto: {
assetIds: Array.from(getAssets()).map((a) => a.id)
}
});
let isShowConfirmation = false;
album = data;
clearSelect();
} catch (e) {
console.error('Error [album-viewer] [removeAssetFromAlbum]', e);
notificationController.show({
type: NotificationType.Error,
message: 'Error removing assets from album, check console for more details'
});
}
const removeFromAlbum = async () => {
try {
const { data } = await api.albumApi.removeAssetFromAlbum({
id: album.id,
removeAssetsDto: {
assetIds: Array.from(getAssets()).map((a) => a.id)
}
});
album = data;
clearSelect();
} catch (e) {
console.error('Error [album-viewer] [removeAssetFromAlbum]', e);
notificationController.show({
type: NotificationType.Error,
message: 'Error removing assets from album, check console for more details'
});
} finally {
isShowConfirmation = false;
}
};
</script>
<CircleIconButton title="Remove from album" on:click={handleRemoveFromAlbum} logo={DeleteOutline} />
<CircleIconButton
title="Remove from album"
on:click={() => (isShowConfirmation = true)}
logo={DeleteOutline}
/>
{#if isShowConfirmation}
<ConfirmDialogue
title="Remove Asset{getAssets().size > 1 ? 's' : ''}"
confirmText="Remove"
on:confirm={removeFromAlbum}
on:cancel={() => (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}