mgr/dashboard: Introduce pipe to convert bool to text

Convert boolean values to 'Yes' or 'No' or any other value.

Signed-off-by: Volker Theile <vtheile@suse.com>

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.html
index b8d6037ca0007f611aad0c5fd17baa52ab7eeed6..b5776a7e067b5c5f2c98bcad518057a977f96964 100755 (executable)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.html
@@ -85,7 +85,7 @@
         <tr>
           <td i18n
               class="bold col-sm-1">Can be updated at runtime (editable)</td>
-          <td class="col-sm-3">{{ selectedItem.can_update_at_runtime }}</td>
+          <td class="col-sm-3">{{ selectedItem.can_update_at_runtime | booleanText }}</td>
         </tr>
         <tr>
           <td i18n

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.spec.ts
index 0016b478696ccaf1f30af43d9a25a19f189bdd81..8c50cb8fb31a78338e159ba56979de5b89c27ae0 100755 (executable)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/cluster/configuration/configuration-details/configuration-details.component.spec.ts
@@ -4,6 +4,7 @@ import { TabsModule } from 'ngx-bootstrap/tabs';
 
 import { configureTestBed, i18nProviders } from '../../../../../testing/unit-test-helper';
 import { DataTableModule } from '../../../../shared/datatable/datatable.module';
