Commit 70d0d7cf authored by Oleksii Savran's avatar Oleksii Savran Committed by Viacheslav Pavlov

SID autocompleter delay

added delay for VocabularyTermPicker

Added delay for autocompletes

Delay for DescriptorListPicker

added debounce for country code picker
parent a8ab230b
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