From 0909b8cca05c6b32dbc980a25ec4840a6e58adcc Mon Sep 17 00:00:00 2001
From: Kelli Rotstan <kelli@rotstan.org>
Date: Fri, 6 Dec 2019 07:59:15 -0800
Subject: [PATCH] Fix challenge find map not updating when query changed

* When a query is typed in pass query search criteria to
  TaskClusterMap.

* When WithChallengeTaskClusters fetches updated clusters
  debounce the fetch if it's the search query that changed
---
 src/components/ChallengePane/ChallengePane.js            | 1 +
 .../WithChallengeTaskClusters.js                         | 9 ++++++++-
 2 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/ChallengePane/ChallengePane.js b/src/components/ChallengePane/ChallengePane.js
index 2a68ebfd7..cb228e705 100644
--- a/src/components/ChallengePane/ChallengePane.js
+++ b/src/components/ChallengePane/ChallengePane.js
@@ -110,6 +110,7 @@ export class ChallengePane extends Component {
                    criteria={{boundingBox: fromLatLngBounds(this.state.bounds),
                               zoom: this.state.zoom,
                               filters: _get(this.props, 'searchCriteria.filters'),
+                              searchQuery: _get(this.props, 'searchCriteria.query'),
                               challengeStatus}}
                    updateTaskFilterBounds={(bounds, zoom, fromUserAction) => {
                      this.props.updateChallengeSearchMapBounds(bounds, fromUserAction)
diff --git a/src/components/HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters.js b/src/components/HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters.js
index 834106ab1..5867b3631 100644
--- a/src/components/HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters.js
+++ b/src/components/HOCs/WithChallengeTaskClusters/WithChallengeTaskClusters.js
@@ -9,6 +9,7 @@ import _uniqueId from 'lodash/uniqueId'
 import _sum from 'lodash/sum'
 import _map from 'lodash/map'
 import _set from 'lodash/set'
+import _debounce from 'lodash/debounce'
 import { fromLatLngBounds,
          boundsWithinAllowedMaxDegrees } from '../../../services/MapBounds/MapBounds'
 import { fetchTaskClusters } from '../../../services/Task/TaskClusters'
@@ -134,8 +135,14 @@ export const WithChallengeTaskClusters = function(WrappedComponent, storeTasks=f
       }
     }
 
+    debouncedFetchClusters =
+      _debounce((showAsClusters) => this.fetchUpdatedClusters(showAsClusters), 400)
+
     componentDidUpdate(prevProps, prevState) {
-      if (!_isEqual(_omit(prevProps.criteria, ['page', 'pageSize']),
+      if (!_isEqual(_get(prevProps.criteria, 'searchQuery'), _get(this.props.criteria, 'searchQuery'))) {
+        this.debouncedFetchClusters(this.state.showAsClusters)
+      }
+      else if (!_isEqual(_omit(prevProps.criteria, ['page', 'pageSize']),
             _omit(this.props.criteria, ['page', 'pageSize']))) {
         this.fetchUpdatedClusters(this.state.showAsClusters)
       }