fix(ui): replace native confirm()/alert() with shared dialogs and toasts

New app-confirm-dialog (wraps existing app-dialog + app-button) replaces
every native confirm() across media library bulk-delete, static pages
editor (delete/bulk-delete), builder save-bar (publish/reset-draft),
project-editor-page (reset-section), homepage/languages/widgets sections
(remove block/language/widget), and cart (clear-cart).

Cart's native alert() calls (delivery/terms validation, email send
success/failure) now route through the existing UserNotificationService
toast pipeline instead.

No native confirm()/alert()/prompt() remain in production UI.
This commit is contained in:
sdarbinyan
2026-07-26 00:08:00 +04:00
parent a670ca994f
commit 6c6fa00ccf
23 changed files with 251 additions and 41 deletions

View File

@@ -0,0 +1,11 @@
<app-dialog [open]="open()" [titleText]="titleText()" size="sm" (closed)="cancelled.emit()">
<p class="app-confirm-dialog__message">{{ message() }}</p>
<div class="app-confirm-dialog__actions">
<app-button variant="secondary" (click)="cancelled.emit()">
{{ cancelLabel() ?? ('common.cancel' | translate) }}
</app-button>
<app-button [variant]="destructive() ? 'danger' : 'primary'" (click)="confirmed.emit()">
{{ confirmLabel() ?? ('common.confirm' | translate) }}
</app-button>
</div>
</app-dialog>

View File

@@ -0,0 +1,10 @@
.app-confirm-dialog__message {
margin: 0 0 var(--space-lg, 1.5rem);
color: var(--text-secondary);
}
.app-confirm-dialog__actions {
display: flex;
justify-content: flex-end;
gap: var(--space-sm, 0.5rem);
}

View File

@@ -0,0 +1,24 @@
import { ChangeDetectionStrategy, Component, input, output } from '@angular/core';
import { DialogComponent } from '../dialog/dialog.component';
import { ButtonComponent } from '../button/button.component';
import { TranslatePipe } from '../../../i18n/translate.pipe';
@Component({
selector: 'app-confirm-dialog',
standalone: true,
imports: [DialogComponent, ButtonComponent, TranslatePipe],
templateUrl: './confirm-dialog.component.html',
styleUrl: './confirm-dialog.component.scss',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class ConfirmDialogComponent {
readonly open = input(false);
readonly titleText = input<string | null>(null);
readonly message = input<string>('');
readonly confirmLabel = input<string | null>(null);
readonly cancelLabel = input<string | null>(null);
readonly destructive = input(false);
readonly confirmed = output<void>();
readonly cancelled = output<void>();
}