refactoring alias by

This commit is contained in:
Erik Sundell 2019-01-11 10:29:53 +01:00
parent b64115e5f5
commit 3871ef29f9

View File

@ -11,9 +11,11 @@ export interface State {
} }
export class AliasBy extends Component<Props, State> { export class AliasBy extends Component<Props, State> {
propagateOnChange: (value) => void;
constructor(props) { constructor(props) {
super(props); super(props);
this.updateQuery = debounce(this.updateQuery.bind(this), 500); this.propagateOnChange = debounce(this.props.onChange, 500);
this.state = { value: '' }; this.state = { value: '' };
} }
@ -29,16 +31,12 @@ export class AliasBy extends Component<Props, State> {
onChange(e) { onChange(e) {
this.setState({ value: e.target.value }); this.setState({ value: e.target.value });
this.updateQuery(e.target.value); this.propagateOnChange(e.target.value);
}
updateQuery(value) {
this.props.onChange(value);
} }
render() { render() {
return ( return (
<React.Fragment> <>
<div className="gf-form-inline"> <div className="gf-form-inline">
<div className="gf-form"> <div className="gf-form">
<label className="gf-form-label query-keyword width-9">Alias By</label> <label className="gf-form-label query-keyword width-9">Alias By</label>
@ -53,7 +51,7 @@ export class AliasBy extends Component<Props, State> {
<div className="gf-form-label gf-form-label--grow" /> <div className="gf-form-label gf-form-label--grow" />
</div> </div>
</div> </div>
</React.Fragment> </>
); );
} }
} }