Search: integration suggestions better

app/soapbox/features/compose/components/search_results.js

@@ -7,8 +7,6 @@ import StatusContainer from '../../../containers/status_container';
 import ImmutablePureComponent from 'react-immutable-pure-component';
 import Hashtag from '../../../components/hashtag';
 import FilterBar from '../../search/components/filter_bar';
-import BundleContainer from 'soapbox/features/ui/containers/bundle_container';
-import { WhoToFollowPanel } from 'soapbox/features/ui/util/async-components';
 import ScrollableList from 'soapbox/components/scrollable_list';
 import PlaceholderAccount from 'soapbox/features/placeholder/components/placeholder_account';
 import PlaceholderHashtag from 'soapbox/features/placeholder/components/placeholder_hashtag';
@@ -24,6 +22,7 @@ export default class SearchResults extends ImmutablePureComponent {
     selectedFilter: PropTypes.string.isRequired,
     selectFilter: PropTypes.func.isRequired,
     features: PropTypes.object.isRequired,
+    suggestions: ImmutablePropTypes.list,
   };
 
   handleLoadMore = () => this.props.expandSearch(this.props.selectedFilter);
@@ -31,15 +30,7 @@ export default class SearchResults extends ImmutablePureComponent {
   handleSelectFilter = newActiveFilter => this.props.selectFilter(newActiveFilter);
 
   render() {
-    const { value, results, submitted, selectedFilter, features } = this.props;
+    const { value, results, submitted, selectedFilter, suggestions } = this.props;
-
-    if (!submitted && features.suggestions && results.isEmpty()) {
-      return (
-        <BundleContainer fetchComponent={WhoToFollowPanel}>
-          {Component => <Component limit={5} />}
-        </BundleContainer>
-      );
-    }
 
     let searchResults;
     let hasMore = false;
@@ -47,14 +38,16 @@ export default class SearchResults extends ImmutablePureComponent {
     let noResultsMessage;
     let placeholderComponent = PlaceholderStatus;
 
-    if (selectedFilter === 'accounts' && results.get('accounts')) {
+    if (selectedFilter === 'accounts') {
       hasMore = results.get('accountsHasMore');
       loaded = results.get('accountsLoaded');
       placeholderComponent = PlaceholderAccount;
 
-      if (results.get('accounts').size > 0) {
+      if (results.get('accounts') && results.get('accounts').size > 0) {
         searchResults = results.get('accounts').map(accountId => <AccountContainer key={accountId} id={accountId} />);
-      } else {
+      } else if (suggestions && !suggestions.isEmpty()) {
+        searchResults = suggestions.map(suggestion => <AccountContainer key={suggestion.get('account')} id={suggestion.get('account')} />);
+      } else if (submitted) {
         noResultsMessage = (
           <div className='empty-column-indicator'>
             <FormattedMessage
@@ -108,7 +101,7 @@ export default class SearchResults extends ImmutablePureComponent {
 
     return (
       <>
-        {submitted && <FilterBar selectedFilter={submitted ? selectedFilter : null} selectFilter={this.handleSelectFilter} />}
+        <FilterBar selectedFilter={selectedFilter} selectFilter={this.handleSelectFilter} />
 
         {noResultsMessage || (
           <ScrollableList