Merge pull request airbnb#10 from drivetribe/approx-number

Adding number formatter package

Author: OlivierCo

utils/number-formatters/.babelrc

@@ -0,0 +1,7 @@
+{
+  "presets": [
+    "es2015",
+    "react",
+    "stage-2"
+  ]
+}

utils/number-formatters/.eslintrc

@@ -0,0 +1,34 @@
+{
+    "parser": "babel-eslint",
+    "extends": "airbnb",
+    "env": {
+        "browser": true,
+        "node": true,
+        "mocha": true
+    },
+    "ecmaFeatures": {
+        "forOf": true,
+        "jsx": true,
+        "es6": true,
+        "experimentalObjectRestSpread": true,
+        "modules": true
+    },
+    "rules": {
+        "comma-dangle": 0,
+        "max-len": [1, {"code": 120}],
+        "indent": [2, 2, {"SwitchCase": 1}],
+        "react/prop-types": 0,
+        "global-require": 0,
+        "prefer-template": 0
+    },
+    "plugins": [
+        "flowtype",
+        "jsx-a11y",
+        "react"
+    ],
+    "settings": {
+        "flowtype": {
+            "onlyFilesWithFlowAnnotation": false
+        }
+    }
+}

utils/number-formatters/.gitignore

@@ -0,0 +1,3 @@
+node_modules
+npm-debug.log
+lib

utils/number-formatters/.npmignore

@@ -0,0 +1,3 @@
+# folder to not push to npmjs
+src/
+node_modules/

utils/number-formatters/.travis.yml

@@ -0,0 +1,11 @@
+# language: node_js
+#
+# node_js:
+#   - 6.0.0
+#
+# install:
+#   - npm install
+# script:
+#   - npm run compile
+# after_success:
+#   - npm run semantic-release

utils/number-formatters/README.md

@@ -0,0 +1,45 @@
+# @drivetribe/utils-number-formatters
+
+Collection of number formatter functions to change numbers and dates for display purposes.
+
+## Installation
+
+Install the module directly from npm:
+
+```
+npm install @drivetribe/utils-number-formatters --save
+```
+
+## Formatters
+
+### Approximate
+
+Approximates large numbers, ie 6426 -> "6.4K".
+
+`approximate(quant: number||string): string`
+
+#### Example
+
+```js
+import { approximate } from '@drivetribe/utils-number-formatters';
+
+approximate(5134924); // "5.1M"
+approximate("5134924"); // "5.1M"
+```
+
+Rounds numbers greater than 1000, up to the millions.
+
+### Round to decimal place
+
+Rounds a number to a given decimal place.
+
+`roundToDecimalPlace(quant: number, roundTo: number): number`
+
+#### Example
+
+```js
+import { roundToDecimalPlace } from '@drivetribe/utils-number-formatters';
+
+roundToDecimalPlace(12.34567, 1); // 12.3
+roundToDecimalPlace(12.34567, 2); // 12.35
+```

utils/number-formatters/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "@drivetribe/utils-number-formatters",
+  "version": "1.0.0",
+  "description": "Selection of simple tools to format numbers for display purposes",
+  "main": "lib/index.js",
+  "scripts": {
+    "build": "npm run lint && npm run test && babel src --out-dir lib",
+    "semantic-release": "semantic-release pre && npm publish && semantic-release post",
+    "test": "mocha --compilers js:babel-register",
+    "lint": "eslint src"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/drivetribe/javascript-packages/"
+  },
+  "author": "Matt Perry",
+  "license": "ISC",
+  "devDependencies": {
+    "babel-cli": "^6.9.0",
+    "babel-eslint": "^6.0.4",
+    "babel-preset-es2015": "^6.9.0",
+    "babel-preset-react": "^6.5.0",
+    "babel-preset-stage-2": "^6.5.0",
+    "babel-register": "^6.9.0",
+    "eslint": "^2.10.2",
+    "eslint-config-airbnb": "^9.0.1",
+    "eslint-plugin-flowtype": "^2.2.7",
+    "eslint-plugin-import": "^1.8.0",
+    "eslint-plugin-jsx-a11y": "^1.2.0",
+    "eslint-plugin-react": "^5.1.1",
+    "semantic-release": "^4.3.5"
+  }
+}

utils/number-formatters/src/index.js

@@ -0,0 +1,34 @@
+const MILLION = 1000000;
+const THOUSAND = 1000;
+const MILLION_THRESHOLD = MILLION * 0.99;
+
+/**
+ * Round a number to the given number of decimal places
+ * @param  {number} num     Number to round
+ * @param  {number} roundTo Round to this many places (Default: 2)
+ * @return {number}         Rounded number
+ */
+export function roundToDecimalPlace(num, roundTo = 2) {
+  const factor = 10 * roundTo;
+  return Math.round(num * factor) / factor;
+}
+
+/**
+ * Convert a large number to a display-friendly approximation.
+ * @param  {number||string} num Number to convert
+ * @return {string} Approximated number
+ */
+export function approximate(num) {
+  const parsedNum = (typeof num === 'string') ? parseInt(num, 10) : num;
+
+  // Between 1,000 and 1,000,000
+  if (parsedNum >= THOUSAND && parsedNum < MILLION_THRESHOLD) {
+    return roundToDecimalPlace(parsedNum / THOUSAND, 1) + 'K';
+
+  // Above 1,000,000
+  } else if (parsedNum >= MILLION_THRESHOLD) {
+    return roundToDecimalPlace(parsedNum / MILLION, 1) + 'M';
+  }
+
+  return `${parsedNum}`;
+}

utils/number-formatters/test/test.js

@@ -0,0 +1,48 @@
+import chai from 'chai';
+import {
+  approximate,
+  roundToDecimalPlace
+} from '../src';
+
+const { expect } = chai;
+
+describe('approximate()', () => {
+  it('should accept both strings and numbers', () => {
+    expect(approximate("0")).to.equal("0");
+    expect(approximate(0)).to.equal("0");
+  });
+
+  it('should not approximate numbers under a thousand', () => {
+    expect(approximate(100)).to.equal("100");
+    expect(approximate(999)).to.equal("999");
+  });
+
+  it('should approximate numbers above 1000 and under 990000 to the closest thousand', () => {
+    expect(approximate(1000)).to.equal("1K");
+    expect(approximate(989999)).to.equal("990K");
+  });
+
+  it('should approximate numbers above 990000 to the closest million', () => {
+    expect(approximate(990000)).to.equal("1M");
+  });
+
+  it('should round up to one decimal place and not show that decimal if it is a zero', () => {
+    expect(approximate(1449)).to.equal("1.4K");
+    expect(approximate(1450)).to.equal("1.5K");
+    expect(approximate(10560000)).to.equal("10.6M");
+    expect(approximate(10990000)).to.equal("11M");
+  });
+});
+
+describe('roundToDecimalPlace()', () => {
+  const TEST_NUMBER = 12.34567;
+
+  it('should round a number to the given number of decimal places', () => {
+    expect(roundToDecimalPlace(TEST_NUMBER, 1)).to.equal(12.3);
+    expect(roundToDecimalPlace(TEST_NUMBER, 2)).to.equal(12.35);
+  });
+  
+  it('should round to 2 decimal places by default', () => {
+    expect(roundToDecimalPlace(TEST_NUMBER)).to.equal(12.35);
+  });
+});