fix(ui): destructive confirmations, verb labels and provider icons

Confirmations: ConfirmDialogData.confirmLabel is required, so no dialog can
fall back to "Yes"/"No"; the dismiss defaults to "Cancel" and
`tone: 'destructive'` styles the confirm with .app-destructive-button. Every
caller names its action ("Remove playlist", "Clear", "Refresh playlist",
"Cancel download" with a "Close" dismiss). The confirm button has the
confirm-dialog-confirm test id and drops its no-op color="primary".

The no-op `warn` color input becomes .app-destructive-button on the EPG
mapping, playlist item, error view, EPG/reset settings, delete-all and source
cleanup buttons, and on the unsaved-changes dialog's Discard.

Provider icons come from SOURCE_TYPE_ICONS in shared/interfaces (Xtream
cloud, Stalker cast, M3U playlist_play / link / description / subject) in the
add dialog, auto-import, empty state, playlist switcher, playlist rows,
dashboard source rail, command palette, Sources filters and both reset
summaries. Stalker no longer borrows the Dashboard icon, and Xtream no longer
shares a glyph with M3U URL playlists.

The playlist error view removed a playlist through the stale
PlaylistActions.removePlaylist: it dropped the playlist from state before the
delete ran, swallowed failures, skipped the source activity guard and showed
no toast. It now uses PlaylistDeleteActionService like every other removal,
commits only a completed delete, toasts and goes home. The unused action and
its effect are removed.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

apps/web/src/app/settings/settings-delete-all-playlists-dialog.component.html

@@ -49,7 +49,11 @@
     <button mat-button mat-dialog-close cdkFocusInitial>
         {{ 'CANCEL' | translate }}
     </button>
-    <button mat-flat-button [mat-dialog-close]="true" color="warn">
+    <button
+        mat-flat-button
+        class="app-destructive-button"
+        [mat-dialog-close]="true"
+    >
         {{ 'SETTINGS.REMOVE_DIALOG.CONFIRM' | translate }}
     </button>
 </mat-dialog-actions>

apps/web/src/app/settings/settings-delete-all-playlists-dialog.component.ts

@@ -9,6 +9,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatDialogModule, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { MatIconModule } from '@angular/material/icon';
 import { TranslateModule } from '@ngx-translate/core';