+import { SharedModule } from '../../../../shared/shared.module';
 import { ConfigurationDetailsComponent } from './configuration-details.component';
 
 describe('ConfigurationDetailsComponent', () => {
@@ -12,7 +13,7 @@ describe('ConfigurationDetailsComponent', () => {
 
   configureTestBed({
     declarations: [ConfigurationDetailsComponent],
-    imports: [DataTableModule, TabsModule.forRoot()],
+    imports: [DataTableModule, SharedModule, TabsModule.forRoot()],
     providers: [i18nProviders]
   });
 

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.html
index 3ccb9cb684f061a82a40face882dd12272e93775..f1ef63cb2af956010e84bec68ae43a192cda29b8 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.html
@@ -69,7 +69,7 @@
             <tr>
               <td i18n
                   class="bold col-sm-1">Enabled</td>
-              <td class="col-sm-3">{{ bucket.bucket_quota.enabled ? "Yes" : "No" }}</td>
+              <td class="col-sm-3">{{ bucket.bucket_quota.enabled | booleanText }}</td>
             </tr>
             <tr>
               <td i18n

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.spec.ts
index 18124caa365df89eeb37f39db9dc81881554d5cd..a2ede8d3f3f02c6b36a1a3893cc533b2fd456497 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.spec.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-bucket-details/rgw-bucket-details.component.spec.ts
@@ -2,7 +2,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 
 import { TabsModule } from 'ngx-bootstrap/tabs';
 
-import { configureTestBed } from '../../../../testing/unit-test-helper';
+import { configureTestBed, i18nProviders } from '../../../../testing/unit-test-helper';
 import { CdTableSelection } from '../../../shared/models/cd-table-selection';
 import { SharedModule } from '../../../shared/shared.module';
 import { RgwBucketDetailsComponent } from './rgw-bucket-details.component';
@@ -13,7 +13,8 @@ describe('RgwBucketDetailsComponent', () => {
 
   configureTestBed({
     declarations: [RgwBucketDetailsComponent],
-    imports: [SharedModule, TabsModule.forRoot()]
+    imports: [SharedModule, TabsModule.forRoot()],
+    providers: [i18nProviders]
   });
 
   beforeEach(() => {

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html
index 0e23d16b44e502954d49fa1f8d834acfc8cd2298..4a90eb45a2587970f82803a3e46d0e960c5e097e 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html
+++ b/src/pybind/mgr/dashboard/frontend/src/app/ceph/rgw/rgw-user-details/rgw-user-details.component.html
@@ -22,7 +22,7 @@
           <tr>
             <td i18n
                 class="bold col-sm-1">Suspended</td>
-            <td class="col-sm-3">{{ user.suspended ? "Yes" : "No" }}</td>
+            <td class="col-sm-3">{{ user.suspended | booleanText }}</td>
           </tr>
           <tr>
             <td i18n
@@ -64,7 +64,7 @@
             <tr>
               <td i18n
                   class="bold col-sm-1">Enabled</td>
-              <td class="col-sm-3">{{ user.user_quota.enabled ? "Yes" : "No" }}</td>
+              <td class="col-sm-3">{{ user.user_quota.enabled | booleanText }}</td>
             </tr>
             <tr>
               <td i18n
@@ -100,7 +100,7 @@
             <tr>
               <td i18n
                   class="bold col-sm-1">Enabled</td>
-              <td class="col-sm-3">{{ user.bucket_quota.enabled ? "Yes" : "No" }}</td>
+              <td class="col-sm-3">{{ user.bucket_quota.enabled | booleanText }}</td>
             </tr>
             <tr>
               <td i18n

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.spec.ts
new file mode 100644 (file)
index 0000000..a5d4667
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.spec.ts
@@ -0,0 +1,47 @@
+import { TestBed } from '@angular/core/testing';
+import { configureTestBed, i18nProviders } from '../../../testing/unit-test-helper';
+
+import { I18n } from '@ngx-translate/i18n-polyfill';
+
+import { BooleanTextPipe } from './boolean-text.pipe';
+
+describe('BooleanTextPipe', () => {
+  let pipe: BooleanTextPipe;
+
+  configureTestBed({
+    providers: [i18nProviders]
+  });
+
+  beforeEach(() => {
+    const i18n = TestBed.get(I18n);
+    pipe = new BooleanTextPipe(i18n);
+  });
+
+  it('create an instance', () => {
+    expect(pipe).toBeTruthy();
+  });
+
+  it('transforms true', () => {
+    expect(pipe.transform(true)).toEqual('Yes');
+  });
+
+  it('transforms true, alternative text', () => {
+    expect(pipe.transform(true, 'foo')).toEqual('foo');
+  });
+
+  it('transforms 1', () => {
+    expect(pipe.transform(1)).toEqual('Yes');
+  });
+
+  it('transforms false', () => {
+    expect(pipe.transform(false)).toEqual('No');
+  });
+
+  it('transforms false, alternative text', () => {
+    expect(pipe.transform(false, 'foo', 'bar')).toEqual('bar');
+  });
+
+  it('transforms 0', () => {
+    expect(pipe.transform(0)).toEqual('No');
+  });
+});

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.ts
new file mode 100644 (file)
index 0000000..dba4e8b
--- /dev/null
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.ts
@@ -0,0 +1,18 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+import { I18n } from '@ngx-translate/i18n-polyfill';
+
+@Pipe({
+  name: 'booleanText'
+})
+export class BooleanTextPipe implements PipeTransform {
+  constructor(private i18n: I18n) {}
+
+  transform(
+    value: any,
+    truthyText: string = this.i18n('Yes'),
+    falsyText: string = this.i18n('No')
+  ): string {
+    return Boolean(value) ? truthyText : falsyText;
+  }
+}

diff --git a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/pipes.module.ts b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/pipes.module.ts
index 0e53746f9d6bfe62d3263a6023d750d101080c3d..85db7a7c96f5c6bfc95aec629ab373d08e6f1328 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/pipes.module.ts
+++ b/src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/pipes.module.ts
@@ -1,6 +1,7 @@
 import { CommonModule, DatePipe } from '@angular/common';
 import { NgModule } from '@angular/core';
 
+import { BooleanTextPipe } from './boolean-text.pipe';
 import { CdDatePipe } from './cd-date.pipe';
 import { CephReleaseNamePipe } from './ceph-release-name.pipe';
 import { CephShortVersionPipe } from './ceph-short-version.pipe';
@@ -23,6 +24,7 @@ import { UpperFirstPipe } from './upper-first.pipe';
 @NgModule({
   imports: [CommonModule],
   declarations: [
+    BooleanTextPipe,
     DimlessBinaryPipe,
     DimlessBinaryPerSecondPipe,
     HealthColorPipe,
@@ -43,6 +45,7 @@ import { UpperFirstPipe } from './upper-first.pipe';
     UpperFirstPipe
   ],
   exports: [
+    BooleanTextPipe,
     DimlessBinaryPipe,
     DimlessBinaryPerSecondPipe,
     HealthColorPipe,
@@ -63,6 +66,7 @@ import { UpperFirstPipe } from './upper-first.pipe';
     UpperFirstPipe
   ],
   providers: [
+    BooleanTextPipe,
     DatePipe,
     CephShortVersionPipe,
     CephReleaseNamePipe,

diff --git a/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf b/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf
index f8f072ddaf438091a8d13e8b95c7d59b6692f0aa..8b88098120fd5c8933efef9ebf8620f861464095 100644 (file)
--- a/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf
+++ b/src/pybind/mgr/dashboard/frontend/src/locale/messages.xlf
@@ -6228,6 +6228,20 @@
           <context context-type="linenumber">1</context>
         </context-group>
       </trans-unit>
+      <trans-unit id="4f20f2d5a6882190892e58b85f6ccbedfa737952" datatype="html">
+        <source>Yes</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/shared/pipes/boolean-text.pipe.ts</context>
+          <context context-type="linenumber">1</context>
+        </context-group>
+      </trans-unit>
+      <trans-unit id="3d3ae7deebc5949b0c1c78b9847886a94321d9fd" datatype="html">
+        <source>No</source>
+        <context-group purpose="location">
+          <context context-type="sourcefile">src/app/shared/pipes/boolean-text.pipe.ts</context>
+          <context context-type="linenumber">1</context>
+        </context-group>
+      </trans-unit>
       <trans-unit id="8fd98fb2a0f24ba72cde0787dd3f02cfc17de469" datatype="html">
         <source>Quality of Service</source>
         <context-group purpose="location">