ceph/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-list/rgw-bucket-list.component.ts

   1 import { Component, NgZone, ViewChild } from '@angular/core';
   2
   3 import { I18n } from '@ngx-translate/i18n-polyfill';
   4 import { BsModalService } from 'ngx-bootstrap/modal';
   5 import { forkJoin as observableForkJoin, Observable, Subscriber } from 'rxjs';
   6
   7 import { RgwBucketService } from '../../../shared/api/rgw-bucket.service';
   8 import { CriticalConfirmationModalComponent } from '../../../shared/components/critical-confirmation-modal/critical-confirmation-modal.component';
   9 import { ActionLabelsI18n } from '../../../shared/constants/app.constants';
  10 import { TableComponent } from '../../../shared/datatable/table/table.component';
  11 import { Icons } from '../../../shared/enum/icons.enum';
  12 import { CdTableAction } from '../../../shared/models/cd-table-action';
  13 import { CdTableColumn } from '../../../shared/models/cd-table-column';
  14 import { CdTableFetchDataContext } from '../../../shared/models/cd-table-fetch-data-context';
  15 import { CdTableSelection } from '../../../shared/models/cd-table-selection';
  16 import { Permission } from '../../../shared/models/permissions';
  17 import { AuthStorageService } from '../../../shared/services/auth-storage.service';
  18 import { URLBuilderService } from '../../../shared/services/url-builder.service';
  19
  20 const BASE_URL = 'rgw/bucket';
  21
  22 @Component({
  23   selector: 'cd-rgw-bucket-list',
  24   templateUrl: './rgw-bucket-list.component.html',
  25   styleUrls: ['./rgw-bucket-list.component.scss'],
  26   providers: [{ provide: URLBuilderService, useValue: new URLBuilderService(BASE_URL) }]
  27 })
  28 export class RgwBucketListComponent {
  29   @ViewChild(TableComponent, { static: true })
  30   table: TableComponent;
  31
  32   permission: Permission;
  33   tableActions: CdTableAction[];
  34   columns: CdTableColumn[] = [];
  35   buckets: object[] = [];
  36   selection: CdTableSelection = new CdTableSelection();
  37   isStale = false;
  38   staleTimeout: number;
  39
  40   constructor(
  41     private authStorageService: AuthStorageService,
  42     private rgwBucketService: RgwBucketService,
  43     private bsModalService: BsModalService,
  44     private i18n: I18n,
  45     private urlBuilder: URLBuilderService,
  46     public actionLabels: ActionLabelsI18n,
  47     private ngZone: NgZone
  48   ) {
  49     this.permission = this.authStorageService.getPermissions().rgw;
  50     this.columns = [
  51       {
  52         name: this.i18n('Name'),
  53         prop: 'bid',
  54         flexGrow: 1
  55       },
  56       {
  57         name: this.i18n('Owner'),
  58         prop: 'owner',
  59         flexGrow: 1
  60       }
  61     ];
  62     const getBucketUri = () =>
  63       this.selection.first() && `${encodeURIComponent(this.selection.first().bid)}`;
  64     const addAction: CdTableAction = {
  65       permission: 'create',
  66       icon: Icons.add,
  67       routerLink: () => this.urlBuilder.getCreate(),
  68       name: this.actionLabels.CREATE,
  69       canBePrimary: (selection: CdTableSelection) => !selection.hasSelection
  70     };
  71     const editAction: CdTableAction = {
  72       permission: 'update',
  73       icon: Icons.edit,
  74       routerLink: () => this.urlBuilder.getEdit(getBucketUri()),
  75       name: this.actionLabels.EDIT
  76     };
  77     const deleteAction: CdTableAction = {
  78       permission: 'delete',
  79       icon: Icons.destroy,
  80       click: () => this.deleteAction(),
  81       disable: () => !this.selection.hasSelection,
  82       name: this.actionLabels.DELETE,
  83       canBePrimary: (selection: CdTableSelection) => selection.hasMultiSelection
  84     };
  85     this.tableActions = [addAction, editAction, deleteAction];
  86     this.timeConditionReached();
  87   }
  88
  89   timeConditionReached() {
  90     clearTimeout(this.staleTimeout);
  91     this.ngZone.runOutsideAngular(() => {
  92       this.staleTimeout = window.setTimeout(() => {
  93         this.ngZone.run(() => {
  94           this.isStale = true;
  95         });
  96       }, 10000);
  97     });
  98   }
  99
 100   getBucketList(context: CdTableFetchDataContext) {
 101     this.isStale = false;
 102     this.timeConditionReached();
 103     this.rgwBucketService.list().subscribe(
 104       (resp: object[]) => {
 105         this.buckets = resp;
 106       },
 107       () => {
 108         context.error();
 109       }
 110     );
 111   }
 112
 113   updateSelection(selection: CdTableSelection) {
 114     this.selection = selection;
 115   }
 116
 117   deleteAction() {
 118     this.bsModalService.show(CriticalConfirmationModalComponent, {
 119       initialState: {
 120         itemDescription: this.selection.hasSingleSelection
 121           ? this.i18n('bucket')
 122           : this.i18n('buckets'),
 123         itemNames: this.selection.selected.map((bucket: any) => bucket['bid']),
 124         submitActionObservable: () => {
 125           return new Observable((observer: Subscriber<any>) => {
 126             // Delete all selected data table rows.
 127             observableForkJoin(
 128               this.selection.selected.map((bucket: any) => {
 129                 return this.rgwBucketService.delete(bucket.bid);
 130               })
 131             ).subscribe(
 132               null,
 133               (error) => {
 134                 // Forward the error to the observer.
 135                 observer.error(error);
 136                 // Reload the data table content because some deletions might
 137                 // have been executed successfully in the meanwhile.
 138                 this.table.refreshBtn();
 139               },
 140               () => {
 141                 // Notify the observer that we are done.
 142                 observer.complete();
 143                 // Reload the data table content.
 144                 this.table.refreshBtn();
 145               }
 146             );
 147           });
 148         }
 149       }
 150     });
 151   }
 152 }