From c0f6b72288c6eec12435325ce8f5f720c6e711e0 Mon Sep 17 00:00:00 2001
From: Erik Escoffier <me@erik.nz>
Date: Mon, 25 Sep 2023 17:14:17 +0200
Subject: [PATCH] Memoize datasets

---
 .../define/use-stac-collection-search.ts      | 37 ++++++++++---------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/app/scripts/components/analysis/define/use-stac-collection-search.ts b/app/scripts/components/analysis/define/use-stac-collection-search.ts
index a95d2b6d3..66bfd7d3c 100644
--- a/app/scripts/components/analysis/define/use-stac-collection-search.ts
+++ b/app/scripts/components/analysis/define/use-stac-collection-search.ts
@@ -23,7 +23,8 @@ interface UseStacSearchProps {
   aoi?: FeatureCollection<Polygon> | null;
 }
 
-export type DatasetWithTimeseriesData = TimeseriesDataResult & DatasetLayer & { numberOfItems?: number };
+export type DatasetWithTimeseriesData = TimeseriesDataResult &
+  DatasetLayer & { numberOfItems?: number };
 
 const DATE_INTERVAL_FN = {
   day: eachDayOfInterval,
@@ -62,12 +63,13 @@ export function useStacCollectionSearch({
     }
   }, [result.data, aoi, start, end]);
 
-  const selectableDatasetLayersWithNumberOfItems: DatasetWithTimeseriesData[] = selectableDatasetLayers.map(
-    (l) => {
-      const numberOfItems = getNumberOfItemsWithinTimeRange(start, end, l);
-      return { ...l, numberOfItems };
-    }
-  );
+  const selectableDatasetLayersWithNumberOfItems: DatasetWithTimeseriesData[] =
+    useMemo(() => {
+      return selectableDatasetLayers.map((l) => {
+        const numberOfItems = getNumberOfItemsWithinTimeRange(start, end, l);
+        return { ...l, numberOfItems };
+      });
+    }, [selectableDatasetLayers, start, end]);
 
   return {
     selectableDatasetLayers: selectableDatasetLayersWithNumberOfItems,
@@ -143,17 +145,16 @@ function getInTemporalAndSpatialExtent(collectionData, aoi, timeRange) {
     matchingCollectionIds.includes(l.stacCol)
   );
 
-  const filteredDatasetsWithCollections =
-    filteredDatasets.map((l) => {
-      const collection = collectionData.find((c) => c.id === l.stacCol);
-      return {
-        ...l,
-        isPeriodic: collection['dashboard:is_periodic'],
-        timeDensity: collection['dashboard:time_density'],
-        domain: collection.extent.temporal.interval[0],
-        timeseries: collection.summaries.datetime
-      };
-    });
+  const filteredDatasetsWithCollections = filteredDatasets.map((l) => {
+    const collection = collectionData.find((c) => c.id === l.stacCol);
+    return {
+      ...l,
+      isPeriodic: collection['dashboard:is_periodic'],
+      timeDensity: collection['dashboard:time_density'],
+      domain: collection.extent.temporal.interval[0],
+      timeseries: collection.summaries.datetime
+    };
+  });
 
   return filteredDatasetsWithCollections;
 }