fix: MapBlock now expects pre-prepared data layers

app/components/mdx-components/block.tsx

@@ -1,19 +1,82 @@
 'use client';
 
-import React from 'react';
+import React, { useMemo } from 'react';
 import { useDataStore } from 'app/store/providers/data';
 import { MapBlock, ScrollytellingBlock } from '@lib';
-import { transformToVedaData } from 'app/content/utils/data';
+import { transformToVedaData } from 'app/utilities/data';
+import { DatasetStatus, type VizDatasetSuccess } from 'app/types/veda-ui';
 
-export function EnhancedMapBlock(props) {
+function getDatasetLayers(vedaData: any, datasetId?: string) {
+  if (!datasetId) return {};
+  const ds = vedaData?.[datasetId];
+  return ds?.data?.layers ? { [datasetId]: ds.data.layers } : {};
+}
+
+function findLayerById(layersRecord: Record<string, any[]>, layerId?: string) {
+  if (!layerId) return null;
+  for (const dsId of Object.keys(layersRecord)) {
+    const match = (layersRecord[dsId] || []).find((l) => l.id === layerId);
+    if (match) return match;
+  }
+  return null;
+}
+
+function toVizDatasetSuccess(layer: any): VizDatasetSuccess | null {
+  if (!layer) return null;
+  return {
+    status: DatasetStatus.SUCCESS,
+    error: null,
+    id: layer.id,
+    name: layer.name,
+    type: layer.type,
+    data: layer,
+    settings: {
+      isVisible: true,
+      opacity: 100,
+    },
+  };
+}
+
+export function EnhancedMapBlock({
+  datasetId,
+  layerId,
+  compareDataLayer: compareOverride,
+  ...props
+}: {
+  datasetId: string;
+  layerId: string;
+  compareDataLayer?: any;
+  [key: string]: any;
+}) {
   const { datasets } = useDataStore();
-  const transformed = transformToVedaData(datasets);
-  return <MapBlock {...props} datasets={transformed} />;
-};
+  const transformed = useMemo(() => transformToVedaData(datasets), [datasets]);
+
+  const { baseDataLayer, compareDataLayer } = useMemo(() => {
+    const layersRecord = getDatasetLayers(transformed, datasetId);
+
+    const baseRaw = findLayerById(layersRecord, layerId);
+    const base = toVizDatasetSuccess(baseRaw);
+
+    let compare = compareOverride ?? null;
+    if (!compare && baseRaw?.compare?.layerId) {
+      const cmpRaw = findLayerById(layersRecord, baseRaw.compare.layerId);
+      compare = toVizDatasetSuccess(cmpRaw);
+    }
+
+    return { baseDataLayer: base, compareDataLayer: compare };
+  }, [transformed, datasetId, layerId, compareOverride]);
+
+  return (
+    <MapBlock
+      {...props}
+      baseDataLayer={baseDataLayer}
+      compareDataLayer={compareDataLayer}
+    />
+  );
+}
 
 export function EnhancedScrollyTellingBlock(props) {
   const { datasets } = useDataStore();
   const transformed = transformToVedaData(datasets);
   return <ScrollytellingBlock {...props} datasets={transformed} />;
 }
-

app/lib/index.ts

@@ -1,5 +1,3 @@
-// eslint-disable-next-line @typescript-eslint/ban-ts-comment
-// @ts-nocheck : until veda-ui fixes its types
 'use client';
 
 import {

app/types/veda-ui.ts

@@ -0,0 +1,30 @@
+/**
+ * Temporary local re-declarations of types that exist inside @teamimpact/veda-ui
+ * but are not yet exported in its public API.
+ *
+ * These allow us to stay type-safe (instead of using @ts-nocheck) when working with
+ * MapBlock and related components in this repo.
+ *
+ * Once veda-ui exports these types officially, this file should be removed
+ * and imports switched back to @teamimpact/veda-ui (via app/lib/index.ts).
+ *
+ * Tracking issue on the veda-ui side: https://github.com/NASA-IMPACT/veda-ui/issues/1845
+ */
+export enum DatasetStatus {
+  SUCCESS = 'success',
+  LOADING = 'loading',
+  ERROR = 'error',
+}
+
+export interface VizDatasetSuccess {
+  status: DatasetStatus.SUCCESS;
+  error: null;
+  id: string;
+  name: string;
+  type: string;
+  data: any;
+  settings: {
+    isVisible: boolean;
+    opacity: number;
+  };
+}

app/utilities/data.ts

@@ -0,0 +1,36 @@
+import type { DatasetData, StoryData, VedaData } from '@lib';
+import type { DatasetMetadata } from 'app/types/content';
+
+export function processTaxonomies(data): DatasetData | StoryData {
+  const updatedTax = data.taxonomy.map((t) => {
+    const updatedVals = t.values.map((v) => {
+      return {
+        id: v.replace(/ /g, '_').toLowerCase(),
+        name: v,
+      };
+    });
+    return { ...t, values: updatedVals };
+  });
+  return { ...data, taxonomy: updatedTax };
+}
+
+export const transformToDatasetsList = (
+  content: DatasetMetadata[],
+): DatasetData[] => {
+  return content?.map((post) => ({
+    ...post.metadata,
+  }));
+};
+
+export const transformToVedaData = (
+  datasets: DatasetMetadata[] | undefined,
+): VedaData<DatasetData> => {
+  const transformed = {};
+  datasets?.map((dataset) => {
+    const id = dataset.metadata.id;
+    transformed[id] = {
+      data: dataset.metadata,
+    };
+  });
+  return transformed;
+};