feat(ui): custom dialog replaces all remaining window.alert() calls
All checks were successful
Build & Publish Docker Image / build-and-push (push) Successful in 53s
All checks were successful
Build & Publish Docker Image / build-and-push (push) Successful in 53s
alertAction({title, message}) returns Promise<void> and renders the
same ConfirmDialog with infoOnly:true — single OK button, no Abbrechen.
Replaces:
- 'Bitte Profil wählen.' (recipe rating / favorite / cooked / comment)
- 'Bitte Profil wählen, um zu liken.' (wishlist)
- 'Profil konnte nicht angelegt werden' (ProfileSwitcher)
- 'Umbenennen fehlgeschlagen' (admin/profiles)
- 'Speichern fehlgeschlagen' (preview)
No window.alert() or window.confirm() left in the codebase.
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -4,6 +4,8 @@ export type ConfirmOptions = {
|
||||
confirmLabel?: string;
|
||||
cancelLabel?: string;
|
||||
destructive?: boolean;
|
||||
/** If true, hide the cancel button — used for simple info/alert dialogs. */
|
||||
infoOnly?: boolean;
|
||||
};
|
||||
|
||||
type PendingRequest = ConfirmOptions & {
|
||||
@@ -39,3 +41,14 @@ export function confirmAction(options: ConfirmOptions): Promise<boolean> {
|
||||
if (typeof window === 'undefined') return Promise.resolve(false);
|
||||
return confirmStore.ask(options);
|
||||
}
|
||||
|
||||
/**
|
||||
* Show a modal info dialog with a single OK button. Resolves when dismissed.
|
||||
* Use instead of window.alert().
|
||||
*/
|
||||
export function alertAction(options: Omit<ConfirmOptions, 'destructive' | 'cancelLabel' | 'infoOnly'>): Promise<void> {
|
||||
if (typeof window === 'undefined') return Promise.resolve();
|
||||
return confirmStore
|
||||
.ask({ ...options, infoOnly: true, confirmLabel: options.confirmLabel ?? 'OK' })
|
||||
.then(() => undefined);
|
||||
}
|
||||
|
||||
@@ -41,13 +41,15 @@
|
||||
<p class="message">{p.message}</p>
|
||||
{/if}
|
||||
<div class="actions">
|
||||
<button
|
||||
type="button"
|
||||
class="btn cancel"
|
||||
onclick={() => confirmStore.answer(false)}
|
||||
>
|
||||
{p.cancelLabel ?? 'Abbrechen'}
|
||||
</button>
|
||||
{#if !p.infoOnly}
|
||||
<button
|
||||
type="button"
|
||||
class="btn cancel"
|
||||
onclick={() => confirmStore.answer(false)}
|
||||
>
|
||||
{p.cancelLabel ?? 'Abbrechen'}
|
||||
</button>
|
||||
{/if}
|
||||
<button
|
||||
type="button"
|
||||
class="btn confirm"
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
<script lang="ts">
|
||||
import { profileStore } from '$lib/client/profile.svelte';
|
||||
import { alertAction } from '$lib/client/confirm.svelte';
|
||||
|
||||
let showModal = $state(false);
|
||||
let newName = $state('');
|
||||
@@ -13,7 +14,10 @@
|
||||
newName = '';
|
||||
showModal = false;
|
||||
} catch (e) {
|
||||
alert((e as Error).message);
|
||||
await alertAction({
|
||||
title: 'Profil konnte nicht angelegt werden',
|
||||
message: (e as Error).message
|
||||
});
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user