mgr/dashboard: Allow the user to re-use existing r

ealm/zg/zone and setup replication

1. Currently, we just allow the user to create a new realm/zg/zone and setup replication using the multi-site replication wizard. The ask is to allow the user to select the pre-existing realm/zg/zone and setup replication via automatic export and import of token as well.

2. Enable rgw module automatically in the selected cluster if its not
   enabled

Fixes: https://tracker.ceph.com/issues/70276

Signed-off-by: Aashish Sharma <[email protected]>

Author: aaSharma14

src/pybind/mgr/dashboard/controllers/rgw.py

@@ -122,14 +122,15 @@ def migrate(self, daemon_name=None, realm_name=None, zonegroup_name=None, zone_n
     def setup_multisite_replication(self, daemon_name=None, realm_name=None, zonegroup_name=None,
                                     zonegroup_endpoints=None, zone_name=None, zone_endpoints=None,
                                     username=None, cluster_fsid=None, replication_zone_name=None,
-                                    cluster_details=None):
+                                    cluster_details=None, selectedRealmName=None):
         multisite_instance = RgwMultisiteAutomation()
         result = multisite_instance.setup_multisite_replication(realm_name, zonegroup_name,
                                                                 zonegroup_endpoints, zone_name,
                                                                 zone_endpoints, username,
                                                                 cluster_fsid,
                                                                 replication_zone_name,
-                                                                cluster_details)
+                                                                cluster_details,
+                                                                selectedRealmName)
         return result
 
     @RESTController.Collection(method='PUT', path='/setup-rgw-credentials')

src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-multisite-wizard/multisite-wizard-steps.enum.ts

@@ -17,3 +17,9 @@ export const STEP_TITLES_SINGLE_CLUSTER = [
   StepTitles.CreateZone,
   StepTitles.Review
 ];
+
+export const STEP_TITLES_EXISTING_REALM = [
+  StepTitles.CreateRealmAndZonegroup,
+  StepTitles.SelectCluster,
+  StepTitles.Review
+];

src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-multisite-wizard/rgw-multisite-wizard.component.html

@@ -1,8 +1,8 @@
-import { Component, OnInit } from '@angular/core';
+import { ChangeDetectorRef, Component, OnInit } from '@angular/core';
 import { Location } from '@angular/common';
 import { UntypedFormControl, Validators } from '@angular/forms';
 import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
-import { Subscription, forkJoin } from 'rxjs';
+import { Observable, Subscription, forkJoin } from 'rxjs';
 import { ActionLabelsI18n } from '~/app/shared/constants/app.constants';
 import { CdFormGroup } from '~/app/shared/forms/cd-form-group';
 import { WizardStepModel } from '~/app/shared/models/wizard-steps';
@@ -23,9 +23,34 @@ import { BaseModal, Step } from 'carbon-components-angular';
 import { SummaryService } from '~/app/shared/services/summary.service';
 import { ExecutingTask } from '~/app/shared/models/executing-task';
 import {
+  STEP_TITLES_EXISTING_REALM,
   STEP_TITLES_MULTI_CLUSTER_CONFIGURED,
   STEP_TITLES_SINGLE_CLUSTER
 } from './multisite-wizard-steps.enum';
