From dc9d0a0d40d971e8e4a3a87ff701874542e8f5c4 Mon Sep 17 00:00:00 2001
From: Ville Brofeldt <33317356+villebro@users.noreply.github.com>
Date: Mon, 26 Aug 2019 20:07:57 +0300
Subject: [PATCH] feat: add duration formatter (#209)

* feat: add duration formatter

* fix: address review comments
---
 .../superset-ui-number-format/package.json    |  3 +-
 .../src/factories/createDurationFormatter.ts  | 20 ++++++++++++
 .../superset-ui-number-format/src/index.ts    |  1 +
 .../factories/createDurationFormatter.test.ts | 32 +++++++++++++++++++
 .../test/index.test.ts                        |  2 ++
 5 files changed, 57 insertions(+), 1 deletion(-)
 create mode 100644 superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/factories/createDurationFormatter.ts
 create mode 100644 superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/factories/createDurationFormatter.test.ts

diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/package.json b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/package.json
index 8cccad979a56..4cbae7307472 100644
--- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/package.json
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/package.json
@@ -27,7 +27,8 @@
   },
   "dependencies": {
     "@types/d3-format": "^1.3.0",
-    "d3-format": "^1.3.2"
+    "d3-format": "^1.3.2",
+    "pretty-ms": "^5.0.0"
   },
   "peerDependencies": {
     "@superset-ui/core": "^0.12.0"
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/factories/createDurationFormatter.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/factories/createDurationFormatter.ts
new file mode 100644
index 000000000000..0f1da64eb929
--- /dev/null
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/factories/createDurationFormatter.ts
@@ -0,0 +1,20 @@
+import prettyMsFormatter from 'pretty-ms';
+import NumberFormatter from '../NumberFormatter';
+
+export default function createDurationFormatter(
+  config: {
+    description?: string;
+    id?: string;
+    label?: string;
+    multiplier?: number;
+  } & prettyMsFormatter.Options = {},
+) {
+  const { description, id, label, multiplier = 1, ...prettyMsOptions } = config;
+
+  return new NumberFormatter({
+    description,
+    formatFunc: value => prettyMsFormatter(value * multiplier, prettyMsOptions),
+    id: id || 'duration_format',
+    label: label || `Duration formatter`,
+  });
+}
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/index.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/index.ts
index eb9cbfa19ebe..95cde2a2a483 100644
--- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/index.ts
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/src/index.ts
@@ -8,6 +8,7 @@ export {
 } from './NumberFormatterRegistrySingleton';
 
 export { default as createD3NumberFormatter } from './factories/createD3NumberFormatter';
+export { default as createDurationFormatter } from './factories/createDurationFormatter';
 export {
   default as createSiAtMostNDigitFormatter,
 } from './factories/createSiAtMostNDigitFormatter';
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/factories/createDurationFormatter.test.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/factories/createDurationFormatter.test.ts
new file mode 100644
index 000000000000..c278d1412f23
--- /dev/null
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/factories/createDurationFormatter.test.ts
@@ -0,0 +1,32 @@
+import NumberFormatter from '../../src/NumberFormatter';
+import createDurationFormatter from '../../src/factories/createDurationFormatter';
+
+describe('createDurationFormatter()', () => {
+  it('creates an instance of NumberFormatter', () => {
+    const formatter = createDurationFormatter();
+    expect(formatter).toBeInstanceOf(NumberFormatter);
+  });
+  it('format milliseconds in human readable format with default options', () => {
+    const formatter = createDurationFormatter();
+    expect(formatter(0)).toBe('0ms');
+    expect(formatter(1000)).toBe('1s');
+    expect(formatter(1337)).toBe('1.3s');
+    expect(formatter(10500)).toBe('10.5s');
+    expect(formatter(60 * 1000)).toBe('1m');
+    expect(formatter(90 * 1000)).toBe('1m 30s');
+  });
+  it('format seconds in human readable format with default options', () => {
+    const formatter = createDurationFormatter({ multiplier: 1000 });
+    expect(formatter(0.5)).toBe('500ms');
+    expect(formatter(1)).toBe('1s');
+    expect(formatter(30)).toBe('30s');
+    expect(formatter(60)).toBe('1m');
+    expect(formatter(90)).toBe('1m 30s');
+  });
+  it('format milliseconds in human readable format with additional pretty-ms options', () => {
+    const zeroDecimalFormatter = createDurationFormatter({ secondsDecimalDigits: 0 });
+    expect(zeroDecimalFormatter(10500)).toBe('11s');
+    const subMillisecondFormatter = createDurationFormatter({ formatSubMilliseconds: true });
+    expect(subMillisecondFormatter(100.40008)).toBe('100ms 400µs 80ns');
+  });
+});
diff --git a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/index.test.ts b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/index.test.ts
index 433e14e9e264..ffbebc52e9d3 100644
--- a/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/index.test.ts
+++ b/superset-frontend/temporary_superset_ui/superset-ui/packages/superset-ui-number-format/test/index.test.ts
@@ -1,5 +1,6 @@
 import {
   createD3NumberFormatter,
+  createDurationFormatter,
   createSiAtMostNDigitFormatter,
   formatNumber,
   getNumberFormatter,
@@ -13,6 +14,7 @@ describe('index', () => {
   it('exports modules', () => {
     [
       createD3NumberFormatter,
+      createDurationFormatter,
       createSiAtMostNDigitFormatter,
       formatNumber,
       getNumberFormatter,