From 346cfa3969d752cbcc55ba6f6aec903a8bdf5fb1 Mon Sep 17 00:00:00 2001
From: Volker Theile <vtheile@suse.com>
Date: Fri, 1 Mar 2019 10:27:13 +0100
Subject: [PATCH] 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>
---
 .../configuration-details.component.html      |  2 +-
 .../configuration-details.component.spec.ts   |  3 +-
 .../rgw-bucket-details.component.html         |  2 +-
 .../rgw-bucket-details.component.spec.ts      |  5 +-
 .../rgw-user-details.component.html           |  6 +--
 .../shared/pipes/boolean-text.pipe.spec.ts    | 47 +++++++++++++++++++
 .../src/app/shared/pipes/boolean-text.pipe.ts | 18 +++++++
 .../src/app/shared/pipes/pipes.module.ts      |  4 ++
 .../frontend/src/locale/messages.xlf          | 14 ++++++
 9 files changed, 93 insertions(+), 8 deletions(-)
 create mode 100644 src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.spec.ts
 create mode 100644 src/pybind/mgr/dashboard/frontend/src/app/shared/pipes/boolean-text.pipe.ts

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 b8d6037ca00..b5776a7e067 100755
--- 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 0016b478696..8c50cb8fb31 100755
--- 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 3ccb9cb684f..f1ef63cb2af 100644
--- 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 18124caa365..a2ede8d3f3f 100644
--- 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 0e23d16b44e..4a90eb45a25 100644
--- 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
index 00000000000..a5d4667a15e
--- /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
index 00000000000..dba4e8bc010
--- /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 0e53746f9d6..85db7a7c96f 100644
--- 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 f8f072ddaf4..8b88098120f 100644
--- 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">