[bugfix] line_multi chart crashed on chosen (#5568) (#5572)

* Fix bug for line_multi

* refactor forEach to map

* reorder fields

* fix issue with datasource

superset/assets/src/explore/components/DisplayQueryButton.jsx

@@ -39,13 +39,14 @@ const defaultProps = {
 export default class DisplayQueryButton extends React.PureComponent {
   constructor(props) {
     super(props);
+    const { datasource } = props.latestQueryFormData;
     this.state = {
       language: null,
       query: null,
       data: null,
       isLoading: false,
       error: null,
-      sqlSupported: props.latestQueryFormData.datasource.split('__')[1] === 'table',
+      sqlSupported: datasource && datasource.split('__')[1] === 'table',
     };
     this.beforeOpen = this.beforeOpen.bind(this);
   }

superset/assets/src/explore/visTypes.jsx

@@ -274,21 +274,14 @@ export const visTypes = {
       },
     },
     sectionOverrides: {
-      datasourceAndVizType: {
-        label: t('Chart Type'),
-        controlSetRows: [
-          ['viz_type'],
-          ['slice_id', 'cache_timeout'],
-        ],
-      },
       sqlaTimeSeries: {
         controlSetRows: [
-          ['since', 'until'],
+          ['time_range'],
         ],
       },
       druidTimeSeries: {
         controlSetRows: [
-          ['since', 'until'],
+          ['time_range'],
         ],
       },
     },

superset/assets/src/visualizations/line_multi.js

@@ -12,12 +12,11 @@ export default function lineMulti(slice, payload) {
   const fd = slice.formData;
 
   // fetch data from all the charts
-  const promises = [];
   const subslices = [
     ...payload.data.slices.axis1.map(subslice => [1, subslice]),
     ...payload.data.slices.axis2.map(subslice => [2, subslice]),
   ];
-  subslices.forEach(([yAxis, subslice]) => {
+  const promises = subslices.map(([yAxis, subslice]) => {
     let filters = subslice.form_data.filters || [];
     filters.concat(fd.filters);
     if (fd.extra_filters) {
@@ -26,27 +25,25 @@ export default function lineMulti(slice, payload) {
     const fdCopy = {
       ...subslice.form_data,
       filters,
-      since: fd.since,
-      until: fd.until,
+      time_range: fd.time_range,
     };
     const url = getExploreLongUrl(fdCopy, 'json');
-    promises.push(new Promise((resolve, reject) => {
+    return new Promise((resolve, reject) => {
       d3.json(url, (error, response) => {
         if (error) {
           reject(error);
         } else {
-          const data = [];
-          response.data.forEach((datum) => {
-            let key = datum.key;
-            if (fd.prefix_metric_with_slice_name) {
-              key = subslice.slice_name + ': ' + key;
-            }
-            data.push({ key, values: datum.values, type: fdCopy.viz_type, yAxis });
-          });
+          const addPrefix = fd.prefix_metric_with_slice_name;
+          const data = response.data.map(({ key, values }) => ({
+            key: addPrefix ? `${subslice.slice_name}: ${key}` : key,
+            type: fdCopy.viz_type,
+            values,
+            yAxis,
+          }));
           resolve(data);
         }
       });
-    }));
+    });
   });
 
   Promise.all(promises).then((data) => {