Commit 373a9910 authored by Maxym Borodenko's avatar Maxym Borodenko

Merge branch '747-home-page-search-doesn-t-work-via-enter' into 'master'

Fix: Home page search doesn't work via ENTER

Closes #747

See merge request genesys-pgr/genesys-ui!727
parents b56e48c6 8a6c71da
......@@ -493,8 +493,45 @@ class WelcomePage extends React.Component<IWelcomeProps, any> {
this.setState({loaded: true});
}
private onSubmitSearch = async (e) => {
const { query } = this.state;
const { applyDatasetsFilters, applySubsetsFilters, applyDescriptorListsFilters, applyAccessionsFilters, t, navigateTo } = this.props;
// const { navigateTo, t } = this.props;
e.preventDefault();
if (query && query.length > 0) {
switch (this.state.scope) {
case t('public.p.welcome.search.scope.datasets'):
await navigateTo('/datasets');
applyDatasetsFilters({ _text: query });
break;
case t('public.p.welcome.search.scope.subsets'):
await navigateTo('/subsets');
applySubsetsFilters({ _text: query });
break;
case t('public.p.welcome.search.scope.descriptors'):
await navigateTo('/descriptorlists');
applyDescriptorListsFilters({ _text: query });
break;
default:
// await navigateTo('/a');
applyAccessionsFilters({ _text: query });
}
} else {
this.setState({
...this.state,
queryPlaceholder: t(`public.p.welcome.search.suggestion${Math.floor(Math.random() * SEARCH_SUGGESTIONS_COUNT)}`),
});
}
};
private handleKeyPres = (event: React.KeyboardEvent<HTMLDivElement>) => {
if (event.key === 'Enter') {
this.onSubmitSearch(event);
}
};
public render() {
const { classes, t, serverInfo, lastNews, navigateTo } = this.props;
const { classes, t, serverInfo, lastNews } = this.props;
const { loaded } = this.state;
const Stats = ({children}) => (
......@@ -510,38 +547,6 @@ class WelcomePage extends React.Component<IWelcomeProps, any> {
});
};
const onSubmitSearch = async (e) => {
const { query } = this.state;
const { applyDatasetsFilters, applySubsetsFilters, applyDescriptorListsFilters, applyAccessionsFilters } = this.props;
// const { navigateTo, t } = this.props;
e.preventDefault();
if (query && query.length > 0) {
switch (this.state.scope) {
case t('public.p.welcome.search.scope.datasets'):
await navigateTo('/datasets');
applyDatasetsFilters({ _text: query });
break;
case t('public.p.welcome.search.scope.subsets'):
await navigateTo('/subsets');
applySubsetsFilters({ _text: query });
break;
case t('public.p.welcome.search.scope.descriptors'):
await navigateTo('/descriptorlists');
applyDescriptorListsFilters({ _text: query });
break;
default:
// await navigateTo('/a');
applyAccessionsFilters({ _text: query });
}
} else {
this.setState({
...this.state,
queryPlaceholder: t(`public.p.welcome.search.suggestion${Math.floor(Math.random() * SEARCH_SUGGESTIONS_COUNT)}`),
});
}
};
return (
<PageLayout classes={ {root: classes.root } } withFooter>
<ScrollToTopOnMount/>
......@@ -566,7 +571,7 @@ class WelcomePage extends React.Component<IWelcomeProps, any> {
</div>
<Grid item xs={ 12 }>
<div className={ classes.searchBox }>
<form onSubmit={ onSubmitSearch }>
<form onSubmit={ this.onSubmitSearch }>
<div className={ classes.searchWrapper }>
<div className={ classes.inputBorder }>
<Select
......@@ -606,17 +611,21 @@ class WelcomePage extends React.Component<IWelcomeProps, any> {
{ t('public.p.welcome.search.scope.descriptors') }
</MenuItem>
</Select>
<Input type="text" onChange={ searchQueryChange } className={ classes.searchField }
disableUnderline
placeholder={ t(this.state.queryPlaceholder) }
endAdornment={
<InputAdornment disableTypography position="end" className={ classes.searchButton }>
<Button type="button" onClick={ onSubmitSearch }>
<SearchIcon className={ classes.searchIcon }/>
<span className="search">{ t('common:action.search') }</span>
</Button>
</InputAdornment>
}
<Input
type="text"
onChange={ searchQueryChange }
className={ classes.searchField }
disableUnderline
placeholder={ t(this.state.queryPlaceholder) }
onKeyPress={ this.handleKeyPres }
endAdornment={
<InputAdornment disableTypography position="end" className={ classes.searchButton }>
<Button type="button" onClick={ this.onSubmitSearch }>
<SearchIcon className={ classes.searchIcon }/>
<span className="search">{ t('common:action.search') }</span>
</Button>
</InputAdornment>
}
/>
</div>
</div>
......
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