fix(web): consistent modal escape behavior (#7677)

* fix(web): consistent modal escape behavior

* make onClose optional
This commit is contained in:
Michel Heusschen 2024-03-07 04:18:53 +01:00 committed by GitHub
parent 3da2b05428
commit 5dd11ca17a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
39 changed files with 111 additions and 123 deletions

View file

@ -10,6 +10,7 @@
const dispatch = createEventDispatcher<{
success: void;
fail: void;
cancel: void;
}>();
const handleDeleteUser = async () => {
@ -27,7 +28,12 @@
};
</script>
<ConfirmDialogue title="Delete User" confirmText="Delete" on:confirm={handleDeleteUser} on:cancel>
<ConfirmDialogue
title="Delete User"
confirmText="Delete"
onConfirm={handleDeleteUser}
onClose={() => dispatch('cancel')}
>
<svelte:fragment slot="prompt">
<div class="flex flex-col gap-4">
<p>

View file

@ -148,8 +148,8 @@
{#if confirmJob}
<ConfirmDialogue
prompt="Are you sure you want to reprocess all faces? This will also clear named people."
on:confirm={onConfirm}
on:cancel={() => (confirmJob = null)}
{onConfirm}
onClose={() => (confirmJob = null)}
/>
{/if}

View file

@ -8,6 +8,7 @@
const dispatch = createEventDispatcher<{
success: void;
fail: void;
cancel: void;
}>();
const handleRestoreUser = async () => {
@ -24,8 +25,8 @@
title="Restore User"
confirmText="Continue"
confirmColor="green"
on:confirm={handleRestoreUser}
on:cancel
onConfirm={handleRestoreUser}
onClose={() => dispatch('cancel')}
>
<svelte:fragment slot="prompt">
<p><b>{user.name}</b>'s account will be restored.</p>

View file

@ -1,8 +1,11 @@
<script lang="ts">
import ConfirmDialogue from '$lib/components/shared-components/confirm-dialogue.svelte';
export let onCancel: () => void;
export let onConfirm: () => void;
</script>
<ConfirmDialogue title="Disable Login" on:cancel on:confirm>
<ConfirmDialogue title="Disable Login" onClose={onCancel} {onConfirm}>
<svelte:fragment slot="prompt">
<div class="flex flex-col gap-4">
<p>Are you sure you want to disable all login methods? Login will be completely disabled.</p>

View file

@ -56,7 +56,7 @@
</script>
{#if isConfirmOpen}
<ConfirmDisableLogin on:cancel={() => handleConfirm(false)} on:confirm={() => handleConfirm(true)} />
<ConfirmDisableLogin onCancel={() => handleConfirm(false)} onConfirm={() => handleConfirm(true)} />
{/if}
<div class="mt-2">

View file

@ -41,7 +41,7 @@
</script>
{#if isConfirmOpen}
<ConfirmDisableLogin on:cancel={() => handleConfirm(false)} on:confirm={() => handleConfirm(true)} />
<ConfirmDisableLogin onCancel={() => handleConfirm(false)} onConfirm={() => handleConfirm(true)} />
{/if}
<div>