+import { SOURCE_TYPE_ICONS } from '@iptvnator/shared/interfaces';
 
 export interface SettingsDeleteAllPlaylistsDialogData {
     summary: {
@@ -48,19 +49,19 @@ export class SettingsDeleteAllPlaylistsDialogComponent {
         {
             id: 'm3u',
             count: this.dialogData.summary.m3u,
-            icon: 'playlist_play',
+            icon: SOURCE_TYPE_ICONS.m3u,
             labelKey: 'HOME.PLAYLIST_TYPES.M3U',
         },
         {
             id: 'xtream',
             count: this.dialogData.summary.xtream,
-            icon: 'cloud',
+            icon: SOURCE_TYPE_ICONS.xtream,
             labelKey: 'HOME.PLAYLIST_TYPES.XTREAM',
         },
         {
             id: 'stalker',
             count: this.dialogData.summary.stalker,
-            icon: 'router',
+            icon: SOURCE_TYPE_ICONS.stalker,
             labelKey: 'HOME.PLAYLIST_TYPES.STALKER',
         },
     ]);

apps/web/src/app/settings/settings-epg-section.component.html

@@ -217,7 +217,7 @@
             </button>
             <button
                 mat-button
-                color="warn"
+                class="app-destructive-button"
                 type="button"
                 [disabled]="isClearingEpgData()"
                 (click)="clearEpgData.emit()"

apps/web/src/app/settings/settings-epg.facade.ts

@@ -89,6 +89,8 @@ export class SettingsEpgFacade {
             message: this.translate.instant(
                 'SETTINGS.CLEAR_EPG_DIALOG.MESSAGE'
             ),
+            confirmLabel: this.translate.instant('SETTINGS.CLEAR_EPG_DATA'),
+            tone: 'destructive',
             onConfirm: async (): Promise<void> => {
                 if (
                     !this.epgBridge.supportsDataManagement ||

apps/web/src/app/settings/settings-reset-section.component.html

@@ -20,7 +20,7 @@
             </div>
             <button
                 mat-button
-                class="danger-zone__button"
+                class="danger-zone__button app-destructive-button"
                 [class.danger-zone__button--busy]="isRemovingAllPlaylists()"
                 [disabled]="!canRemoveAllPlaylists()"
                 [attr.aria-busy]="isRemovingAllPlaylists()"
@@ -29,7 +29,6 @@
                     $event.stopPropagation();
                     removeAll.emit()
                 "
-                color="warn"
             >
                 @if (isRemovingAllPlaylists()) {
                     <mat-progress-spinner
@@ -49,9 +48,9 @@
         </div>
         <div class="danger-zone__summary" aria-live="polite">
             <span class="danger-zone__summary-pill">
-                <mat-icon class="danger-zone__summary-icon"
-                    >folder_open</mat-icon
-                >
+                <mat-icon class="danger-zone__summary-icon">{{
+                    sourceIcons.m3u
+                }}</mat-icon>
                 <span class="danger-zone__summary-label">{{
                     'HOME.PLAYLIST_TYPES.M3U' | translate
                 }}</span>
@@ -60,7 +59,9 @@
                 }}</span>
             </span>
             <span class="danger-zone__summary-pill">
-                <mat-icon class="danger-zone__summary-icon">cloud</mat-icon>
+                <mat-icon class="danger-zone__summary-icon">{{
+                    sourceIcons.xtream
+                }}</mat-icon>
                 <span class="danger-zone__summary-label">{{
                     'HOME.PLAYLIST_TYPES.XTREAM' | translate
                 }}</span>
@@ -69,7 +70,9 @@
                 }}</span>
             </span>
             <span class="danger-zone__summary-pill">
-                <mat-icon class="danger-zone__summary-icon">cast</mat-icon>
+                <mat-icon class="danger-zone__summary-icon">{{
+                    sourceIcons.stalker
+                }}</mat-icon>
                 <span class="danger-zone__summary-label">{{
                     'HOME.PLAYLIST_TYPES.STALKER' | translate
                 }}</span>

apps/web/src/app/settings/settings-reset-section.component.ts

@@ -9,6 +9,7 @@ import { MatButtonModule } from '@angular/material/button';
 import { MatIconModule } from '@angular/material/icon';
 import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 import { TranslateModule } from '@ngx-translate/core';
+import { SOURCE_TYPE_ICONS } from '@iptvnator/shared/interfaces';
 import { SettingsPlaylistDeleteSummary } from './settings.models';
 
 @Component({
@@ -26,6 +27,7 @@ import { SettingsPlaylistDeleteSummary } from './settings.models';
     styles: [':host { display: contents; }'],
 })
 export class SettingsResetSectionComponent {
+    readonly sourceIcons = SOURCE_TYPE_ICONS;
     readonly isRemovingAllPlaylists = input(false);
     readonly canRemoveAllPlaylists = input(false);
     readonly playlistDeleteSummary =

apps/web/src/app/settings/settings-unsaved-changes-dialog.component.spec.ts

@@ -68,6 +68,16 @@ describe('SettingsUnsavedChangesDialogComponent', () => {
         expect(save.hasAttribute('cdkFocusInitial')).toBe(false);
     });
 
+    it('marks only Discard as destructive: it throws away the edits', async () => {
+        await render({ canSave: true });
+
+        expect(
+            actionButtons().map((button) =>
+                button.classList.contains('app-destructive-button')
+            )
+        ).toEqual([false, true, false]);
+    });
+
     it('disables save while the form cannot be saved', async () => {
         await render({ canSave: false });
 

apps/web/src/app/settings/settings-unsaved-changes-dialog.component.ts

@@ -82,6 +82,7 @@ export interface SettingsUnsavedChangesDialogData {
             </button>
             <button
                 mat-button
+                class="app-destructive-button"
                 [mat-dialog-close]="'discard'"
                 data-test-id="unsaved-dialog-discard"
             >

apps/web/src/m3-theme.scss

@@ -287,8 +287,8 @@ html {
     }
 
     // ─── Destructive actions ───────────────────────────────────────────────
-    // Material only emits `.mat-warn` button colors for M2 themes, so
-    // `color="warn"` is a no-op with this M3 theme. Buttons that remove or
+    // Material only emits `.mat-warn` button colors for M2 themes, so the
+    // `warn` color input is a no-op with this M3 theme. Buttons that remove or
     // discard user data opt in with this class instead; the error tokens are
     // declared per theme context above, so light and dark each get their own
     // error/on-error pair.