diff --git a/frontend/src/app/components/copyfield/copyfield.component.ts b/frontend/src/app/components/copyfield/copyfield.component.ts index 0d6186f..3e8ee20 100644 --- a/frontend/src/app/components/copyfield/copyfield.component.ts +++ b/frontend/src/app/components/copyfield/copyfield.component.ts @@ -1,3 +1,4 @@ +import { Clipboard } from '@angular/cdk/clipboard'; import { Component, Input } from '@angular/core'; import { SnackBarType } from 'src/app/models/snack-bar-type'; import { UtilService } from 'src/app/util/util.service'; @@ -12,18 +13,17 @@ export class CopyFieldComponent { @Input() label: string = 'Loading...'; @Input() value: string = 'Loading...'; - constructor(private utilService: UtilService) {} + constructor(private utilService: UtilService, private clipboard: Clipboard) {} public copy() { - try { - navigator.clipboard.writeText(this.value); - } catch (e) { - return this.utilService.showSnackBar( - 'Copying to clipboard failed', - SnackBarType.Error - ); + if (this.clipboard.copy(this.value)) { + this.utilService.showSnackBar(`Copied ${this.label}!`, SnackBarType.Info); + return; } - this.utilService.showSnackBar(`Copied ${this.label}!`, SnackBarType.Info); + return this.utilService.showSnackBar( + 'Copying to clipboard failed', + SnackBarType.Error + ); } } diff --git a/frontend/src/app/components/copyfield/copyfield.module.ts b/frontend/src/app/components/copyfield/copyfield.module.ts index a672f1b..fc41dcd 100644 --- a/frontend/src/app/components/copyfield/copyfield.module.ts +++ b/frontend/src/app/components/copyfield/copyfield.module.ts @@ -1,3 +1,4 @@ +import { ClipboardModule } from '@angular/cdk/clipboard'; import { CommonModule } from '@angular/common'; import { NgModule } from '@angular/core'; import { MatButtonModule } from '@angular/material/button'; @@ -11,6 +12,7 @@ import { CopyFieldComponent } from './copyfield.component'; MatInputModule, MatIconModule, MatButtonModule, + ClipboardModule, ], exports: [CopyFieldComponent], }) diff --git a/frontend/src/app/routes/settings/settings-users/settings-users.component.ts b/frontend/src/app/routes/settings/settings-users/settings-users.component.ts index 79830d5..f89ec4c 100644 --- a/frontend/src/app/routes/settings/settings-users/settings-users.component.ts +++ b/frontend/src/app/routes/settings/settings-users/settings-users.component.ts @@ -4,7 +4,9 @@ import { AutoUnsubscribe } from 'ngx-auto-unsubscribe-decorator'; import { EUser } from 'picsur-shared/dist/entities/user.entity'; import { HasFailed } from 'picsur-shared/dist/types'; import { BehaviorSubject, Subject, throttleTime } from 'rxjs'; +import { SnackBarType } from 'src/app/models/snack-bar-type'; import { UserManageService } from 'src/app/services/api/usermanage.service'; +import { UtilService } from 'src/app/util/util.service'; @Component({ templateUrl: './settings-users.component.html', @@ -20,7 +22,10 @@ export class SettingsUsersComponent implements OnInit { @ViewChild(MatPaginator) paginator: MatPaginator; - constructor(private userManageService: UserManageService) {} + constructor( + private userManageService: UserManageService, + private utilService: UtilService + ) {} async ngOnInit() { this.subscribeToUpdate(); @@ -51,7 +56,13 @@ export class SettingsUsersComponent implements OnInit { pageIndex: number ): Promise { const result = await this.userManageService.getUsers(pageSize, pageIndex); - if (HasFailed(result)) return false; + if (HasFailed(result)) { + this.utilService.showSnackBar( + 'Failed to fetch users', + SnackBarType.Error + ); + return false; + } if (result.length > 0) { this.dataSubject.next(result); diff --git a/frontend/src/scss/snackbar.scss b/frontend/src/scss/snackbar.scss index 61855e5..78e1440 100644 --- a/frontend/src/scss/snackbar.scss +++ b/frontend/src/scss/snackbar.scss @@ -3,19 +3,19 @@ color: white; &.snack-success { - background: #4d9a51; + background: #274E29; } &.snack-error { - background: #d74545; + background: #761919; } &.snack-warning { - background: #f68a1c; + background: #934D06; } &.snack-info { - background: #1d95d6; + background: #125E87; } &.snack-default {