Commit d7deb5df authored by Viacheslav Pavlov's avatar Viacheslav Pavlov
Browse files

Merge branch '218-sid-autocompleter-delay' into 'master'

Resolve "SID autocompleter delay"

Closes #218

See merge request genesys-pgr/genesys-ui!226
parents a8ab230b 70d0d7cf
import * as React from 'react';
import { translate } from 'react-i18next';
import { debounce } from 'debounce';
import MenuItem from '@material-ui/core/MenuItem';
import Menu from '@material-ui/core/Menu';
import TextField from '@material-ui/core/TextField';
......@@ -77,12 +78,16 @@ class DatasetCreatorAutocompleteField extends React.Component<IDatasetCreatorAut
}
private handleInputChange = (e) => {
const {input, autocompleteCreators} = this.props;
autocompleteCreators(e.target.value)
.then((creators) => this.setState({ suggestions: creators }));
const { input } = this.props;
this.doAutocomplete(e.target.value);
input.onChange(e.target.value);
}
private doAutocomplete = debounce((value) => {
this.props.autocompleteCreators(value)
.then((creators) => this.setState({ suggestions: creators }));
}, 1000);
private select = (datasetCreator) => {
const { updateDatasetCreator } = this.props;
updateDatasetCreator(datasetCreator);
......
......@@ -3,6 +3,7 @@ import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { Field } from 'redux-form';
import { translate } from 'react-i18next';
import { debounce } from 'debounce';
// Model
import VocabularyTerm from 'model/vocabulary/VocabularyTerm';
......@@ -31,10 +32,17 @@ class SelectCountryInternal extends React.Component<ISelectCountryCodeInternal,
protected handleInputChange = (event) => {
this.setState({ searchText: event.target.value });
this.props.autocomplete(event.target.value).then((suggestions) => {
if (event.target.value) {
this.doAutocomplete(event.target.value);
}
}
private doAutocomplete = debounce((value) => {
this.props.autocomplete(value).then((suggestions) => {
this.setState({ suggestions });
});
}
}, 1000);
protected handleClick = (event) => {
this.setState({ open: true, anchorEl: event.currentTarget });
}
......
......@@ -2,6 +2,7 @@ import * as React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { translate } from 'react-i18next';
import { debounce } from 'debounce';
import DescriptorList from 'model/catalog/DescriptorList';
import { autocomplete, promiseDescriptorList } from 'descriptorlists/actions/public';
......@@ -29,10 +30,13 @@ class SelectDescriptorListInternal extends React.Component<ISelectDescriptorList
protected handleInputChange = (event) => {
this.setState({ searchText: event.target.value });
this.props.autocomplete(event.target.value).then((suggestions) => {
this.doAutocomplete(event.target.value);
}
private doAutocomplete = debounce((value) => {
this.props.autocomplete(value).then((suggestions) => {
this.setState({ suggestions });
});
}
}, 1000);
protected handleClick = (event) => {
this.setState({ open: true, anchorEl: event.currentTarget });
}
......
......@@ -2,6 +2,7 @@ import * as React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import { translate } from 'react-i18next';
import { debounce } from 'debounce';
import {autocompleteWiewsTerm, loadWiewsTerm} from 'vocabulary/actions/public';
......@@ -26,14 +27,16 @@ interface ISelectFaoInstituteInternal extends React.ClassAttributes<any> {
class SelectFaoInstituteInternal extends React.Component<ISelectFaoInstituteInternal, any> {
protected handleInputChange = (event) => {
const { autocompleteWiewsTerm } = this.props;
this.setState({searchText: event.target.value});
if (event.target.value) {
autocompleteWiewsTerm(event.target.value).then((suggestions) => {
this.setState({suggestions});
});
this.doAutocomplete(event.target.value);
}
}
private doAutocomplete = debounce((value) => {
this.props.autocompleteWiewsTerm(value).then((suggestions) => {
this.setState({suggestions});
});
}, 1000);
protected handleClick = (event) => {
this.setState({open: true, anchorEl: event.currentTarget});
}
......
import * as React from 'react';
import {Field} from 'redux-form';
import { debounce } from 'debounce';
import Button from '@material-ui/core/Button';
import TableCell from '@material-ui/core/TableCell';
......@@ -84,7 +85,7 @@ class SidRow extends React.Component<ISidRowProps> {
component={ MaterialAutosuggest }
label="Sid"
placeholder="Sid"
onChange={ this.onInputChange }
onChange={ debounce(this.onInputChange, 1000) }
suggestions={ Object.keys(this.state.autocompleteObj).map((key) => ({label: key})) }
suggestionLabel="label"
classes={ {textField: classes.textField} }
......
......@@ -4,6 +4,7 @@ import { connect } from 'react-redux';
import MaterialAutosuggest from 'ui/common/material-autosuggest';
import { bindActionCreators } from 'redux';
import { autocomplete } from 'vocabulary/actions/public';
import { debounce } from 'debounce';
interface IVocabularyTermPickerProps extends React.ClassAttributes<any> {
vocabularyUuid: string;
......@@ -17,22 +18,23 @@ interface IVocabularyTermPickerProps extends React.ClassAttributes<any> {
class VocabularyTermPicker extends React.Component<IVocabularyTermPickerProps, any> {
private onInputChange = (e, term) => {
const { input } = this.props;
if (term) {
this.doAutocomplete(term.newValue);
input.onChange(term.newValue);
}
}
private onBlur = (e) => {
// do nothing
}
private doAutocomplete = (query) => {
const { autocomplete, vocabularyUuid, input } = this.props;
private doAutocomplete = debounce((query) => {
const { autocomplete, vocabularyUuid } = this.props;
autocomplete(vocabularyUuid, query)
.then((results) => {
this.setState({ languages: results });
input.onChange(query);
});
}
}, 1000);
constructor(props: IVocabularyTermPickerProps, context: any) {
super(props, context);
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment