MM-14456 Show search loading indicator until we have no more posts to load to avoid scroll pop

components/search_results/index.jsx

@@ -10,6 +10,7 @@ import {getConfig} from 'mattermost-redux/selectors/entities/general';
 import {getSearchMatches, getSearchResults} from 'mattermost-redux/selectors/entities/posts';
 import * as PreferenceSelectors from 'mattermost-redux/selectors/entities/preferences';
 import {getCurrentUser} from 'mattermost-redux/selectors/entities/users';
+import {getCurrentSearchForCurrentTeam} from 'mattermost-redux/selectors/entities/search';
 
 import {
     getSearchResultsTerms,
@@ -54,6 +55,8 @@ function makeMapStateToProps() {
             });
         }
 
+        const currentSearch = getCurrentSearchForCurrentTeam(state) || {};
+
         return {
             results: posts,
             matches: getSearchMatches(state),
@@ -63,6 +66,7 @@ function makeMapStateToProps() {
             isSearchingFlaggedPost: getIsSearchingFlaggedPost(state),
             isSearchingPinnedPost: getIsSearchingPinnedPost(state),
             isSearchGettingMore: getIsSearchGettingMore(state),
+            isSearchAtEnd: currentSearch.isEnd,
             compactDisplay: PreferenceSelectors.get(state, Preferences.CATEGORY_DISPLAY_SETTINGS, Preferences.MESSAGE_DISPLAY, Preferences.MESSAGE_DISPLAY_DEFAULT) === Preferences.MESSAGE_DISPLAY_COMPACT,
             dataRetentionEnableMessageDeletion,
             dataRetentionMessageRetentionDays,

components/search_results/search_results.jsx

@@ -53,6 +53,7 @@ export default class SearchResults extends React.PureComponent {
         isSearchingFlaggedPost: PropTypes.bool,
         isSearchingPinnedPost: PropTypes.bool,
         isSearchGettingMore: PropTypes.bool,
+        isSearchAtEnd: PropTypes.bool,
         compactDisplay: PropTypes.bool,
         isMentionSearch: PropTypes.bool,
         isFlaggedPosts: PropTypes.bool,
@@ -195,9 +196,9 @@ export default class SearchResults extends React.PureComponent {
             }, this);
         }
 
-        let loadingScreen = null;
-        if (this.props.isSearchGettingMore) {
-            loadingScreen = (
+        let loadingMorePostsComponent = null;
+        if (!this.props.isSearchAtEnd) {
+            loadingMorePostsComponent = (
                 <div className='loading-screen'>
                     <div className='loading__content'>
                         <div className='round round-1'/>
@@ -232,9 +233,9 @@ export default class SearchResults extends React.PureComponent {
                         className='search-items-container'
                     >
                         {ctls}
+                        {loadingMorePostsComponent}
                     </div>
                 </Scrollbars>
-                {loadingScreen}
             </div>
         );
     }