[deck_polyline] show metric in geohash (apache#5952)

Also improved security a bit by calling `dompurify.sanitize` down the stack.
lyft · Sep 21, 2018 · 70c095b · 70c095b
1 parent a1fa4bc
commit 70c095b
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 7 deletions.
diff --git a/superset/assets/src/chart/Chart.jsx b/superset/assets/src/chart/Chart.jsx
@@ -1,6 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import { Tooltip } from 'react-bootstrap';
+import dompurify from 'dompurify';
 
 import ChartBody from './ChartBody';
 import Loading from '../components/Loading';
@@ -180,9 +181,13 @@ class Chart extends React.PureComponent {
           positionLeft={this.state.tooltip.x + 30}
           arrowOffsetTop={10}
         >
-          <div // eslint-disable-next-line react/no-danger
-            dangerouslySetInnerHTML={{ __html: this.state.tooltip.content }}
-          />
+          {typeof (this.state.tooltip.content) === 'string' ?
+            <div // eslint-disable-next-line react/no-danger
+              dangerouslySetInnerHTML={{ __html: dompurify.sanitize(this.state.tooltip.content) }}
+            />
+            :
+            this.state.tooltip.content
+          }
         </Tooltip>
       );
     }

diff --git a/...rc/visualizations/deckgl/layers/common.js → ...c/visualizations/deckgl/layers/common.jsx b/...rc/visualizations/deckgl/layers/common.js → ...c/visualizations/deckgl/layers/common.jsx
@@ -1,4 +1,4 @@
-import dompurify from 'dompurify';
+import React from 'react';
 import { fitBounds } from 'viewport-mercator-project';
 import d3 from 'd3';
 
@@ -37,10 +37,14 @@ export function commonLayerProps(formData, slice) {
   let onHover;
   let tooltipContentGenerator;
   if (fd.js_tooltip) {
-    const unsanitizedTooltipGenerator = sandboxedEval(fd.js_tooltip);
-    tooltipContentGenerator = o => dompurify.sanitize(unsanitizedTooltipGenerator(o));
+    tooltipContentGenerator = sandboxedEval(fd.js_tooltip);
   } else if (fd.line_column && fd.line_type === 'geohash') {
-    tooltipContentGenerator = o => `${fd.line_column}: ${o.object[fd.line_column]}`;
+    tooltipContentGenerator = o => (
+      <div>
+        <div>{fd.line_column}: <strong>{o.object[fd.line_column]}</strong></div>
+        {fd.metric &&
+          <div>{fd.metric}: <strong>{o.object[fd.metric]}</strong></div>}
+      </div>);
   }
   if (tooltipContentGenerator) {
     onHover = (o) => {