mgr/dashboard: Allow string descriptions in confirmation modal

Fixes: https://tracker.ceph.com/issues/38287
Signed-off-by: Stephan Müller <smueller@suse.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.html b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.html
index 0060c93bee80080ead582ece0d8e37025891a1ac..bea4eb533b233b982d53c9a87a4e2b87af223e51 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.html
@@ -7,6 +7,9 @@
           novalidate>
       <div class="modal-body">
         <ng-container *ngTemplateOutlet="bodyTpl; context: bodyContext"></ng-container>
+        <p *ngIf="description">
+          {{description}}
+        </p>
       </div>
       <div class="modal-footer">
         <div class="button-group text-right">

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.spec.ts
index 67a1d434cc9e31dd1dd633b954581ecd290a0c7a..ece9a5305ec7977c21a8af3f460853e379a5534b 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.spec.ts
@@ -25,7 +25,7 @@ export class MockModule {}
 @Component({
   template: `
     <ng-template #fillTpl>
-      The description of the confirmation modal is mandatory.
+      Template based description.
     </ng-template>
   `
 })
@@ -45,6 +45,7 @@ class MockComponent {
           titleText: 'Title is a must have',
           buttonText: 'Action label',
           bodyTpl: this.fillTpl,
+          description: 'String based description.',
           onSubmit: () => {
             this.returnValue = 'The submit action has to hide manually.';
             this.modalRef.hide();
@@ -155,7 +156,8 @@ describe('ConfirmationModalComponent', () => {
     it('has no description defined', () => {
       expectError(
         {
-          bodyTpl: undefined
+          bodyTpl: undefined,
+          description: undefined
         },
         'No description defined'
       );
@@ -197,7 +199,7 @@ describe('ConfirmationModalComponent', () => {
 
     it('should show the description', () => {
       expect(fh.getText('.modal-body')).toBe(
-        'The description of the confirmation modal is mandatory.'
+        'Template based description.  String based description.'
       );
     });
   });

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.ts
index 791189256526a8472e4430553008686935b695b2..23a1bf1bc59db46fd97c96819e2b9ca79a45919d 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/components/confirmation-modal/confirmation-modal.component.ts
@@ -11,11 +11,14 @@ import { Subscription } from 'rxjs';
 })
 export class ConfirmationModalComponent implements OnInit, OnDestroy {
   // Needed
-  bodyTpl: TemplateRef<any>;
   buttonText: string;
   titleText: string;
   onSubmit: Function;
 
+  // One of them is needed
+  bodyTpl?: TemplateRef<any>;
+  description?: TemplateRef<any>;
+
   // Optional
   bodyData?: object;
   onCancel?: Function;
@@ -45,7 +48,7 @@ export class ConfirmationModalComponent implements OnInit, OnDestroy {
       throw new Error('No action name defined');
     } else if (!this.titleText) {
       throw new Error('No title defined');
-    } else if (!this.bodyTpl) {
+    } else if (!this.bodyTpl && !this.description) {
       throw new Error('No description defined');
     }
   }