Add confirmation dialog to delete publications.

This commit is contained in:
Florian THIERRY
2024-09-18 09:05:18 +02:00
parent 500952d4d4
commit f5e1e10ebd
7 changed files with 132 additions and 35 deletions

View File

@@ -25,7 +25,7 @@
</div>
</div>
@if (isAuthorAndUserEquals) {
<button type="button" matTooltip="Click to delete the publication" matTooltipPosition="left">
<button type="button" (click)="deletePublication()" matTooltip="Click to delete the publication" matTooltipPosition="left">
<mat-icon>delete</mat-icon>
Delete
</button>

View File

@@ -1,14 +1,16 @@
import { Component, OnDestroy, OnInit, inject } from '@angular/core';
import { PublicationRestService } from '../../core/rest-services/publications/publication.rest-service';
import { ActivatedRoute, RouterModule } from '@angular/router';
import { ActivatedRoute, Router, RouterModule } from '@angular/router';
import { Subscription } from 'rxjs';
import { Publication } from '../../core/rest-services/publications/model/publication';
import { MatSnackBar } from '@angular/material/snack-bar';
import { CommonModule } from '@angular/common';
import { CommonModule, Location } from '@angular/common';
import { MatProgressSpinner } from '@angular/material/progress-spinner';
import { MatTooltip, MatTooltipModule } from '@angular/material/tooltip';
import { MatIcon } from '@angular/material/icon';
import { AuthenticationService } from '../../core/service/authentication.service';
import { MatDialog } from '@angular/material/dialog';
import { ConfirmationDialog } from '../../components/confirmation-dialog/confirmation-dialog.component';
declare let Prism: any;
@@ -20,11 +22,14 @@ declare let Prism: any;
styleUrl: './publication.component.scss'
})
export class PublicationComponent implements OnInit, OnDestroy {
private activatedRoute = inject(ActivatedRoute);
private authenticationService = inject(AuthenticationService);
private publicationRestService = inject(PublicationRestService);
private readonly activatedRoute = inject(ActivatedRoute);
private readonly authenticationService = inject(AuthenticationService);
private readonly dialog = inject(MatDialog);
private readonly publicationRestService = inject(PublicationRestService);
private readonly location = inject(Location);
private readonly snackBar = inject(MatSnackBar);
private paramMapSubscription?: Subscription;
private snackBar = inject(MatSnackBar);
private afterDialogCloseSubscription?: Subscription;
isLoading: boolean = false;
isAuthorAndUserEquals: boolean = false;
publication?: Publication;
@@ -57,5 +62,27 @@ export class PublicationComponent implements OnInit, OnDestroy {
ngOnDestroy(): void {
this.paramMapSubscription?.unsubscribe();
this.afterDialogCloseSubscription?.unsubscribe();
}
deletePublication(): void {
const dialogRef = this.dialog.open(
ConfirmationDialog,
{
data: {
title: 'Publication deletion',
description: 'Are you sure you want to delete this publication?'
}
}
);
this.afterDialogCloseSubscription = dialogRef.afterClosed()
.subscribe(response => {
if (response && this.publication?.id) {
this.publicationRestService.delete(this.publication.id);
this.snackBar.open('Publication deleted', 'Close', { duration: 5000 });
this.location.back();
}
});
}
}