Time Series Annotation Layers (#3521)

* Adding annotations to backend

* Auto fetching Annotations on the backend

* Closing the loop

* Adding missing files

* annotation layers UI

for https://github.com/apache/incubator-superset/issues/3502

* a few fixes per code review.

- add annotation input sanity check before add and before update.
- make SelectAsyncControl component statelesis, and generic
- add annotation description in d3 tool tip
- use less variable to replace hard-coded color

superset/assets/javascripts/explore/components/Control.jsx

@@ -3,15 +3,16 @@ import PropTypes from 'prop-types';
 
 import BoundsControl from './controls/BoundsControl';
 import CheckboxControl from './controls/CheckboxControl';
+import ColorSchemeControl from './controls/ColorSchemeControl';
 import DatasourceControl from './controls/DatasourceControl';
 import DateFilterControl from './controls/DateFilterControl';
 import FilterControl from './controls/FilterControl';
 import HiddenControl from './controls/HiddenControl';
+import SelectAsyncControl from './controls/SelectAsyncControl';
 import SelectControl from './controls/SelectControl';
 import TextAreaControl from './controls/TextAreaControl';
 import TextControl from './controls/TextControl';
 import VizTypeControl from './controls/VizTypeControl';
-import ColorSchemeControl from './controls/ColorSchemeControl';
 
 const controlMap = {
   BoundsControl,
@@ -25,6 +26,7 @@ const controlMap = {
   TextControl,
   VizTypeControl,
   ColorSchemeControl,
+  SelectAsyncControl,
 };
 const controlTypes = Object.keys(controlMap);
 

superset/assets/javascripts/explore/components/controls/SelectAsyncControl.jsx

@@ -0,0 +1,53 @@
+/* global notify */
+import React from 'react';
+import PropTypes from 'prop-types';
+import Select from '../../../components/AsyncSelect';
+import { t } from '../../../locales';
+
+const propTypes = {
+  dataEndpoint: PropTypes.string.isRequired,
+  multi: PropTypes.bool,
+  mutator: PropTypes.func,
+  onAsyncErrorMessage: PropTypes.string,
+  onChange: PropTypes.func,
+  placeholder: PropTypes.string,
+  value: PropTypes.oneOfType([
+    PropTypes.string,
+    PropTypes.number,
+    PropTypes.arrayOf(PropTypes.string),
+    PropTypes.arrayOf(PropTypes.number),
+  ]),
+};
+
+const defaultProps = {
+  multi: true,
+  onAsyncErrorMessage: t('Error while fetching data'),
+  onChange: () => {},
+  placeholder: t('Select ...'),
+};
+
+const SelectAsyncControl = ({ value, onChange, dataEndpoint,
+                              multi, mutator, placeholder, onAsyncErrorMessage }) => {
+  const onSelectionChange = (options) => {
+    const optionValues = options.map(option => option.value);
+    onChange(optionValues);
+  };
+
+  return (
+    <Select
+      dataEndpoint={dataEndpoint}
+      onChange={onSelectionChange}
+      onAsyncError={() => notify.error(onAsyncErrorMessage)}
+      mutator={mutator}
+      multi={multi}
+      value={value}
+      placeholder={placeholder}
+      valueRenderer={v => (<div>{v.label}</div>)}
+    />
+  );
+};
+
+SelectAsyncControl.propTypes = propTypes;
+SelectAsyncControl.defaultProps = defaultProps;
+
+export default SelectAsyncControl;