mgr/dashboard: rbd striping setting pre-population and pop-over

Pre-populating the stripe count to 1 (now it's empty). "1" means no "fancy striping", anything else enables the fancy striping.
Adding a pop-over explaining each setting for striping (object size, stripe unit and stripe count).

Fixes: https://tracker.ceph.com/issues/39726
Signed-off-by: Vrushal Chaudhari <vrushalcs@gmail.com>

src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.html

@@ -262,7 +262,7 @@
             <div class="form-group row">
               <label i18n
                      class="cd-col-form-label"
-                     for="size">Object size</label>
+                     for="size">Object size<cd-helper>Object Size: Objects in the Ceph Storage Cluster have a maximum configurable size (e.g., 2MB, 4MB, etc.). The object size should be large enough to accommodate many stripe units, and should be a multiple of the stripe unit.</cd-helper></label>
               <div class="cd-col-form-input">
                 <select id="obj_size"
                         name="obj_size"
@@ -279,7 +279,7 @@
               <label class="cd-col-form-label"
                      [ngClass]="{'required': rbdForm.getValue('stripingCount')}"
                      for="stripingUnit"
-                     i18n>Stripe unit</label>
+                     i18n>Stripe unit<cd-helper>Stripe Width: Stripes have a configurable unit size (e.g., 64kb). The Ceph Client divides the data it will write to objects into equally sized stripe units, except for the last stripe unit. A stripe width, should be a fraction of the Object Size so that an object may contain many stripe units.</cd-helper></label>
               <div class="cd-col-form-input">
                 <select id="stripingUnit"
                         name="stripingUnit"
@@ -304,7 +304,7 @@
               <label class="cd-col-form-label"
                      [ngClass]="{'required': rbdForm.getValue('stripingUnit')}"
                      for="stripingCount"
-                     i18n>Stripe count</label>
+                     i18n>Stripe count<cd-helper>Stripe Count: The Ceph Client writes a sequence of stripe units over a series of objects determined by the stripe count. The series of objects is called an object set. After the Ceph Client writes to the last object in the object set, it returns to the first object in the object set.</cd-helper></label>
               <div class="cd-col-form-input">
                 <input id="stripingCount"
                        name="stripingCount"

src/pybind/mgr/dashboard/frontend/src/app/ceph/block/rbd-form/rbd-form.component.ts

@@ -93,6 +93,9 @@ export class RbdFormComponent extends CdForm implements OnInit {
     '16 MiB',
     '32 MiB'
   ];
+
+  defaultStripingCount = 1;
+
   action: string;
   resource: string;
   private rbdImage = new ReplaySubject(1);
@@ -189,7 +192,7 @@ export class RbdFormComponent extends CdForm implements OnInit {
           }, {})
         ),
         stripingUnit: new FormControl(null),
-        stripingCount: new FormControl(null, {
+        stripingCount: new FormControl(this.defaultStripingCount, {
           updateOn: 'blur'
         })
       },
@@ -389,7 +392,8 @@ export class RbdFormComponent extends CdForm implements OnInit {
         objectSizeControl.value != null ? objectSizeControl.value : this.defaultObjectSize
       );
       const stripingCountControl = formGroup.get('stripingCount');
-      const stripingCount = stripingCountControl.value != null ? stripingCountControl.value : 1;
+      const stripingCount =
+        stripingCountControl.value != null ? stripingCountControl.value : this.defaultStripingCount;
       let sizeControlErrors = null;
       if (sizeControl.value === null) {
         sizeControlErrors = { required: true };