Show spinner when fetching results

src/components/IntegrationAutosuggest.js

@@ -124,7 +124,7 @@ const IntegrationAutosuggest = (props) => {
   };
 
   const shouldRenderSuggestions = (value)  => {
-    return value.trim().length > 3;
+    return value.trim().length > 2;
   };
 
   const handleOnSuggestionsClearRequested = () => {
@@ -136,7 +136,7 @@ const IntegrationAutosuggest = (props) => {
   //console.log('IntegrationAutosuggest', props.search.suggestions);
 
   let adornment = null;
-  if (props.search.fetchingSuggestions) {
+  if (props.search.fetchingSuggestions || props.search.fetchingResults) {
     adornment = <InputAdornment position="end"><CircularProgress size={20} /></InputAdornment>;
   } else {
     adornment = <SearchIcon className={classes.icon} />;

src/reducers/search.js

@@ -2,6 +2,7 @@ import {
   UPDATE_QUERY,
   UPDATE_DATASETS,
   FETCH_SUGGESTIONS,
+  FETCH_RESULTS,
   UPDATE_SUGGESTIONS,
   CLEAR_SUGGESTIONS,
   UPDATE_RESULTS,
@@ -18,7 +19,7 @@ export const INITIAL_STATE = {
   fetchingSuggestions: false,
   results: [],
   resultsQuery: '',
-  fetchingResults: true,
+  fetchingResults: false,
 };
 
 const search = (state = INITIAL_STATE, action) => {
@@ -29,6 +30,8 @@ const search = (state = INITIAL_STATE, action) => {
       return { ...state, datasets: action.datasets || [] };
     case FETCH_SUGGESTIONS:
       return { ...state, fetchingSuggestions: true };
+    case FETCH_RESULTS:
+      return { ...state, fetchingResults: true };
     case CLEAR_SUGGESTIONS:
       return {
         ...state,
@@ -48,12 +51,14 @@ const search = (state = INITIAL_STATE, action) => {
         ...state,
         results: [],
         resultsQuery: '',
+        fetchingResults: false
       };
     case UPDATE_RESULTS:
       return {
         ...state,
         results: results(state.results, action),
-        resultsQuery: state.query
+        resultsQuery: state.query,
+        fetchingResults: false
       };
     default:
       return state;