git.apps.os.sepia.ceph.com Git - ceph.git/blob

   1 import {
   2   Component,
   3   EventEmitter,
   4   Input,
   5   OnInit,
   6   Output,
   7   TemplateRef,
   8   ViewChild
   9 } from '@angular/core';
  10 import { BehaviorSubject, Observable, of } from 'rxjs';
  11 import { RgwBucketService } from '~/app/shared/api/rgw-bucket.service';
  12 import { ActionLabelsI18n } from '~/app/shared/constants/app.constants';
  13 import { TableComponent } from '~/app/shared/datatable/table/table.component';
  14 import { CdTableAction } from '~/app/shared/models/cd-table-action';
  15 import { CdTableColumn } from '~/app/shared/models/cd-table-column';
  16 import { CdTableSelection } from '~/app/shared/models/cd-table-selection';
  17 import { Permission } from '~/app/shared/models/permissions';
  18 import { AuthStorageService } from '~/app/shared/services/auth-storage.service';
  19 import { URLBuilderService } from '~/app/shared/services/url-builder.service';
  20 import { Bucket } from '../models/rgw-bucket';
  21 import { CdTableFetchDataContext } from '~/app/shared/models/cd-table-fetch-data-context';
  22 import { CellTemplate } from '~/app/shared/enum/cell-template.enum';
  23 import { catchError, switchMap } from 'rxjs/operators';
  24 import { ModalCdsService } from '~/app/shared/services/modal-cds.service';
  25 import { NotificationService } from '~/app/shared/services/notification.service';
  26 import { ListWithDetails } from '~/app/shared/classes/list-with-details.class';
  27 import { TopicConfiguration } from '~/app/shared/models/notification-configuration.model';
  28 import { RgwNotificationFormComponent } from '../rgw-notification-form/rgw-notification-form.component';
  29 import { DeleteConfirmationModalComponent } from '~/app/shared/components/delete-confirmation-modal/delete-confirmation-modal.component';
  30 import { NotificationType } from '~/app/shared/enum/notification-type.enum';
  31 import { Icons } from '~/app/shared/enum/icons.enum';
  32
  33 const BASE_URL = 'rgw/bucket';
  34 @Component({
  35   selector: 'cd-rgw-bucket-notification-list',
  36   templateUrl: './rgw-bucket-notification-list.component.html',
  37   styleUrl: './rgw-bucket-notification-list.component.scss',
  38   providers: [{ provide: URLBuilderService, useValue: new URLBuilderService(BASE_URL) }]
  39 })
  40 export class RgwBucketNotificationListComponent extends ListWithDetails implements OnInit {
  41   @Input() bucket: Bucket;
  42   @Output() updateBucketDetails = new EventEmitter();
  43   @ViewChild(TableComponent, { static: true })
  44   table: TableComponent;
  45   permission: Permission;
  46   tableActions: CdTableAction[];
  47   columns: CdTableColumn[] = [];
  48   selection: CdTableSelection = new CdTableSelection();
  49   notification$: Observable<TopicConfiguration[]>;
  50   subject = new BehaviorSubject<TopicConfiguration[]>([]);
  51   context: CdTableFetchDataContext;
  52   @ViewChild('filterTpl', { static: true })
  53   filterTpl: TemplateRef<any>;
  54   @ViewChild('eventTpl', { static: true })
  55   eventTpl: TemplateRef<any>;
  56   modalRef: any;
  57   constructor(
  58     private rgwBucketService: RgwBucketService,
  59     private authStorageService: AuthStorageService,
  60     public actionLabels: ActionLabelsI18n,
  61     private modalService: ModalCdsService,
  62     private notificationService: NotificationService
  63   ) {
  64     super();
  65   }
  66
  67   ngOnInit() {
  68     this.permission = this.authStorageService.getPermissions().rgw;
  69     this.columns = [
  70       {
  71         name: $localize`Name`,
  72         prop: 'Id',
  73         flexGrow: 2
  74       },
  75       {
  76         name: $localize`Topic`,
  77         prop: 'Topic',
  78         flexGrow: 1,
  79         cellTransformation: CellTemplate.copy
  80       },
  81       {
  82         name: $localize`Event`,
  83         prop: 'Event',
  84         flexGrow: 1,
  85         cellTemplate: this.eventTpl
  86       },
  87       {
  88         name: $localize`Filter`,
  89         prop: 'Filter',
  90         flexGrow: 1,
  91         cellTemplate: this.filterTpl
  92       }
  93     ];
  94
  95     const createAction: CdTableAction = {
  96       permission: 'create',
  97       icon: Icons.add,
  98       click: () => this.openNotificationModal(this.actionLabels.CREATE),
  99       name: this.actionLabels.CREATE
 100     };
 101     const editAction: CdTableAction = {
 102       permission: 'update',
 103       icon: Icons.edit,
 104       disable: () => this.selection.hasMultiSelection,
 105       click: () => this.openNotificationModal(this.actionLabels.EDIT),
 106       name: this.actionLabels.EDIT
 107     };
 108     const deleteAction: CdTableAction = {
 109       permission: 'delete',
 110       icon: Icons.destroy,
 111       click: () => this.deleteAction(),
 112       disable: () => !this.selection.hasSelection,
 113       name: this.actionLabels.DELETE,
 114       canBePrimary: (selection: CdTableSelection) => selection.hasMultiSelection
 115     };
 116     this.tableActions = [createAction, editAction, deleteAction];
 117     this.notification$ = this.subject.pipe(
 118       switchMap(() =>
 119         this.rgwBucketService.listNotification(this.bucket.bucket).pipe(
 120           catchError((error) => {
 121             this.context.error(error);
 122             return of(null);
 123           })
 124         )
 125       )
 126     );
 127   }
 128
 129   fetchData() {
 130     this.subject.next([]);
 131   }
 132
 133   openNotificationModal(type: string) {
 134     const modalRef = this.modalService.show(RgwNotificationFormComponent, {
 135       bucket: this.bucket,
 136       selectedNotification: this.selection.first(),
 137       editing: type === this.actionLabels.EDIT ? true : false
 138     });
 139     modalRef?.close?.subscribe(() => this.updateBucketDetails.emit());
 140   }
 141
 142   updateSelection(selection: CdTableSelection) {
 143     this.selection = selection;
 144   }
 145
 146   deleteAction() {
 147     const selectedNotificationId = this.selection.selected.map((notification) => notification.Id);
 148     this.modalRef = this.modalService.show(DeleteConfirmationModalComponent, {
 149       itemDescription: $localize`Notification`,
 150       itemNames: selectedNotificationId,
 151       actionDescription: $localize`delete`,
 152       submitAction: () => this.submitDeleteNotifications(selectedNotificationId)
 153     });
 154   }
 155
 156   submitDeleteNotifications(notificationId: string[]) {
 157     this.rgwBucketService
 158       .deleteNotification(this.bucket.bucket, notificationId.join(','))
 159       .subscribe({
 160         next: () => {
 161           this.notificationService.show(
 162             NotificationType.success,
 163             $localize`Notifications deleted successfully.`
 164           );
 165           this.modalService.dismissAll();
 166         },
 167         error: () => {
 168           this.notificationService.show(
 169             NotificationType.success,
 170             $localize`Failed to delete notifications. Please try again.`
 171           );
 172         }
 173       });
 174     this.modalRef?.close?.subscribe(() => this.updateBucketDetails.emit());
 175   }
 176 }