From 2c28ee7c2434dbf743022dd15bdc7a7ef684055d Mon Sep 17 00:00:00 2001
From: Maxime Beauchemin <maxime.beauchemin@apache.org>
Date: Wed, 4 Oct 2017 16:51:40 -0700
Subject: [PATCH] [time_table] adding support for URLs / links

Using Mustache templating and providing {{ metric }} as well as
{{ ...formData }} as context.
---
 superset/assets/javascripts/components/MetricOption.jsx | 9 +++++----
 superset/assets/javascripts/explore/stores/visTypes.js  | 6 ++++++
 superset/assets/visualizations/time_table.jsx           | 8 ++++++--
 3 files changed, 17 insertions(+), 6 deletions(-)

diff --git a/superset/assets/javascripts/components/MetricOption.jsx b/superset/assets/javascripts/components/MetricOption.jsx
index f0994142569b..d952b06aec6e 100644
--- a/superset/assets/javascripts/components/MetricOption.jsx
+++ b/superset/assets/javascripts/components/MetricOption.jsx
@@ -6,17 +6,18 @@ import InfoTooltipWithTrigger from './InfoTooltipWithTrigger';
 const propTypes = {
   metric: PropTypes.object.isRequired,
   showFormula: PropTypes.bool,
+  url: PropTypes.string,
 };
 const defaultProps = {
   showFormula: true,
 };
 
-export default function MetricOption({ metric, showFormula }) {
+export default function MetricOption({ metric, showFormula, url }) {
+  const verbose = metric.verbose_name || metric.metric_name;
+  const link = url ? <a href={url}>{verbose}</a> : verbose;
   return (
     <div>
-      <span className="m-r-5 option-label">
-        {metric.verbose_name || metric.metric_name}
-      </span>
+      <span className="m-r-5 option-label">{link}</span>
       {metric.description &&
         <InfoTooltipWithTrigger
           className="m-r-5 text-muted"
diff --git a/superset/assets/javascripts/explore/stores/visTypes.js b/superset/assets/javascripts/explore/stores/visTypes.js
index ca8a63f20bf5..8f45dbec17b7 100644
--- a/superset/assets/javascripts/explore/stores/visTypes.js
+++ b/superset/assets/javascripts/explore/stores/visTypes.js
@@ -378,6 +378,7 @@ export const visTypes = {
         controlSetRows: [
           ['groupby', 'metrics'],
           ['column_collection'],
+          ['url'],
         ],
       },
     ],
@@ -385,6 +386,11 @@ export const visTypes = {
       groupby: {
         multiple: false,
       },
+      url: {
+        label: t(
+          "Templated link, it's possible to include {{ metric }} " +
+          'or other values coming from the controls.'),
+      },
     },
   },
 
diff --git a/superset/assets/visualizations/time_table.jsx b/superset/assets/visualizations/time_table.jsx
index 89e9676a7313..986bedff99e7 100644
--- a/superset/assets/visualizations/time_table.jsx
+++ b/superset/assets/visualizations/time_table.jsx
@@ -4,6 +4,7 @@ import propTypes from 'prop-types';
 import { Table, Thead, Th } from 'reactable';
 import d3 from 'd3';
 import { Sparkline, LineSeries } from '@data-ui/sparkline';
+import Mustache from 'mustache';
 
 import MetricOption from '../javascripts/components/MetricOption';
 import TooltipWrapper from '../javascripts/components/TooltipWrapper';
@@ -55,10 +56,13 @@ function viz(slice, payload) {
   }
   const tableData = metrics.map((metric) => {
     let leftCell;
+    const context = Object.assign({}, fd, { metric });
+    const url = fd.url ? Mustache.render(fd.url, context) : null;
+
     if (!payload.data.is_group_by) {
-      leftCell = <MetricOption metric={metricMap[metric]} showFormula={false} />;
+      leftCell = <MetricOption metric={metricMap[metric]} url={url}showFormula={false} />;
     } else {
-      leftCell = metric;
+      leftCell = url ? <a href={url}>{metric}</a> : metric;
     }
     const row = { metric: leftCell };
     fd.column_collection.forEach((c) => {