Merged main

app/scripts/components/about/index.tsx

@@ -18,6 +18,10 @@ function About() {
         description={
           aboutContent?.data.description || 'This is the default description'
         }
+        coverSrc={aboutContent?.data.media?.src}
+        coverAlt={aboutContent?.data.media?.alt}
+        attributionAuthor={aboutContent?.data.media?.author?.name}
+        attributionUrl={aboutContent?.data.media?.author?.url}
       />
       <ContentOverride with='aboutContent'>
         <FoldProse>

app/scripts/components/analysis/define/index.tsx

@@ -19,12 +19,13 @@ import {
   CollecticonCircleInformation,
   CollecticonEllipsisVertical
 } from '@devseed-ui/collecticons';
+import { Overline } from '@devseed-ui/typography';
 
 import { datasets, DatasetLayer, VedaDatum, DatasetData } from 'veda';
 import { useAnalysisParams } from '../results/use-analysis-params';
 import AoiSelector from './aoi-selector';
 import PageHeroActions from './page-hero-actions';
-import { useStacSearch } from './use-stac-search';
+import { useStacCollectionSearch } from './use-stac-collection-search';
 import { variableGlsp } from '$styles/variable-utils';
 
 import { PageMainContent } from '$styles/page';
@@ -79,6 +80,7 @@ const FormCheckableCustom = styled(FormCheckable)`
   background: ${themeVal('color.surface')};
   box-shadow: 0 0 0 1px ${themeVal('color.base-100a')};
   border-radius: ${themeVal('shape.rounded')};
+  align-items: center;
 `;
 
 export const Note = styled.div`
@@ -98,13 +100,23 @@ export const Note = styled.div`
   }
 `;
 
-export const allAvailableDatasetsLayers: DatasetLayer[] = Object.values(datasets)
-    .map((dataset) => (dataset as VedaDatum<DatasetData>).data.layers)
-    .flat()
-    .filter(d => d.type !== 'vector');
+const findParentDataset = (layerId: string) => {
+  const parentDataset = Object.values(datasets).find((dataset) =>
+    (dataset as VedaDatum<DatasetData>).data.layers.find(
+      (l) => l.id === layerId
+    )
+  );
+  return parentDataset?.data;
+};
+
+export const allAvailableDatasetsLayers: DatasetLayer[] = Object.values(
+  datasets
+)
+  .map((dataset) => (dataset as VedaDatum<DatasetData>).data.layers)
+  .flat()
+  .filter((d) => d.type !== 'vector' && !d.analysis?.exclude);
 
 export default function Analysis() {
-
   const { params, setAnalysisParam } = useAnalysisParams();
   const { start, end, datasetsLayers, aoi, errors } = params;
 
@@ -172,7 +184,11 @@ export default function Analysis() {
   );
 
   const { selectableDatasetLayers, stacSearchStatus, readyToLoadDatasets } =
-    useStacSearch({ start, end, aoi: aoiDrawState.featureCollection });
+    useStacCollectionSearch({
+      start,
+      end,
+      aoi: aoiDrawState.featureCollection
+    });
 
   // Update datasetsLayers when stac search is refreshed in case some
   // datasetsLayers are not available anymore
@@ -350,8 +366,14 @@ export default function Analysis() {
                     textPlacement='right'
                     type='checkbox'
                     onChange={onDatasetLayerChange}
-                    checked={selectedDatasetLayerIds?.includes(datasetLayer.id) ?? false}
+                    checked={
+                      selectedDatasetLayerIds?.includes(datasetLayer.id) ??
+                      false
+                    }
                   >
+                    <Overline>
+                      From: {findParentDataset(datasetLayer.id)?.name}
+                    </Overline>
                     {datasetLayer.name}
                   </FormCheckableCustom>
                 ))}

app/scripts/components/analysis/define/use-stac-collection-search.ts

@@ -0,0 +1,101 @@
+import { useMemo } from 'react';
+import { FeatureCollection, Polygon } from 'geojson';
+import axios from 'axios';
+import { useQuery } from '@tanstack/react-query';
+import booleanIntersects from '@turf/boolean-intersects';
+import bboxPolygon from '@turf/bbox-polygon';
+import { areIntervalsOverlapping } from 'date-fns';
+
+import { allAvailableDatasetsLayers } from '.';
+
+import { utcString2userTzDate } from '$utils/date';
+
+interface UseStacSearchProps {
+  start?: Date;
+  end?: Date;
+  aoi?: FeatureCollection<Polygon> | null;
+}
+
+const collectionUrl = `${process.env.API_STAC_ENDPOINT}/collections`;
+
+export function useStacCollectionSearch({
+  start,
+  end,
+  aoi
+}: UseStacSearchProps) {
+  const readyToLoadDatasets = !!(start && end && aoi);
+
+  const result = useQuery({
+    queryKey: ['stacCollection'],
+    queryFn: async ({ signal }) => {
+      const collectionResponse = await axios.get(collectionUrl, {
+        signal
+      });
+      return collectionResponse.data.collections;
+    },
+    enabled: readyToLoadDatasets
+  });
+
+  const selectableDatasetLayers = useMemo(() => {
+    try {
+      return getInTemporalAndSpatialExtent(result.data, aoi, {
+        start,
+        end
+      });
+    } catch (e) {
+      return [];
+    }
+  }, [result.data, aoi, start, end]);
+
+  return {
+    selectableDatasetLayers: selectableDatasetLayers,
+    stacSearchStatus: result.status,
+    readyToLoadDatasets
+  };
+}
+
+function getInTemporalAndSpatialExtent(collectionData, aoi, timeRange) {
+  const matchingCollectionIds = collectionData.reduce((acc, col) => {
+    const id = col.id;
+
+    // Is is a dataset defined in the app?
+    // If not, skip other calculations.
+    const isAppDataset = allAvailableDatasetsLayers.some(
+      (l) => l.stacCol === id
+    );
+
+    if (
+      !isAppDataset ||
+      !col.extent.spatial.bbox ||
+      !col.extent.temporal.interval
+    ) {
+      return acc;
+    }
+
+    const bbox = col.extent.spatial.bbox[0];
+    const start = utcString2userTzDate(col.extent.temporal.interval[0][0]);
+    const end = utcString2userTzDate(col.extent.temporal.interval[0][1]);
+
+    const isInAOI = aoi.features.some((feature) =>
+      booleanIntersects(feature, bboxPolygon(bbox))
+    );
+
+    const isInTOI = areIntervalsOverlapping(
+      { start: new Date(timeRange.start), end: new Date(timeRange.end) },
+      {
+        start: new Date(start),
+        end: new Date(end)
+      }
+    );
+
+    if (isInAOI && isInTOI) {
+      return [...acc, id];
+    } else {
+      return acc;
+    }
+  }, []);
+
+  return allAvailableDatasetsLayers.filter((l) =>
+    matchingCollectionIds.includes(l.stacCol)
+  );
+}