DAH-2548 fix url filtering (#657)

* DAH-2548 fix url filtering * DAH-2548 clean up * DAH-2548 one more fix * DAH-2548 clean up
SFDigitalServices · Aug 14, 2024 · 97ae851 · 97ae851
1 parent 930f266
commit 97ae851
Showing 1 changed file with 22 additions and 27 deletions.
diff --git a/app/javascript/components/lease_ups/LeaseUpApplicationsPage.js b/app/javascript/components/lease_ups/LeaseUpApplicationsPage.js
@@ -124,34 +124,27 @@ const LeaseUpApplicationsPage = () => {
     }
   })
 
-  React.useEffect(() => {
-    const urlFilters = {}
-    const { appliedFilters } = applicationsListData
-    console.log(location)
-    LEASE_UP_APPLICATION_FILTERS.forEach((filter) => {
-      const values = searchParams.getAll(filter.fieldName)
-      if (values.length > 0) {
-        urlFilters[filter.fieldName] = values
-      }
-    })
-
-    const textSearchFilters = searchParams.get('search')
-    if (textSearchFilters) {
-      urlFilters.search = textSearchFilters
-    }
-
-    if (!isEqual(appliedFilters, urlFilters)) {
-      state.forceRefreshNextPageUpdate = true
-      applicationsTableFiltersApplied(dispatch, urlFilters)
-    }
-    // Using just location in the deps array allows us to exclusively run this effect:
-    // on mount, if the user changes the url manually, or if the user hits the back button
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [location])
-
   useAsync(
     () => {
-      const { appliedFilters, page } = applicationsListData
+      const urlFilters = {}
+      let { appliedFilters, page } = applicationsListData
+      LEASE_UP_APPLICATION_FILTERS.forEach((filter) => {
+        const values = searchParams.getAll(filter.fieldName)
+        if (values.length > 0) {
+          urlFilters[filter.fieldName] = values
+        }
+      })
+
+      const textSearchFilters = searchParams.get('search')
+      if (textSearchFilters) {
+        urlFilters.search = textSearchFilters
+      }
+
+      if (!isEqual(appliedFilters, urlFilters)) {
+        appliedFilters = urlFilters
+        state.forceRefreshNextPageUpdate = true
+        applicationsTableFiltersApplied(dispatch, appliedFilters)
+      }
 
       if (state.eagerPagination.isOverLimit(page, 50000)) {
         setState({
@@ -183,7 +176,9 @@ const LeaseUpApplicationsPage = () => {
         console.trace(e)
       }
     },
-    [applicationsListData.appliedFilters, applicationsListData.page]
+    // Using location in the deps array allows us to run this effect:
+    // on mount, if the user changes the url manually, or if the user hits the back button
+    [location, applicationsListData.page]
   )
 
   useEffectOnMount(() => applicationsPageMounted(dispatch))