Feature: add alert after succesful deletion

swisstopo · Oct 25, 2024 · 4014657 · 4014657
1 parent 5a222b1
commit 4014657
Show file tree

Hide file tree

Showing 8 changed files with 38 additions and 8 deletions.
diff --git a/apps/client-asset-sg/src/app/i18n/de.ts b/apps/client-asset-sg/src/app/i18n/de.ts
@@ -7,7 +7,8 @@ export const deAppTranslations = {
   submit: 'Absenden',
   cancel: 'Abbrechen',
   confirm: 'Bestätigen',
-  confirm_delete: 'Sind Sie sicher, dass sie dieses Asset löschen wollen?',
+  confirmDelete: 'Sind Sie sicher, dass sie dieses Asset löschen wollen?',
+  deleteSuccess: 'Das Asset wurde erfolgreich gelöscht.',
   login: 'Anmelden',
   logout: 'Abmelden',
   yes: 'Ja',

diff --git a/apps/client-asset-sg/src/app/i18n/en.ts b/apps/client-asset-sg/src/app/i18n/en.ts
@@ -9,7 +9,8 @@ export const enAppTranslations: AppTranslations = {
   submit: 'Submit',
   cancel: 'Cancel',
   confirm: 'Confirm',
-  confirm_delete: 'Are you sure you want to delete this asset?',
+  confirmDelete: 'Are you sure you want to delete this asset?',
+  deleteSuccess: 'The asset was successfully deleted.',
   login: 'Login',
   logout: 'Logout',
   yes: 'Yes',

diff --git a/apps/client-asset-sg/src/app/i18n/fr.ts b/apps/client-asset-sg/src/app/i18n/fr.ts
@@ -9,7 +9,8 @@ export const frAppTranslations: AppTranslations = {
   submit: 'Envoyer',
   cancel: 'Annuler',
   confirm: 'Confirmer',
-  confirm_delete: 'Êtes-vous sûr de vouloir supprimer cet asset',
+  confirmDelete: 'Êtes-vous sûr de vouloir supprimer cet asset',
+  deleteSuccess: "L'asset a été supprimé avec succès.",
   login: 'Login',
   logout: 'Déconnecter',
   yes: 'Oui',

diff --git a/apps/client-asset-sg/src/app/i18n/it.ts b/apps/client-asset-sg/src/app/i18n/it.ts
@@ -9,7 +9,8 @@ export const itAppTranslations: AppTranslations = {
   submit: 'IT Absenden',
   cancel: 'IT Abbrechen',
   confirm: 'IT Bestätigen',
-  confirm_delete: 'IT Sind Sie sicher, dass Sie dieses Asset löschen möchten?',
+  confirmDelete: 'IT Sind Sie sicher, dass Sie dieses Asset löschen möchten?',
+  deleteSuccess: 'IT Das Asset wurde erfolgreich gelöscht.',
   login: 'Login',
   logout: 'IT Abmelden',
   yes: 'Sì',

diff --git a/apps/client-asset-sg/src/app/i18n/rm.ts b/apps/client-asset-sg/src/app/i18n/rm.ts
@@ -9,7 +9,8 @@ export const rmAppTranslations: AppTranslations = {
   submit: 'RM Absenden',
   cancel: 'RM Abbrechen',
   confirm: 'RM Bestätigen',
-  confirm_delete: 'RM Sind Sie sicher, dass Sie dieses Asset löschen möchten?',
+  confirmDelete: 'RM Sind Sie sicher, dass Sie dieses Asset löschen möchten?',
+  deleteSuccess: 'RM Das Asset wurde erfolgreich gelöscht.',
   login: 'Login',
   logout: 'RM Abmelden',
   yes: 'Sì',

diff --git a/...b/components/asset-editor-tab-administration/asset-editor-tab-administration.component.ts b/...b/components/asset-editor-tab-administration/asset-editor-tab-administration.component.ts
@@ -95,7 +95,7 @@ export class AssetEditorTabAdministrationComponent implements OnInit {
   public openConfirmDialog() {
     const dialogRef = this.dialogService.open<ConfirmDialogComponent>(ConfirmDialogComponent, {
       data: {
-        text: 'confirm_delete',
+        text: 'confirmDelete',
       },
     });
     dialogRef.componentInstance.confirmEvent.pipe(untilDestroyed(this)).subscribe(() => {

diff --git a/libs/asset-editor/src/lib/state/asset-editor.actions.ts b/libs/asset-editor/src/lib/state/asset-editor.actions.ts
@@ -26,6 +26,7 @@ export const updateAssetEditDetailResult = createAction(
 
 export const deleteAsset = createAction('[Asset Editor] Delete asset', props<{ assetId: number }>());
 
+export const handleSuccessfulDeletion = createAction('[Asset Editor] Handle successful deletion');
 export const editContact = createAction('[Asset Editor] Edit contact', props<{ contact: ContactEdit }>());
 
 export const createContact = createAction('[Asset Editor] Create contact', props<{ contact: PatchContact }>());
diff --git a/libs/asset-editor/src/lib/state/asset-editor.effects.ts b/libs/asset-editor/src/lib/state/asset-editor.effects.ts
@@ -1,10 +1,11 @@
 import { inject, Injectable } from '@angular/core';
 import { Router } from '@angular/router';
-import { appSharedStateActions, filterNavigateToComponent } from '@asset-sg/client-shared';
+import { Alert, AlertType, appSharedStateActions, filterNavigateToComponent, showAlert } from '@asset-sg/client-shared';
 import { DT, ORD, partitionEither } from '@asset-sg/core';
 import * as RD from '@devexperts/remote-data-ts';
 import { UntilDestroy } from '@ngneat/until-destroy';
 import { Actions, createEffect, ofType } from '@ngrx/effects';
+import { TranslateService } from '@ngx-translate/core';
 import { pipe } from 'fp-ts/function';
 import * as O from 'fp-ts/Option';
 import * as D from 'io-ts/Decoder';
@@ -21,6 +22,7 @@ export class AssetEditorEffects {
   private _actions$ = inject(Actions);
   private _assetEditorService = inject(AssetEditorService);
   private _router = inject(Router);
+  private readonly translateService = inject(TranslateService);
 
   validatedQueryParams = partitionEither(
     filterNavigateToComponent(this._actions$, AssetEditorPageComponent).pipe(
@@ -96,11 +98,33 @@ export class AssetEditorEffects {
       ofType(actions.deleteAsset),
       switchMap(({ assetId }) => this._assetEditorService.deleteAsset(assetId)),
       map(() => {
-        return appSharedStateActions.updateSearchAfterAssetEditedOrAdded({ assetId: undefined });
+        return actions.handleSuccessfulDeletion();
       })
     )
   );
 
+  displayAlertAfterSuccessfulDeletion$ = createEffect(() =>
+    this._actions$.pipe(
+      ofType(actions.handleSuccessfulDeletion),
+      map(() => {
+        const alert: Alert = {
+          type: AlertType.Success,
+          text: this.translateService.instant('deleteSuccess'),
+          id: 'asset-deleted',
+          isPersistent: false,
+        };
+        return showAlert({ alert });
+      })
+    )
+  );
+
+  updateSearchAfterDeletingAsset$ = createEffect(() =>
+    this._actions$.pipe(
+      ofType(actions.handleSuccessfulDeletion),
+      map(() => appSharedStateActions.updateSearchAfterAssetEditedOrAdded({ assetId: undefined }))
+    )
+  );
+
   createContact$ = createEffect(() =>
     this._actions$.pipe(
       ofType(actions.createContact),