fix: onSave datasource raises React error (#8049)

* fix: datasource save raises React error

* add test

superset/assets/spec/javascripts/explore/components/MetricsControl_spec.jsx

@@ -368,5 +368,12 @@ describe('MetricsControl', () => {
       wrapper.setProps({ ...props, columns: [] });
       expect(onChange.calledOnce).toEqual(false);
     });
+    it('Does not fail if no columns or savedMetrics are passed', () => {
+      const { wrapper } = setup({
+        savedMetrics: null,
+        columns: null,
+      });
+      expect(wrapper.exists('.metrics-select')).toEqual(true);
+    });
   });
 });

superset/assets/src/explore/components/controls/MetricsControl.jsx

@@ -54,6 +54,8 @@ const propTypes = {
 const defaultProps = {
   onChange: () => {},
   clearable: true,
+  savedMetrics: [],
+  columns: [],
 };
 
 function isDictionaryForAdhocMetric(value) {
@@ -62,7 +64,7 @@ function isDictionaryForAdhocMetric(value) {
 
 function columnsContainAllMetrics(value, nextProps) {
   const columnNames = new Set(
-    [...nextProps.columns, ...nextProps.savedMetrics]
+    [...(nextProps.columns || []), ...(nextProps.savedMetrics || [])]
     // eslint-disable-next-line camelcase
       .map(({ column_name, metric_name }) => (column_name || metric_name)),
   );
@@ -243,7 +245,7 @@ export default class MetricsControl extends React.PureComponent {
       Object.keys(AGGREGATES).map(aggregate => ({ aggregate_name: aggregate })) :
       [];
     const options = [
-      ...columns,
+      ...(columns || []),
       ...aggregates,
       ...(savedMetrics || []),
     ];