*BREAKING CHANGE* feat(common): add a base 1000 bytes pipe named "dec…

…imalBytes". (#1095)

* Add a base 1000 bytes pipe named "decimalBytes".
Updated suffix of existing bytes pipe to X+"iB"

* chore(): Moving export to public-api.ts

src/app/components/components/pipes/pipes.component.html

@@ -66,7 +66,7 @@ <h3 matLine>Digits: { { log.digits } }</h3>
   <mat-card-title>Byte Conversion</mat-card-title>
   <mat-divider></mat-divider>
   <mat-card-content>
-    <p class="mat-body-1">The <code>bytes</code> pipe takes a number and converts the output to an appropriate data measurement with an optional <code>precision</code> argument.</p>
+    <p class="mat-body-1">The <code>bytes</code> pipe takes a number and converts the output to an appropriate base 1024 data measurement with an optional <code>precision</code> argument.</p>
     <mat-list>
       <mat-list-item *ngFor="let log of logs">
         <!-- original output -->
@@ -95,6 +95,39 @@ <h3 matLine>Bytes: { { log.bytes } }</h3>
   </mat-card-content>
  </mat-card>
 
+ <mat-card>
+  <mat-card-title>Decimal Bytes Conversion</mat-card-title>
+  <mat-divider></mat-divider>
+  <mat-card-content>
+    <p class="mat-body-1">The <code>decimalBytes</code> pipe takes a number and converts the output to an appropriate base 1000 data measurement with an optional <code>precision</code> argument.</p>
+    <mat-list>
+      <mat-list-item *ngFor="let log of logs">
+        <!-- original output -->
+        <h3 matLine>Bytes: {{ log.bytes }}</h3>
+        <!-- output with bytes pipe -->
+        <p matLine>Converted: {{ log.bytes | decimalBytes }}</p>
+        <!-- output with precision aurgument -->
+        <p *ngIf="log.precision" matLine>With precision argument: {{ log.bytes | decimalBytes:log.precision }} </p>
+      </mat-list-item>
+    </mat-list>
+  <p>Usage:</p>
+    <td-highlight lang="html">
+        <![CDATA[
+          <mat-list>
+            <mat-list-item *ngFor="let log of logs">
+              <!-- original output -->
+              <h3 matLine>Bytes: { { log.bytes } }</h3>
+              <!-- output with bytes pipe -->
+              <p matLine>Converted: { { log.bytes | decimalBytes } }</p>
+              <!-- output with precision aurgument -->
+              <p matLine>With precision argument: { { log.bytes | decimalBytes:log.precision } } </p>
+            </mat-list-item>
+          </mat-list>
+        ]]>
+    </td-highlight>
+  </mat-card-content>
+ </mat-card>
+
  <mat-card>
   <mat-card-title>Time Ago</mat-card-title>
   <mat-divider></mat-divider>

src/platform/core/common/common.module.ts

