Cherry-pick big number changes and code cleanup

superset/assets/package.json

@@ -43,14 +43,14 @@
   },
   "homepage": "http://superset.apache.org/",
   "dependencies": {
-    "@data-ui/event-flow": "^0.0.8",
-    "@data-ui/sparkline": "^0.0.49",
+    "@data-ui/event-flow": "^0.0.54",
+    "@data-ui/sparkline": "^0.0.54",
+    "@data-ui/xy-chart": "^0.0.61",
     "@vx/responsive": "0.0.153",
     "babel-register": "^6.24.1",
     "bootstrap": "^3.3.6",
     "bootstrap-slider": "^10.0.0",
-    "brace": "^0.10.0",
-    "brfs": "^1.4.3",
+    "brace": "^0.11.1",
     "classnames": "^2.2.5",
     "d3": "^3.5.17",
     "d3-cloud": "^1.2.1",
@@ -61,7 +61,6 @@
     "datamaps": "^0.5.8",
     "datatables.net-bs": "^1.10.15",
     "deck.gl": "^5.1.4",
-    "deep-equal": "^1.0.1",
     "distributions": "^1.0.0",
     "dnd-core": "^2.6.0",
     "dompurify": "^1.0.3",
@@ -79,13 +78,8 @@
     "moment": "^2.20.1",
     "mousetrap": "^1.6.1",
     "mustache": "^2.2.1",
-    "npm": "^5.7.1",
     "nvd3": "1.8.6",
-    "object.entries": "^1.0.4",
-    "object.keys": "^0.1.0",
-    "object.values": "^1.0.4",
     "parse-iso-duration": "^1.0.0",
-    "po2json": "^0.4.5",
     "prop-types": "^15.6.0",
     "re-resizable": "^4.3.1",
     "react": "^15.6.2",
@@ -162,6 +156,7 @@
     "mini-css-extract-plugin": "^0.4.0",
     "mocha": "^3.2.0",
     "npm-check-updates": "^2.14.0",
+    "po2json": "^0.4.5",
     "prettier": "^1.12.1",
     "react-addons-test-utils": "^15.6.2",
     "react-test-renderer": "^15.6.2",

superset/assets/src/explore/controls.jsx

@@ -1459,6 +1459,22 @@ export const controls = {
     description: t('Whether to display the metric name as a title'),
   },
 
+  show_trend_line: {
+    type: 'CheckboxControl',
+    label: t('Show Trend Line'),
+    renderTrigger: true,
+    default: true,
+    description: t('Whether to display the trend line'),
+  },
+
+  start_y_axis_at_zero: {
+    type: 'CheckboxControl',
+    label: t('Start y-axis at 0'),
+    renderTrigger: true,
+    default: true,
+    description: t('Start y-axis at zero. Uncheck to start y-axis at minimum value in the data.'),
+  },
+
   x_axis_showminmax: {
     type: 'CheckboxControl',
     label: t('X bounds'),

superset/assets/src/explore/visTypes.jsx

@@ -1243,6 +1243,7 @@ export const visTypes = {
         controlSetRows: [
           ['compare_lag', 'compare_suffix'],
           ['y_axis_format', null],
+          ['show_trend_line', 'start_y_axis_at_zero'],
         ],
       },
     ],

superset/assets/src/modules/visUtils.js

@@ -1,14 +1,105 @@
-export function getTextWidth(text, fontDetails = '12px Roboto') {
-  const canvas = document.createElement('canvas');
-  const context = canvas.getContext('2d');
-  if (context) {
-    // Won't work outside of a browser context (ie unit tests)
-    context.font = fontDetails;
-    return context.measureText(text).width;
+const SVG_NS = 'http://www.w3.org/2000/svg';
+
+function isDefined(x) {
+  return x !== null && x !== undefined;
+}
+
+export function getTextDimension({
+  text,
+  className,
+  style,
+  container = document.body,
+}) {
+  const textNode = document.createElementNS(SVG_NS, 'text');
+  textNode.textContent = text;
+
+  if (isDefined(className)) {
+    textNode.setAttribute('class', className);
+  }
+
+  if (isDefined(style)) {
+    ['font', 'fontWeight', 'fontStyle', 'fontSize', 'fontFamily']
+      .filter(field => isDefined(style[field]))
+      .forEach((field) => {
+        textNode.style[field] = style[field];
+      });
+  }
+
+  const svg = document.createElementNS(SVG_NS, 'svg');
+  svg.style.position = 'absolute'; // so it won't disrupt page layout
+  svg.style.opacity = 0;           // and not visible
+  svg.appendChild(textNode);
+  container.appendChild(svg);
+  let result;
+  if (textNode.getBBox) {
+    const bbox = textNode.getBBox();
+    // round up
+    result = {
+      width: Math.ceil(bbox.width),
+      height: Math.ceil(bbox.height),
+    };
+  } else {
+    // Handle when called from non-browser and do not support getBBox()
+    result = {
+      width: 100,
+      height: 100,
+    };
   }
-  return 100;
+  container.removeChild(svg);
+  return result;
+}
+
+/**
+ * Shim to support legacy calls
+ */
+export function getTextWidth(text, font = '12px Roboto') {
+  return getTextDimension({ text, style: { font } }).width;
 }
 
-export default {
-  getTextWidth,
-};
+export function computeMaxFontSize({
+  text,
+  idealFontSize,
+  maxWidth,
+  maxHeight,
+  className,
+  style,
+  container,
+}) {
+  let size = idealFontSize;
+  if (!isDefined(idealFontSize)) {
+    if (isDefined(maxHeight)) {
+      size = Math.floor(maxHeight);
+    } else {
+      throw new Error('You must specify at least one of maxHeight or idealFontSize');
+    }
+  }
+
+  function computeDimension(fontSize) {
+    return getTextDimension({
+      text,
+      className,
+      style: { ...style, fontSize },
+      container,
+    });
+  }
+
+  let textDimension = computeDimension(size);
+
+  // Decrease size until textWidth is less than maxWidth
+  if (isDefined(maxWidth)) {
+    while (textDimension.width > maxWidth) {
+      size -= 2;
+      textDimension = computeDimension(size);
+    }
+  }
+
+  // Decrease size until textHeight is less than maxHeight
+  if (isDefined(maxHeight)) {
+    while (textDimension.height > maxHeight) {
+      size -= 2;
+      textDimension = computeDimension(size);
+    }
+  }
+
+  return size;
+}

superset/assets/src/reduxUtils.js

@@ -1,7 +1,7 @@
 import shortid from 'shortid';
 import { compose } from 'redux';
 import persistState from 'redux-localstorage';
-import equals from 'deep-equal';
+import { isEqual } from 'underscore';
 
 export function addToObject(state, arrKey, obj) {
   const newObject = Object.assign({}, state[arrKey]);
@@ -95,5 +95,5 @@ export function areArraysShallowEqual(arr1, arr2) {
 }
 
 export function areObjectsEqual(obj1, obj2) {
-  return equals(obj1, obj2, true);
+  return isEqual(obj1, obj2);
 }