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

   1 import { TitleCasePipe } from '@angular/common';
   2 import { Component, OnInit, TemplateRef, ViewChild } from '@angular/core';
   3 import { Router } from '@angular/router';
   4 import { forkJoin as observableForkJoin, Observable, Subscriber } from 'rxjs';
   5 import { RgwDaemonService } from '~/app/shared/api/rgw-daemon.service';
   6 import { RgwMultisiteService } from '~/app/shared/api/rgw-multisite.service';
   7 import { ListWithDetails } from '~/app/shared/classes/list-with-details.class';
   8 import { CriticalConfirmationModalComponent } from '~/app/shared/components/critical-confirmation-modal/critical-confirmation-modal.component';
   9 import { ActionLabelsI18n, URLVerbs } from '~/app/shared/constants/app.constants';
  10 import { TableComponent } from '~/app/shared/datatable/table/table.component';
  11 import { CellTemplate } from '~/app/shared/enum/cell-template.enum';
  12 import { Icons } from '~/app/shared/enum/icons.enum';
  13 import { CdTableAction } from '~/app/shared/models/cd-table-action';
  14 import { CdTableColumn } from '~/app/shared/models/cd-table-column';
  15 import { CdTableFetchDataContext } from '~/app/shared/models/cd-table-fetch-data-context';
  16 import { CdTableSelection } from '~/app/shared/models/cd-table-selection';
  17 import { FinishedTask } from '~/app/shared/models/finished-task';
  18 import { Permission } from '~/app/shared/models/permissions';
  19 import { AuthStorageService } from '~/app/shared/services/auth-storage.service';
  20 import { ModalService } from '~/app/shared/services/modal.service';
  21 import { TaskWrapperService } from '~/app/shared/services/task-wrapper.service';
  22 import { URLBuilderService } from '~/app/shared/services/url-builder.service';
  23
  24 const BASE_URL = 'rgw/multisite/sync-policy';
  25
  26 @Component({
  27   selector: 'cd-rgw-multisite-sync-policy',
  28   templateUrl: './rgw-multisite-sync-policy.component.html',
  29   styleUrls: ['./rgw-multisite-sync-policy.component.scss'],
  30   providers: [{ provide: URLBuilderService, useValue: new URLBuilderService(BASE_URL) }]
  31 })
  32 export class RgwMultisiteSyncPolicyComponent extends ListWithDetails implements OnInit {
  33   @ViewChild(TableComponent, { static: true })
  34   table: TableComponent;
  35   @ViewChild('deleteTpl', { static: true })
  36   deleteTpl: TemplateRef<any>;
  37
  38   columns: Array<CdTableColumn> = [];
  39   syncPolicyData: any = [];
  40   tableActions: CdTableAction[];
  41   selection = new CdTableSelection();
  42   permission: Permission;
  43
  44   constructor(
  45     private rgwMultisiteService: RgwMultisiteService,
  46     private titleCasePipe: TitleCasePipe,
  47     private actionLabels: ActionLabelsI18n,
  48     private authStorageService: AuthStorageService,
  49     private modalService: ModalService,
  50     private taskWrapper: TaskWrapperService,
  51     private router: Router,
  52     private rgwDaemonService: RgwDaemonService
  53   ) {
  54     super();
  55   }
  56
  57   ngOnInit(): void {
  58     this.permission = this.authStorageService.getPermissions().rgw;
  59     this.columns = [
  60       {
  61         prop: 'uniqueId',
  62         isHidden: true
  63       },
  64       {
  65         name: $localize`Group Name`,
  66         prop: 'groupName',
  67         flexGrow: 1
  68       },
  69       {
  70         name: $localize`Status`,
  71         prop: 'status',
  72         flexGrow: 1,
  73         cellTransformation: CellTemplate.tooltip,
  74         customTemplateConfig: {
  75           map: {
  76             Enabled: { class: 'badge-success', tooltip: 'sync is allowed and enabled' },
  77             Allowed: { class: 'badge-info', tooltip: 'sync is allowed' },
  78             Forbidden: {
  79               class: 'badge-warning',
  80               tooltip:
  81                 'sync (as defined by this group) is not allowed and can override other groups'
  82             }
  83           }
  84         },
  85         pipe: this.titleCasePipe
  86       },
  87       {
  88         name: $localize`Zonegroup`,
  89         prop: 'zonegroup',
  90         flexGrow: 1
  91       },
  92       {
  93         name: $localize`Bucket`,
  94         prop: 'bucket',
  95         flexGrow: 1
  96       }
  97     ];
  98     this.rgwDaemonService.list().subscribe();
  99     const getEditURL = () => {
 100       if (this.selection.first().groupName && this.selection.first().bucket) {
 101         return `${URLVerbs.EDIT}/${this.selection.first().groupName}/${
 102           this.selection.first().bucket
 103         }`;
 104       }
 105       return `${URLVerbs.EDIT}/${this.selection.first().groupName}`;
 106     };
 107     const addAction: CdTableAction = {
 108       permission: 'create',
 109       icon: Icons.add,
 110       click: () => this.router.navigate([BASE_URL, { outlets: { modal: URLVerbs.CREATE } }]),
 111       name: this.actionLabels.CREATE,
 112       canBePrimary: (selection: CdTableSelection) => !selection.hasSelection
 113     };
 114     const editAction: CdTableAction = {
 115       permission: 'update',
 116       icon: Icons.edit,
 117       click: () => this.router.navigate([BASE_URL, { outlets: { modal: getEditURL() } }]),
 118       name: this.actionLabels.EDIT
 119     };
 120     const deleteAction: CdTableAction = {
 121       permission: 'delete',
 122       icon: Icons.destroy,
 123       click: () => this.deleteAction(),
 124       disable: () => !this.selection.hasSelection,
 125       name: this.actionLabels.DELETE,
 126       canBePrimary: (selection: CdTableSelection) => selection.hasMultiSelection
 127     };
 128     this.tableActions = [addAction, editAction, deleteAction];
 129   }
 130
 131   transformSyncPolicyData(allSyncPolicyData: any) {
 132     if (allSyncPolicyData && allSyncPolicyData.length > 0) {
 133       allSyncPolicyData.forEach((policy: any) => {
 134         this.syncPolicyData.push({
 135           uniqueId: policy['id'] + (policy['bucketName'] ? policy['bucketName'] : ''),
 136           groupName: policy['id'],
 137           status: policy['status'],
 138           bucket: policy['bucketName'],
 139           zonegroup: ''
 140         });
 141       });
 142       this.syncPolicyData = [...this.syncPolicyData];
 143     }
 144   }
 145
 146   updateSelection(selection: CdTableSelection) {
 147     this.selection = selection;
 148   }
 149
 150   getPolicyList(context?: CdTableFetchDataContext) {
 151     this.rgwMultisiteService.getSyncPolicy('', '', true).subscribe(
 152       (resp: object[]) => {
 153         this.syncPolicyData = [];
 154         this.transformSyncPolicyData(resp);
 155       },
 156       () => {
 157         if (context) {
 158           context.error();
 159         }
 160       }
 161     );
 162   }
 163
 164   deleteAction() {
 165     const groupNames = this.selection.selected.map((policy: any) => policy.groupName);
 166     this.modalService.show(CriticalConfirmationModalComponent, {
 167       itemDescription: this.selection.hasSingleSelection
 168         ? $localize`Policy Group`
 169         : $localize`Policy Groups`,
 170       itemNames: groupNames,
 171       bodyTemplate: this.deleteTpl,
 172       submitActionObservable: () => {
 173         return new Observable((observer: Subscriber<any>) => {
 174           this.taskWrapper
 175             .wrapTaskAroundCall({
 176               task: new FinishedTask('rgw/multisite/sync-policy/delete', {
 177                 group_names: groupNames
 178               }),
 179               call: observableForkJoin(
 180                 this.selection.selected.map((policy: any) => {
 181                   return this.rgwMultisiteService.removeSyncPolicyGroup(
 182                     policy.groupName,
 183                     policy.bucket
 184                   );
 185                 })
 186               )
 187             })
 188             .subscribe({
 189               error: (error: any) => {
 190                 // Forward the error to the observer.
 191                 observer.error(error);
 192                 // Reload the data table content because some deletions might
 193                 // have been executed successfully in the meanwhile.
 194                 this.table.refreshBtn();
 195               },
 196               complete: () => {
 197                 // Notify the observer that we are done.
 198                 observer.complete();
 199                 // Reload the data table content.
 200                 this.table.refreshBtn();
 201               }
 202             });
 203         });
 204       }
 205     });
 206   }
 207 }