1
0
mirror of https://github.com/immich-app/immich.git synced 2025-06-24 04:46:50 +02:00

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

* 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
14 changed files with 313 additions and 228 deletions

View File

@ -21,6 +21,7 @@
import DetailPanel from './detail-panel.svelte';
import PhotoViewer from './photo-viewer.svelte';
import VideoViewer from './video-viewer.svelte';
import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
import { assetStore } from '$lib/stores/assets.store';
import { isShowDetail } from '$lib/stores/preferences.store';
@ -37,6 +38,7 @@
let halfRightHover = false;
let appearsInAlbums: AlbumResponseDto[] = [];
let isShowAlbumPicker = false;
let isShowDeleteConfirmation = false;
let addToSharedAlbum = true;
let shouldPlayMotionPhoto = false;
let shouldShowDownloadButton = sharedLink ? sharedLink.allowDownload : true;
@ -77,7 +79,7 @@
closeViewer();
return;
case 'Delete':
deleteAsset();
isShowDeleteConfirmation = true;
return;
case 'i':
$isShowDetail = !$isShowDetail;
@ -116,23 +118,17 @@
const deleteAsset = async () => {
try {
if (
window.confirm(
`Caution! Are you sure you want to delete this asset? This step also deletes this asset in the album(s) to which it belongs. You can not undo this action!`
)
) {
const { data: deletedAssets } = await api.assetApi.deleteAsset({
deleteAssetDto: {
ids: [asset.id]
}
});
const { data: deletedAssets } = await api.assetApi.deleteAsset({
deleteAssetDto: {
ids: [asset.id]
}
});
navigateAssetForward();
navigateAssetForward();
for (const asset of deletedAssets) {
if (asset.status == 'SUCCESS') {
assetStore.removeAsset(asset.id);
}
for (const asset of deletedAssets) {
if (asset.status == 'SUCCESS') {
assetStore.removeAsset(asset.id);
}
}
} catch (e) {
@ -140,7 +136,9 @@
type: NotificationType.Error,
message: 'Error deleting this asset, check console for more details'
});
console.error('Error deleteSelectedAssetHandler', e);
console.error('Error deleteAsset', e);
} finally {
isShowDeleteConfirmation = false;
}
};
@ -227,6 +225,17 @@
});
}
};
const getAssetType = () => {
switch (asset.type) {
case 'IMAGE':
return 'Photo';
case 'VIDEO':
return 'Video';
default:
return 'Asset';
}
};
</script>
<section
@ -244,7 +253,7 @@
on:goBack={closeViewer}
on:showDetail={showDetailInfoHandler}
on:download={() => downloadFile(asset, publicSharedKey)}
on:delete={deleteAsset}
on:delete={() => (isShowDeleteConfirmation = true)}
on:favorite={toggleFavorite}
on:addToAlbum={() => openAlbumPicker(false)}
on:addToSharedAlbum={() => openAlbumPicker(true)}
@ -358,6 +367,23 @@
on:close={() => (isShowAlbumPicker = false)}
/>
{/if}
{#if isShowDeleteConfirmation}
<ConfirmDialogue
title="Delete {getAssetType()}"
confirmText="Delete"
on:confirm={deleteAsset}
on:cancel={() => (isShowDeleteConfirmation = false)}
>
<svelte:fragment slot="prompt">
<p>
Are you sure you want to delete this {getAssetType().toLowerCase()}? This will also remove
it from its album(s).
</p>
<p><b>You cannot undo this action!</b></p>
</svelte:fragment>
</ConfirmDialogue>
{/if}
</section>
<style>