forked from getredash/redash
-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathQueryBasedParameterInput.jsx
More file actions
85 lines (74 loc) · 2.26 KB
/
QueryBasedParameterInput.jsx
File metadata and controls
85 lines (74 loc) · 2.26 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
import { find, isFunction } from 'lodash';
import React from 'react';
import PropTypes from 'prop-types';
import { react2angular } from 'react2angular';
import Select from 'antd/lib/select';
import { Query } from '@/services/query';
const { Option } = Select;
export class QueryBasedParameterInput extends React.Component {
static propTypes = {
value: PropTypes.any, // eslint-disable-line react/forbid-prop-types
queryId: PropTypes.number,
onSelect: PropTypes.func,
className: PropTypes.string,
};
static defaultProps = {
value: null,
queryId: null,
onSelect: () => {},
className: '',
};
constructor(props) {
super(props);
this.state = {
options: [],
loading: false,
};
}
componentDidMount() {
this._loadOptions(this.props.queryId);
}
// eslint-disable-next-line no-unused-vars
componentWillReceiveProps(nextProps) {
if (nextProps.queryId !== this.props.queryId) {
this._loadOptions(nextProps.queryId, nextProps.value);
}
}
_loadOptions(queryId) {
if (queryId && (queryId !== this.state.queryId)) {
this.setState({ loading: true });
Query.dropdownOptions({ id: queryId }, (options) => {
if (this.props.queryId === queryId) {
this.setState({ options, loading: false });
const found = find(options, option => option.value === this.props.value) !== undefined;
if (!found && isFunction(this.props.onSelect)) {
this.props.onSelect(options[0].value);
}
}
});
}
}
render() {
const { className, value, onSelect } = this.props;
const { loading, options } = this.state;
return (
<span>
<Select
className={className}
disabled={loading || (options.length === 0)}
loading={loading}
defaultValue={value}
onChange={onSelect}
dropdownMatchSelectWidth={false}
dropdownClassName="ant-dropdown-in-bootstrap-modal"
>
{options.map(option => (<Option value={option.value} key={option.value}>{option.name}</Option>))}
</Select>
</span>
);
}
}
export default function init(ngModule) {
ngModule.component('queryBasedParameterInput', react2angular(QueryBasedParameterInput));
}
init.init = true;