Merge branch 'multiseries_charts_v1' of github.com:metabase/metabase into multiseries_charts_v1

frontend/src/dashboard/components/AddSeriesModal.jsx

@@ -162,8 +162,6 @@ export default class AddSeriesModal extends Component {
 
     render() {
         const { dashcard, cardData, cards } = this.props;
-        const dataset = cardData[dashcard.card.id];
-        const data = dataset && dataset.data;
 
         let error = this.state.error;
 
@@ -192,9 +190,9 @@ export default class AddSeriesModal extends Component {
             enabledCards[c.id] = true;
         }
 
-        let series = this.state.series.map(card => ({
+        let series = [dashcard.card].concat(this.state.series).map(card => ({
             card: card,
-            data: this.props.cardData[card.id].data
+            data: cardData[card.id] && cardData[card.id].data
         })).filter(s => !!s.data);
 
         return (
@@ -204,8 +202,6 @@ export default class AddSeriesModal extends Component {
                     <div className="flex-full relative">
                         <Visualization
                             className="absolute top left bottom right"
-                            card={dashcard.card}
-                            data={data}
                             series={series}
                             isDashboard={true}
                         />

frontend/src/dashboard/components/DashCard.jsx

@@ -12,6 +12,7 @@ import LoadingSpinner from "metabase/components/LoadingSpinner.jsx";
 import Icon from "metabase/components/Icon.jsx";
 
 import cx from "classnames";
+import _ from "underscore";
 
 export default class DashCard extends Component {
     constructor(props, context) {
@@ -53,10 +54,15 @@ export default class DashCard extends Component {
 
     renderCard(CardVisualization) {
         const { dashcard, cardData, isEditing, onAddSeries } = this.props;
-        const dataset = cardData[dashcard.card.id];
-        const data = dataset && dataset.data;
-
-        let error = (dataset && dataset.error) || this.state.error;
+        const cards = [dashcard.card].concat(dashcard.series || []);
+        const series = cards
+            .map(card => ({
+                card: card,
+                data: cardData[card.id] && cardData[card.id].data,
+                error: cardData[card.id] && cardData[card.id].error,
+            }));
+        const errors = series.map(s => s.error).filter(e => e);
+        const error = errors[0] || this.state.error;
 
         if (error) {
             let message;
@@ -76,18 +82,10 @@ export default class DashCard extends Component {
             );
         }
 
-        if (dashcard.card && data) {
-            let series = dashcard.series && dashcard.series
-            .filter(card => !!cardData[card.id])
-            .map(card => ({
-                card: card,
-                data: cardData[card.id].data
-            }));
+        if (series.length > 0 && _.every(series, (s) => s.data)) {
             return (
                 <Visualization
                     className="flex-full"
-                    card={dashcard.card}
-                    data={data}
                     series={series}
                     isDashboard={true}
                     onAddSeries={isEditing && CardVisualization.supportsSeries ? onAddSeries : undefined}

frontend/src/query_builder/QueryVisualization.jsx

@@ -334,8 +334,7 @@ export default class QueryVisualization extends Component {
                     viz = (
                         <Visualization
                             className="full"
-                            card={card}
-                            data={this.props.result.data}
+                            series={[{ card: card, data: this.props.result.data }]}
                             // Table:
                             setSortFn={this.props.setSortFn}
                             cellIsClickableFn={this.props.cellIsClickableFn}

frontend/src/visualizations/Visualization.jsx

@@ -21,9 +21,7 @@ export default class Visualization extends Component {
     }
 
     static propTypes = {
-        card: PropTypes.object.isRequired,
-        data: PropTypes.object.isRequired,
-        series: PropTypes.array,
+        series: PropTypes.array.isRequired,
 
         isDashboard: PropTypes.bool,
 
@@ -42,15 +40,16 @@ export default class Visualization extends Component {
     }
 
     componentWillReceiveProps(newProps) {
-        if (!newProps.data) {
+        let { card, data } = newProps.series[0]
+        if (!data) {
             this.setState({ error: "No data (TODO)" });
-        } else if (!newProps.card.display) {
+        } else if (!card.display) {
             this.setState({ error: "Chart type not set" });
         } else {
-            let CardVisualization = visualizations.get(newProps.card.display);
+            let CardVisualization = visualizations.get(card.display);
             try {
                 if (CardVisualization.checkRenderable) {
-                    CardVisualization.checkRenderable(newProps.data.cols, newProps.data.rows);
+                    CardVisualization.checkRenderable(data.cols, data.rows);
                 }
                 this.setState({ error: null });
             } catch (e) {
@@ -97,10 +96,10 @@ export default class Visualization extends Component {
                 </div>
             );
         } else {
-            let { card, data, series } = this.props;
-            let CardVisualization = visualizations.get(card.display);
+            let { series } = this.props;
+            let CardVisualization = visualizations.get(series[0].card.display);
 
-            series = [{ card, data }].concat(series || []).map(s => ({
+            series = series.map(s => ({
                 ...s,
                 card: {
                     ...s.card,
@@ -112,8 +111,8 @@ export default class Visualization extends Component {
                 <CardVisualization
                     {...this.props}
                     series={series}
-                    card={series[0].card}
-                    data={series[0].data}
+                    card={series[0].card} // convienence for single-series visualizations
+                    data={series[0].data} // convienence for single-series visualizations
                     hovered={this.state.hovered}
                     onUpdateVisualizationSetting={(...args) => console.log("onUpdateVisualizationSetting", args)}
                     onHoverChange={this.onHoverChange}

frontend/src/visualizations/components/CardRenderer.jsx

@@ -56,7 +56,7 @@ export default class CardRenderer extends Component {
                         this.props.onUpdateVisualizationSetting(["map", "zoom"], zoom);
                     };
 
-                    charting.CardRenderer[this.props.chartType](element, card, updateMapCenter, updateMapZoom);
+                    charting.CardRenderer[this.props.chartType](element, { ...this.props, card, updateMapCenter, updateMapZoom });
                 } else {
                     // TODO: it would be nicer if this didn't require the whole card
                     charting.CardRenderer[this.props.chartType](element, this.props);

frontend/src/visualizations/lib/CardRenderer.js

@@ -427,18 +427,18 @@ function lineAndBarOnRender(chart, card) {
 }
 
 export let CardRenderer = {
-    pie(element, { card, data: result, onHoverChange }) {
+    pie(element, { card, data, onHoverChange }) {
         let settings = card.visualization_settings;
-        let data = result.rows.map(row => ({
+        let chartData = data.rows.map(row => ({
             key: row[0],
             value: row[1]
         }));
-        let sumTotalValue = data.reduce((acc, d) => acc + d.value, 0);
+        let sumTotalValue = chartData.reduce((acc, d) => acc + d.value, 0);
 
         // TODO: by default we should set a max number of slices of the pie and group everything else together
 
         // build crossfilter dataset + dimension + base group
-        let dataset = crossfilter(data);
+        let dataset = crossfilter(chartData);
         let dimension = dataset.dimension(d => d.key);
         let group = dimension.group().reduceSum(d => d.value);
         let chart = initializeChart(card, element)
@@ -446,7 +446,7 @@ export let CardRenderer = {
                         .group(group)
                         .colors(settings.pie.colors)
                         .colorCalculator((d, i) => settings.pie.colors[((i * 5) + Math.floor(i / 5)) % settings.pie.colors.length])
-                        .label(row => formatValue(row.key, result.cols[0]))
+                        .label(row => formatValue(row.key, data.cols[0]))
                         .title(d => {
                             // ghetto rounding to 1 decimal digit since Math.round() doesn't let
                             // you specify a precision and always rounds to int
@@ -711,7 +711,7 @@ export let CardRenderer = {
         return chartRenderer;
     },
 
-    pin_map(element, card, updateMapCenter, updateMapZoom) {
+    pin_map(element, { card, updateMapCenter, updateMapZoom }) {
         let query = card.dataset_query;
         let vs = card.visualization_settings;
         let latitude_dataset_col_index = vs.map.latitude_dataset_col_index;

test/metabase/api/dataset_test.clj

@@ -19,6 +19,7 @@
                :last_name $
                :last_login $
                :is_superuser $
+               :is_qbnewb $
                :common_name $}))
 
 (defn remove-ids-and-boolean-timestamps [m]