fix: Correctly load image underlay when initial layout is spatial (#859)

client/src/actions/index.ts

@@ -225,6 +225,7 @@ const doInitialDataLoad = (): ((
       datasetMetadataFetchAndLoad(dispatch, oldPrefix, config);
       // TODO: add logic to ensure this is working for spatial datasets when flag removed
       if (isSpatial) {
+        // (seve): maybe we should be fetching spatial images here too as well
         datasetSpatialMetadataFetchAndLoad(dispatch);
       }
       const baseDataUrl = `${globals.API.prefix}${globals.API.version}`;

client/src/components/graph/graph.tsx

@@ -670,6 +670,7 @@ class Graph extends React.Component<GraphProps, GraphState> {
 
     this.isSpatial = getFeatureFlag(FEATURES.SPATIAL);
 
+    // (seve): this is leading to multiple image downloads, if this isn't large, maybe we should do it as part of the initial load and store it in redux
     this.spatialImage = this.isSpatial
       ? await this.loadTextureFromUrl(
           `${globals.API?.prefix}${globals.API?.version}spatial/image`

client/src/components/menubar/index.tsx

@@ -92,9 +92,22 @@ class MenuBar extends React.PureComponent<{}, State> {
   // eslint-disable-next-line @typescript-eslint/ban-types --- FIXME: disabled temporarily on migrate to TS.
   constructor(props: {}) {
     super(props);
+    // @ts-expect-error ts-migrate(2339) FIXME: Property 'dispatch' does not exist on type 'Readon... Remove this comment to see the full error message
+    const { layoutChoice, dispatch } = this.props;
     this.state = {
       pendingClipPercentiles: null,
     };
+    const currentConditionMet = layoutChoice?.current?.includes(
+      globals.spatialEmbeddingKeyword
+    );
+    // (seve): On some datasets, the app initially loads with a different layout selected, then switches to spatial.
+    //  This triggers the componentDidUpdate, which toggles the image underlay.
+    //  Other datasets correctly load with the spatial layout initially selected, but then don't trigger the componentDidUpdate.
+    if (currentConditionMet) {
+      dispatch({
+        type: "toggle image underlay",
+      });
+    }
   }
 
   componentDidUpdate(prevProps: any): void {