You've already forked immich
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:
@ -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>
|
||||
|
Reference in New Issue
Block a user