From 6987191377e5ca623563ae851d87e0961416e3f4 Mon Sep 17 00:00:00 2001
From: Nizamudeen A <nia@redhat.com>
Date: Mon, 14 Nov 2022 07:50:54 +0530
Subject: [PATCH] mgr/dashboard: expose more grafana configs in service form

Show the grafana_port and initial_admin_password in the form but disable
the password field in the edit option

Fixes: https://tracker.ceph.com/issues/58016
Signed-off-by: Nizamudeen A <nia@redhat.com>
---
 .../service-form/service-form.component.html  | 59 +++++++++++++++++++
 .../service-form.component.spec.ts            | 42 +++++++++----
 .../service-form/service-form.component.ts    | 13 +++-
 .../app/shared/models/service.interface.ts    |  2 +
 4 files changed, 104 insertions(+), 12 deletions(-)

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.html
index 8f85bf723e42..4e6df5c46c5b 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.html
@@ -685,6 +685,65 @@
             </div>
           </div>
         </ng-container>
+        <!-- Grafana -->
+        <ng-container *ngIf="serviceForm.controls.service_type.value === 'grafana'">
+          <div class="form-group row">
+            <label class="cd-col-form-label"
+                   for="grafana_port">
+              <span i18n>Grafana Port</span>
+              <cd-helper>
+                <span i18n>The default port used by grafana.</span>
+              </cd-helper>
+            </label>
+            <div class="cd-col-form-input">
+              <input id="grafana_port"
+                     class="form-control"
+                     type="number"
+                     formControlName="grafana_port"
+                     min="1"
+                     max="65535">
+              <span class="invalid-feedback"
+                    *ngIf="serviceForm.showError('grafana_port', frm, 'pattern')"
+                    i18n>The entered value needs to be a number.</span>
+              <span class="invalid-feedback"
+                    *ngIf="serviceForm.showError('grafana_port', frm, 'min')"
+                    i18n>The value must be at least 1.</span>
+              <span class="invalid-feedback"
+                    *ngIf="serviceForm.showError('grafana_port', frm, 'max')"
+                    i18n>The value cannot exceed 65535.</span>
+              <span class="invalid-feedback"
+                    *ngIf="serviceForm.showError('grafana_port', frm, 'required')"
+                    i18n>This field is required.</span>
+            </div>
+          </div>
+
+          <div class="form-group row">
+            <label i18n
+                   class="cd-col-form-label"
+                   for="grafana_admin_password">
+              <span>Grafana Password</span>
+              <cd-helper>The password of the default Grafana Admin. Set once on first-run.</cd-helper>
+            </label>
+            <div class="cd-col-form-input">
+              <div class="input-group">
+                <input id="grafana_admin_password"
+                       class="form-control"
+                       type="password"
+                       autocomplete="new-password"
+                       [attr.disabled]="editing ? true:null"
+                       formControlName="grafana_admin_password">
+                <span class="input-group-append">
+                  <button type="button"
+                          class="btn btn-light"
+                          cdPasswordButton="grafana_admin_password">
+                  </button>
+                  <cd-copy-2-clipboard-button source="grafana_admin_password">
+                  </cd-copy-2-clipboard-button>
+                </span>
+              </div>
+            </div>
+          </div>
+        </ng-container>
       </div>
 
       <div class="modal-footer">
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.spec.ts
index e86a86fd65e4..b2c965ee71b9 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.spec.ts
@@ -120,17 +120,7 @@ describe('ServiceFormComponent', () => {
 
     it('should test various services', () => {
       _.forEach(
-        [
-          'alertmanager',
-          'crash',
-          'grafana',
-          'mds',
-          'mgr',
-          'mon',
-          'node-exporter',
-          'prometheus',
-          'rbd-mirror'
-        ],
+        ['alertmanager', 'crash', 'mds', 'mgr', 'mon', 'node-exporter', 'prometheus', 'rbd-mirror'],
         (serviceType) => {
           formHelper.setValue('service_type', serviceType);
           component.onSubmit();
@@ -143,6 +133,36 @@ describe('ServiceFormComponent', () => {
       );
     });
 
+    describe('should test service grafana', () => {
+      beforeEach(() => {
+        formHelper.setValue('service_type', 'grafana');
+      });
+
+      it('should sumbit grafana', () => {
+        component.onSubmit();
+        expect(cephServiceService.create).toHaveBeenCalledWith({
+          service_type: 'grafana',
+          placement: {},
+          unmanaged: false,
+          initial_admin_password: null,
+          port: null
+        });
+      });
+
+      it('should sumbit grafana with custom port and initial password', () => {
+        formHelper.setValue('grafana_port', 1234);
+        formHelper.setValue('grafana_admin_password', 'foo');
+        component.onSubmit();
+        expect(cephServiceService.create).toHaveBeenCalledWith({
+          service_type: 'grafana',
+          placement: {},
+          unmanaged: false,
+          initial_admin_password: 'foo',
+          port: 1234
+        });
+      });
+    });
+
     describe('should test service nfs', () => {
       beforeEach(() => {
         formHelper.setValue('service_type', 'nfs');
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.ts
index 3b5cc0c71869..5ae2dfa50b4c 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/services/service-form/service-form.component.ts
@@ -334,7 +334,9 @@ export class ServiceFormComponent extends CdForm implements OnInit {
             privacy_protocol: { op: '!empty' }
           })
         ]
-      ]
+      ],
+      grafana_port: [null, [CdValidators.number(false)]],
+      grafana_admin_password: [null]
     });
   }
 
@@ -480,6 +482,12 @@ export class ServiceFormComponent extends CdForm implements OnInit {
                   .setValue(response[0].spec['credentials']['snmp_community']);
               }
               break;
+            case 'grafana':
+              this.serviceForm.get('grafana_port').setValue(response[0].spec.port);
+              this.serviceForm
+                .get('grafana_admin_password')
+                .setValue(response[0].spec.initial_admin_password);
+              break;
           }
         });
     }
@@ -654,6 +662,9 @@ export class ServiceFormComponent extends CdForm implements OnInit {
           }
           serviceSpec['virtual_interface_networks'] = values['virtual_interface_networks'];
           break;
+        case 'grafana':
+          serviceSpec['port'] = values['grafana_port'];
+          serviceSpec['initial_admin_password'] = values['grafana_admin_password'];
       }
     }
 
diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/models/service.interface.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/models/service.interface.ts
index dd64422e10f4..f271c364c267 100644
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/models/service.interface.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/models/service.interface.ts
@@ -35,6 +35,8 @@ export interface CephServiceAdditionalSpec {
   ssl: boolean;
   ssl_cert: string;
   ssl_key: string;
+  port: number;
+  initial_admin_password: string;
 }
 
 export interface CephServicePlacement {
-- 
2.47.3