Ensure No search results found isn't shown without a search

frontend/src/Search/NoSearchResults.tsx

@@ -1,9 +1,12 @@
-import PropTypes from 'prop-types';
 import React from 'react';
 import translate from 'Utilities/String/translate';
 import styles from './NoSearchResults.css';
 
-function NoSearchResults(props) {
+interface NoSearchResultsProps {
+  totalItems: number;
+}
+
+function NoSearchResults(props: NoSearchResultsProps) {
   const { totalItems } = props;
 
   if (totalItems > 0) {
@@ -18,15 +21,9 @@ function NoSearchResults(props) {
 
   return (
     <div>
-      <div className={styles.message}>
+      <div className={styles.message}>{translate('NoSearchResultsFound')}</div>
-        {translate('NoSearchResultsFound')}
-      </div>
     </div>
   );
 }
 
-NoSearchResults.propTypes = {
-  totalItems: PropTypes.number.isRequired
-};
-
 export default NoSearchResults;

frontend/src/Search/SearchIndex.js

@@ -326,15 +326,17 @@ class SearchIndex extends Component {
             innerClassName={styles.tableInnerContentBody}
           >
             {
-              isFetching && !isPopulated &&
+              isFetching && !isPopulated ?
-                <LoadingIndicator />
+                <LoadingIndicator /> :
+                null
             }
 
             {
-              !isFetching && !!error &&
+              !isFetching && !!error ?
                 <Alert kind={kinds.DANGER}>
                   {getErrorMessage(error, 'Failed to load search results from API')}
-                </Alert>
+                </Alert> :
+                null
             }
 
             {
@@ -359,16 +361,18 @@ class SearchIndex extends Component {
             }
 
             {
-              !error && !isFetching && !hasIndexers &&
+              !error && !isFetching && !hasIndexers ?
                 <NoIndexer
                   totalItems={0}
                   onAddIndexerPress={this.onAddIndexerPress}
-                />
+                /> :
+                null
             }
 
             {
-              !error && !isFetching && hasIndexers && !items.length &&
+              !error && !isFetching && isPopulated && hasIndexers && !items.length ?
-                <NoSearchResults totalItems={totalItems} />
+                <NoSearchResults totalItems={totalItems} /> :
+                null
             }
 
             <AddIndexerModal
@@ -384,11 +388,12 @@ class SearchIndex extends Component {
           </PageContentBody>
 
           {
-            isLoaded && !!jumpBarItems.order.length &&
+            isLoaded && !!jumpBarItems.order.length ?
               <PageJumpBar
                 items={jumpBarItems}
                 onItemPress={this.onJumpBarItemPress}
-              />
+              /> :
+              null
           }
         </div>