@@ -38,13 +38,15 @@ const TD_VALIDATORS: Type<any>[] = [
 import { TdTimeAgoPipe } from './pipes/time-ago/time-ago.pipe';
 import { TdTimeDifferencePipe } from './pipes/time-difference/time-difference.pipe';
 import { TdBytesPipe } from './pipes/bytes/bytes.pipe';
+import { TdDecimalBytesPipe } from './pipes/decimal-bytes/decimal-bytes.pipe';
 import { TdDigitsPipe } from './pipes/digits/digits.pipe';
 import { TdTruncatePipe } from './pipes/truncate/truncate.pipe';
 
 const TD_PIPES: Type<any>[] = [
   TdTimeAgoPipe,
   TdTimeDifferencePipe,
   TdBytesPipe,
+  TdDecimalBytesPipe,
   TdDigitsPipe,
   TdTruncatePipe,
 ];

src/platform/core/common/pipes/bytes/bytes.pipe.spec.ts

@@ -17,16 +17,16 @@ describe('TdBytesPipe', () => {
   it('should return a formatted bytes to larger units', () => {
     expect(pipe.transform(0, undefined)).toEqual('0 B');
     expect(pipe.transform(535, undefined)).toEqual('535 B');
-    expect(pipe.transform(1024, undefined)).toEqual('1 KB');
-    expect(pipe.transform(138540, undefined)).toEqual('135.29 KB');
-    expect(pipe.transform(138540, 1)).toEqual('135.3 KB');
-    expect(pipe.transform(1571800, undefined)).toEqual('1.5 MB');
-    expect(pipe.transform(1571800, 4)).toEqual('1.499 MB');
-    expect(pipe.transform(10000000, undefined)).toEqual('9.54 MB');
-    expect(pipe.transform(10485760, undefined)).toEqual('10 MB');
-    expect(pipe.transform(10201000, 3)).toEqual('9.728 MB');
-    expect(pipe.transform(3.81861e+10, undefined)).toEqual('35.56 GB');
-    expect(pipe.transform(1.890381861e+14, undefined)).toEqual('171.93 TB');
-    expect(pipe.transform(5.35765e+16, undefined)).toEqual('47.59 PB');
+    expect(pipe.transform(1024, undefined)).toEqual('1 KiB');
+    expect(pipe.transform(138540, undefined)).toEqual('135.29 KiB');
+    expect(pipe.transform(138540, 1)).toEqual('135.3 KiB');
+    expect(pipe.transform(1571800, undefined)).toEqual('1.5 MiB');
+    expect(pipe.transform(1571800, 4)).toEqual('1.499 MiB');
+    expect(pipe.transform(10000000, undefined)).toEqual('9.54 MiB');
+    expect(pipe.transform(10485760, undefined)).toEqual('10 MiB');
+    expect(pipe.transform(10201000, 3)).toEqual('9.728 MiB');
+    expect(pipe.transform(3.81861e+10, undefined)).toEqual('35.56 GiB');
+    expect(pipe.transform(1.890381861e+14, undefined)).toEqual('171.93 TiB');
+    expect(pipe.transform(5.35765e+16, undefined)).toEqual('47.59 PiB');
   });
 });

src/platform/core/common/pipes/bytes/bytes.pipe.ts

@@ -15,7 +15,7 @@ export class TdBytesPipe implements PipeTransform {
       return 'Invalid Number';
     }
     let k: number = 1024;
-    let sizes: string[] = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
+    let sizes: string[] = ['B', 'KiB', 'MiB', 'GiB', 'TiB', 'PiB', 'EiB', 'ZiB', 'YiB'];
     let i: number = Math.floor(Math.log(bytes) / Math.log(k));
     // if less than 1
     if (i < 0) {

src/platform/core/common/pipes/decimal-bytes/decimal-bytes.pipe.spec.ts

@@ -0,0 +1,34 @@
+import { TdDecimalBytesPipe } from './decimal-bytes.pipe';
+
+describe('TdDecimalBytesPipe', () => {
+  let pipe: TdDecimalBytesPipe;
+
+  beforeEach(() => {
+    pipe = new TdDecimalBytesPipe();
+  });
+
+  it('should return with an empty or invalid input', () => {
+    expect(pipe.transform(NaN, undefined)).toEqual('Invalid Number');
+    expect(pipe.transform(undefined, undefined)).toEqual('Invalid Number');
+    expect(pipe.transform(0.3, undefined)).toEqual('Invalid Number');
+    expect(pipe.transform(0.76, undefined)).toEqual('Invalid Number');
+  });
+
+  it('should return a formatted bytes to larger units', () => {
+    expect(pipe.transform(0, undefined)).toEqual('0 B');
+    expect(pipe.transform(535, undefined)).toEqual('535 B');
+    expect(pipe.transform(1000, undefined)).toEqual('1 KB');
+    expect(pipe.transform(1024, undefined)).toEqual('1.02 KB');
+    expect(pipe.transform(1024, 1)).toEqual('1 KB');
+    expect(pipe.transform(138540, undefined)).toEqual('138.54 KB');
+    expect(pipe.transform(138540, 1)).toEqual('138.5 KB');
+    expect(pipe.transform(1571800, undefined)).toEqual('1.57 MB');
+    expect(pipe.transform(1571800, 4)).toEqual('1.5718 MB');
+    expect(pipe.transform(10000000, undefined)).toEqual('10 MB');
+    expect(pipe.transform(10485760, undefined)).toEqual('10.49 MB');
+    expect(pipe.transform(10201000, 3)).toEqual('10.201 MB');
+    expect(pipe.transform(3.81861e+10, undefined)).toEqual('38.19 GB');
+    expect(pipe.transform(1.890381861e+14, undefined)).toEqual('189.04 TB');
+    expect(pipe.transform(5.35765e+16, undefined)).toEqual('53.58 PB');
+  });
+});

src/platform/core/common/pipes/decimal-bytes/decimal-bytes.pipe.ts

@@ -0,0 +1,26 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'decimalBytes',
+})
+
+export class TdDecimalBytesPipe implements PipeTransform {
+  /* `bytes` needs to be `any` or TypeScript complains
+  Tried both `number` and `number | string` */
+  transform(bytes: any, precision: number = 2): string {
+    if (bytes === 0) {
+      return '0 B';
+    } else if (isNaN(parseInt(bytes, 10))) {
+      /* If not a valid number, return 'Invalid Number' */
+      return 'Invalid Number';
+    }
+    let k: number = 1000;
+    let sizes: string[] = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB'];
+    let i: number = Math.floor(Math.log(bytes) / Math.log(k));
+    // if less than 1
+    if (i < 0) {
+      return 'Invalid Number';
+    }
+    return parseFloat((bytes / Math.pow(k, i)).toFixed(precision)) + ' ' + sizes[i];
+  }
+}

src/platform/core/common/public-api.ts

@@ -37,3 +37,4 @@ export * from './pipes/time-difference/time-difference.pipe';
 export * from './pipes/bytes/bytes.pipe';
 export * from './pipes/digits/digits.pipe';
 export * from './pipes/truncate/truncate.pipe';
+export * from './pipes/decimal-bytes/decimal-bytes.pipe';