diff options
Diffstat (limited to 'webapp/components/search_results.jsx')
-rw-r--r-- | webapp/components/search_results.jsx | 29 |
1 files changed, 27 insertions, 2 deletions
diff --git a/webapp/components/search_results.jsx b/webapp/components/search_results.jsx index 1d1627950..1499c8abb 100644 --- a/webapp/components/search_results.jsx +++ b/webapp/components/search_results.jsx @@ -39,7 +39,8 @@ function getStateFromStores() { results, channels, searchTerm: SearchStore.getSearchTerm(), - flaggedPosts: PreferenceStore.getCategory(Constants.Preferences.CATEGORY_FLAGGED_POST) + flaggedPosts: PreferenceStore.getCategory(Constants.Preferences.CATEGORY_FLAGGED_POST), + loading: SearchStore.isLoading() }; } @@ -71,6 +72,7 @@ export default class SearchResults extends React.Component { componentDidMount() { this.mounted = true; + SearchStore.addSearchTermChangeListener(this.onSearchTermChange); SearchStore.addSearchChangeListener(this.onChange); ChannelStore.addChangeListener(this.onChange); PreferenceStore.addChangeListener(this.onPreferenceChange); @@ -113,6 +115,7 @@ export default class SearchResults extends React.Component { componentWillUnmount() { this.mounted = false; + SearchStore.removeSearchTermChangeListener(this.onSearchTermChange); SearchStore.removeSearchChangeListener(this.onChange); ChannelStore.removeChangeListener(this.onChange); PreferenceStore.removeChangeListener(this.onPreferenceChange); @@ -144,6 +147,14 @@ export default class SearchResults extends React.Component { }); } + onSearchTermChange(doSearch) { + if (this.mounted && doSearch) { + this.setState({ + loading: true + }); + } + } + onChange() { if (this.mounted) { this.setState(getStateFromStores()); @@ -175,7 +186,20 @@ export default class SearchResults extends React.Component { var ctls = null; - if (this.props.isFlaggedPosts && noResults) { + if (this.state.loading) { + ctls = + ( + <div className='sidebar--right__subheader'> + <div className='sidebar--right__loading'> + <i className='fa fa-spinner fa-spin'/> + <FormattedMessage + id='search_header.loading' + defaultMessage='Searching...' + /> + </div> + </div> + ); + } else if (this.props.isFlaggedPosts && noResults) { ctls = ( <div className='sidebar--right__subheader'> <ul> @@ -319,6 +343,7 @@ export default class SearchResults extends React.Component { isFlaggedPosts={this.props.isFlaggedPosts} isPinnedPosts={this.props.isPinnedPosts} channelDisplayName={this.props.channelDisplayName} + isLoading={this.state.loading} /> <div id='search-items-container' |