+import { RgwRealmService } from '~/app/shared/api/rgw-realm.service';
+import { MultiCluster, MultiClusterConfig } from '~/app/shared/models/multi-cluster';
+
+interface DaemonStats {
+  rgw_metadata?: {
+    [key: string]: string;
+  };
+}
+
+interface EndpointInfo {
+  hostname: string;
+  port: number;
+  frontendConfig: string;
+}
+
+enum Protocol {
+  HTTP = 'http',
+  HTTPS = 'https'
+}
+
+enum ConfigType {
+  NewRealm = 'newRealm',
+  ExistingRealm = 'existingRealm'
+}
 
 @Component({
   selector: 'cd-rgw-multisite-wizard',
@@ -43,7 +68,7 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
   stepsToSkip: { [steps: string]: boolean } = {};
   daemons: RgwDaemon[] = [];
   selectedCluster = '';
-  clusterDetailsArray: any;
+  clusterDetailsArray: MultiCluster[] = [];
   isMultiClusterConfigured = false;
   exportTokenForm: CdFormGroup;
   realms: any;
@@ -53,6 +78,9 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
   rgwEndpoints: { value: any[]; options: any[]; messages: any };
   executingTask: ExecutingTask;
   setupCompleted = false;
+  showConfigType = false;
+  realmList: string[] = [];
+  realmsInfo: { realm: string; token: string }[];
 
   constructor(
     private wizardStepsService: WizardStepsService,
@@ -61,10 +89,12 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
     private rgwDaemonService: RgwDaemonService,
     private multiClusterService: MultiClusterService,
     private rgwMultisiteService: RgwMultisiteService,
+    private rgwRealmService: RgwRealmService,
     public notificationService: NotificationService,
     private route: ActivatedRoute,
     private summaryService: SummaryService,
-    private location: Location
+    private location: Location,
+    private cdr: ChangeDetectorRef
   ) {
     super();
     this.pageURL = 'rgw/multisite/configuration';
@@ -87,63 +117,85 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
 
   ngOnInit(): void {
     this.open = this.route.outlet === 'modal';
-    this.rgwDaemonService
-      .list()
-      .pipe(
-        switchMap((daemons) => {
-          this.daemons = daemons;
-          const daemonStatsObservables = daemons.map((daemon) =>
-            this.rgwDaemonService.get(daemon.id).pipe(
-              map((daemonStats) => ({
-                hostname: daemon.server_hostname,
-                port: daemon.port,
-                frontendConfig: daemonStats['rgw_metadata']['frontend_config#0']
-              }))
-            )
-          );
-          return forkJoin(daemonStatsObservables);
-        })
-      )
-      .subscribe((daemonStatsArray) => {
-        this.rgwEndpoints.value = daemonStatsArray.map((daemonStats) => {
-          const protocol = daemonStats.frontendConfig.includes('ssl_port') ? 'https' : 'http';
-          return `${protocol}://${daemonStats.hostname}:${daemonStats.port}`;
-        });
-        const options: SelectOption[] = this.rgwEndpoints.value.map(
-          (endpoint: string) => new SelectOption(false, endpoint, '')
-        );
-        this.rgwEndpoints.options = [...options];
-      });
-
-    this.multiClusterService.getCluster().subscribe((clusters) => {
+    this.loadRGWEndpoints();
+    this.multiClusterService.getCluster().subscribe((clusters: MultiClusterConfig) => {
+      const currentUrl = clusters['current_url'];
       this.clusterDetailsArray = Object.values(clusters['config'])
         .flat()
-        .filter((cluster) => cluster['url'] !== clusters['current_url']);
+        .filter((cluster) => cluster['url'] !== currentUrl);
       this.isMultiClusterConfigured = this.clusterDetailsArray.length > 0;
-      if (!this.isMultiClusterConfigured) {
-        this.stepTitles = STEP_TITLES_SINGLE_CLUSTER.map((title) => ({
-          label: title
-        }));
-        this.stepTitles.forEach((steps, index) => {
-          steps.onClick = () => (this.currentStep.stepIndex = index);
-        });
-      } else {
-        this.selectedCluster = this.clusterDetailsArray[0]['name'];
-      }
+      this.stepTitles = (this.isMultiClusterConfigured
+        ? STEP_TITLES_MULTI_CLUSTER_CONFIGURED
+        : STEP_TITLES_SINGLE_CLUSTER
+      ).map((label, index) => ({
+        label,
+        onClick: () => (this.currentStep.stepIndex = index)
+      }));
       this.wizardStepsService.setTotalSteps(this.stepTitles.length);
+      this.selectedCluster = this.isMultiClusterConfigured
+        ? this.clusterDetailsArray[0]['name']
+        : null;
     });
 
     this.summaryService.subscribe((summary) => {
-      this.executingTask = summary.executing_tasks.filter((tasks) =>
-        tasks.name.includes('progress/Multisite-Setup')
-      )[0];
+      this.executingTask = summary.executing_tasks.find((task) =>
+        task.name.includes('progress/Multisite-Setup')
+      );
+    });
+
+    this.stepTitles.forEach((step) => {
+      this.stepsToSkip[step.label] = false;
     });
 
-    this.stepTitles.forEach((stepTitle) => {
-      this.stepsToSkip[stepTitle.label] = false;
+    this.rgwRealmService.getRealmTokens().subscribe((data: { realm: string; token: string }[]) => {
+      const base64Matcher = /^(?:[A-Za-z0-9+/]{4})*(?:[A-Za-z0-9+/]{2}==|[A-Za-z0-9+/]{3}=|[A-Za-z0-9+/]{4})$/;
+      this.realmsInfo = data.filter((realmInfo) => base64Matcher.test(realmInfo.token));
+      this.showConfigType = this.realmsInfo.length > 0;
+      if (this.showConfigType) {
+        this.multisiteSetupForm.get('selectedRealm')?.setValue(this.realmsInfo[0].realm);
+        this.cdr.detectChanges();
+      }
     });
   }
 
+  private loadRGWEndpoints(): void {
+    this.rgwDaemonService
+      .list()
+      .pipe(
+        switchMap((daemons: RgwDaemon[]) => {
+          this.daemons = daemons;
+          return this.fetchDaemonStats(daemons);
+        })
+      )
+      .subscribe((daemonStatsArray: EndpointInfo[]) => {
+        this.populateRGWEndpoints(daemonStatsArray);
+      });
+  }
+
+  private fetchDaemonStats(daemons: RgwDaemon[]): Observable<EndpointInfo[]> {
+    const observables = daemons.map((daemon) =>
+      this.rgwDaemonService.get(daemon.id).pipe(
+        map((daemonStats: DaemonStats) => ({
+          hostname: daemon.server_hostname,
+          port: daemon.port,
+          frontendConfig: daemonStats?.rgw_metadata?.['frontend_config#0'] || ''
+        }))
+      )
+    );
+    return forkJoin(observables);
+  }
+
+  private populateRGWEndpoints(statsArray: EndpointInfo[]): void {
+    this.rgwEndpoints.value = statsArray.map((stats: EndpointInfo) => {
+      const protocol = stats.frontendConfig.includes('ssl_port') ? Protocol.HTTPS : Protocol.HTTP;
+      return `${protocol}://${stats.hostname}:${stats.port}`;
+    });
+    this.rgwEndpoints.options = this.rgwEndpoints.value.map(
+      (endpoint) => new SelectOption(false, endpoint, '')
+    );
+    this.cdr.detectChanges();
+  }
+
   createForm() {
     this.multisiteSetupForm = new CdFormGroup({
       realmName: new UntypedFormControl('default_realm', {
@@ -167,7 +219,9 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
       }),
       replicationZoneName: new UntypedFormControl('new_replicated_zone', {
         validators: [Validators.required]
-      })
+      }),
+      configType: new UntypedFormControl(ConfigType.NewRealm, {}),
+      selectedRealm: new UntypedFormControl(null, {})
     });
 
     if (!this.isMultiClusterConfigured) {
@@ -244,6 +298,10 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
     } else {
       const cluster = values['cluster'];
       const replicationZoneName = values['replicationZoneName'];
+      let selectedRealmName = '';
+      if (this.multisiteSetupForm.get('configType').value === ConfigType.ExistingRealm) {
+        selectedRealmName = this.multisiteSetupForm.get('selectedRealm').value;
+      }
       this.rgwMultisiteService
         .setUpMultisiteReplication(
           realmName,
@@ -254,7 +312,8 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
           username,
           cluster,
           replicationZoneName,
-          this.clusterDetailsArray
+          this.clusterDetailsArray,
+          selectedRealmName
         )
         .subscribe(
           () => {
@@ -294,4 +353,25 @@ export class RgwMultisiteWizardComponent extends BaseModal implements OnInit {
   closeModal(): void {
     this.location.back();
   }
+
+  onConfigTypeChange() {
+    const configType = this.multisiteSetupForm.get('configType')?.value;
+    if (configType === ConfigType.ExistingRealm) {
+      this.stepTitles = STEP_TITLES_EXISTING_REALM.map((title) => ({
+        label: title
+      }));
+      this.stepTitles.forEach((steps, index) => {
+        steps.onClick = () => (this.currentStep.stepIndex = index);
+      });
+    } else if (this.isMultiClusterConfigured) {
+      this.stepTitles = STEP_TITLES_MULTI_CLUSTER_CONFIGURED.map((title) => ({
+        label: title
+      }));
+    } else {
+      this.stepTitles = STEP_TITLES_SINGLE_CLUSTER.map((title) => ({
+        label: title
+      }));
+    }
+    this.wizardStepsService.setTotalSteps(this.stepTitles.length);
+  }
 }

src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-multisite-wizard/rgw-multisite-wizard.component.ts

@@ -86,7 +86,8 @@ export class RgwMultisiteService {
     username: string,
     cluster?: string,
     replicationZoneName?: string,
-    clusterDetailsArray?: any
+    clusterDetailsArray?: any,
+    selectedRealmName?: string
   ) {
     let params = new HttpParams()
       .set('realm_name', realmName)
@@ -108,6 +109,10 @@ export class RgwMultisiteService {
       params = params.set('replication_zone_name', replicationZoneName);
     }
 
+    if (selectedRealmName) {
+      params = params.set('selectedRealmName', selectedRealmName);
+    }
+
     return this.http.post(`${this.uiUrl}/multisite-replications`, null, { params: params });
   }
 

src/pybind/mgr/dashboard/frontend/src/app/shared/api/rgw-multisite.service.ts

@@ -9,3 +9,12 @@ export interface MultiCluster {
   ssl_certificate: string;
   ttl: number;
 }
+
+export interface MultiClusterConfig {
+  current_url: string;
+  current_user: string;
+  hub_url: string;
+  config: {
+    [clusterId: string]: MultiCluster[];
+  };
+}