diff --git a/frontend/src/app/routes/images/images.component.html b/frontend/src/app/routes/images/images.component.html
index 3746af1..994624c 100644
--- a/frontend/src/app/routes/images/images.component.html
+++ b/frontend/src/app/routes/images/images.component.html
@@ -1,8 +1,8 @@
-
+
There are no images to display
-
+
0">
diff --git a/frontend/src/app/routes/images/images.component.ts b/frontend/src/app/routes/images/images.component.ts
index 3e52447..8c42381 100644
--- a/frontend/src/app/routes/images/images.component.ts
+++ b/frontend/src/app/routes/images/images.component.ts
@@ -4,12 +4,14 @@ import { AutoUnsubscribe } from 'ngx-auto-unsubscribe-decorator';
import { SupportedMime } from 'picsur-shared/dist/dto/mimes.dto';
import { EImage } from 'picsur-shared/dist/entities/image.entity';
import { HasFailed } from 'picsur-shared/dist/types/failable';
+import { SnackBarType } from 'src/app/models/dto/snack-bar-type.dto';
import { ImageService } from 'src/app/services/api/image.service';
import { Logger } from 'src/app/services/logger/logger.service';
import {
BootstrapService,
BSScreenSize
} from 'src/app/util/util-module/bootstrap.service';
+import { UtilService } from 'src/app/util/util-module/util.service';
@Component({
templateUrl: './images.component.html',
@@ -28,6 +30,7 @@ export class ImagesComponent implements OnInit {
private readonly route: ActivatedRoute,
private readonly router: Router,
private readonly bootstrapService: BootstrapService,
+ private readonly utilService: UtilService,
private readonly imageService: ImageService
) {}
@@ -76,8 +79,36 @@ export class ImagesComponent implements OnInit {
this.router.navigate(['/view', image.id]);
}
- deleteImage(image: EImage) {
- this.images = this.images?.filter((i) => i.id !== image.id) ?? null;
+ async deleteImage(image: EImage) {
+ const pressedButton = await this.utilService.showDialog({
+ title: `Are you sure you want to delete the image?`,
+ description: 'This action cannot be undone.',
+ buttons: [
+ {
+ color: 'primary',
+ name: 'cancel',
+ text: 'Cancel',
+ },
+ {
+ color: 'red',
+ name: 'delete',
+ text: 'Delete',
+ },
+ ],
+ });
+
+ if (pressedButton === 'delete') {
+ const result = await this.imageService.DeleteImage(image.id ?? '');
+ if (HasFailed(result)) {
+ this.utilService.showSnackBar(
+ 'Failed to delete image',
+ SnackBarType.Error
+ );
+ } else {
+ this.utilService.showSnackBar('Image deleted', SnackBarType.Success);
+ this.images = this.images?.filter((i) => i.id !== image.id) ?? null;
+ }
+ }
}
gotoPage(page: number) {
diff --git a/frontend/src/app/routes/settings/roles/settings-roles.component.ts b/frontend/src/app/routes/settings/roles/settings-roles.component.ts
index 3da6b7f..43830d8 100644
--- a/frontend/src/app/routes/settings/roles/settings-roles.component.ts
+++ b/frontend/src/app/routes/settings/roles/settings-roles.component.ts
@@ -65,16 +65,16 @@ export class SettingsRolesComponent implements OnInit, AfterViewInit {
title: `Are you sure you want to delete ${role.name}?`,
description: 'This action cannot be undone.',
buttons: [
- {
- color: 'red',
- name: 'delete',
- text: 'Delete',
- },
{
color: 'primary',
name: 'cancel',
text: 'Cancel',
},
+ {
+ color: 'red',
+ name: 'delete',
+ text: 'Delete',
+ },
],
});
diff --git a/frontend/src/app/routes/settings/users/settings-users.component.ts b/frontend/src/app/routes/settings/users/settings-users.component.ts
index 1624a36..7fa6648 100644
--- a/frontend/src/app/routes/settings/users/settings-users.component.ts
+++ b/frontend/src/app/routes/settings/users/settings-users.component.ts
@@ -63,16 +63,16 @@ export class SettingsUsersComponent implements OnInit {
title: `Are you sure you want to delete ${user.username}?`,
description: 'This action cannot be undone.',
buttons: [
- {
- color: 'red',
- name: 'delete',
- text: 'Delete',
- },
{
color: 'primary',
name: 'cancel',
text: 'Cancel',
},
+ {
+ color: 'red',
+ name: 'delete',
+ text: 'Delete',
+ },
],
});
diff --git a/frontend/src/scss/personal.scss b/frontend/src/scss/personal.scss
index 35d7930..d4e06ca 100644
--- a/frontend/src/scss/personal.scss
+++ b/frontend/src/scss/personal.scss
@@ -20,6 +20,10 @@
width: 100%;
}
+.text-center {
+ text-align: center;
+}
+
// Unstyled links
.link-unstyled {
&,