Implement persistence

- Dependent on: #1110

Author: jorgenherje

frontend/src/modules/Intersection/loadModule.tsx

@@ -2,12 +2,15 @@ import { ModuleRegistry } from "@framework/ModuleRegistry";
 
 import type { Interfaces } from "./interfaces";
 import { settingsToViewInterfaceInitialization } from "./interfaces";
+import type { SerializedState } from "./persistence";
+import { serializeStateFunctions } from "./persistence";
 import { MODULE_NAME } from "./registerModule";
 import { Settings } from "./settings/settings";
 import { View } from "./view/view";
 
-const module = ModuleRegistry.initModule<Interfaces>(MODULE_NAME, {
+const module = ModuleRegistry.initModule<Interfaces, SerializedState>(MODULE_NAME, {
     settingsToViewInterfaceInitialization,
+    ...serializeStateFunctions,
 });
 
 module.viewFC = View;

frontend/src/modules/Intersection/persistence.ts

@@ -0,0 +1,25 @@
+import type { ModuleComponentSerializationFunctions, ModuleStateSchema } from "@framework/Module";
+
+import {
+    deserializeSettings,
+    SERIALIZED_SETTINGS_SCHEMA,
+    serializeSettings,
+    type SerializedSettings,
+} from "./settings/persistence";
+
+export type SerializedState = {
+    settings: SerializedSettings;
+};
+
+export const SERIALIZED_STATE_SCHEMA: ModuleStateSchema<SerializedState> = {
+    settings: SERIALIZED_SETTINGS_SCHEMA,
+} as const;
+
+export const serializeStateFunctions: ModuleComponentSerializationFunctions<SerializedState> = {
+    serializeStateFunctions: {
+        settings: serializeSettings,
+    },
+    deserializeStateFunctions: {
+        settings: deserializeSettings,
+    },
+};

frontend/src/modules/Intersection/registerModule.ts

@@ -4,15 +4,16 @@ import { ModuleRegistry } from "@framework/ModuleRegistry";
 import { SyncSettingKey } from "@framework/SyncSettings";
 
 import type { Interfaces } from "./interfaces";
+import { SERIALIZED_STATE_SCHEMA, type SerializedState } from "./persistence";
 import { preview } from "./preview";
 
 export const MODULE_NAME = "Intersection";
 
-ModuleRegistry.registerModule<Interfaces>({
+ModuleRegistry.registerModule<Interfaces, SerializedState>({
     moduleName: MODULE_NAME,
     defaultTitle: "Intersection",
     category: ModuleCategory.MAIN,
-    devState: ModuleDevState.DEV,
+    devState: ModuleDevState.PROD,
     description: "Generic intersection viewer for co-visualization of data from various sources.",
     preview,
     dataTagIds: [
@@ -28,4 +29,5 @@ ModuleRegistry.registerModule<Interfaces>({
         SyncSettingKey.CAMERA_POSITION_INTERSECTION,
         SyncSettingKey.VERTICAL_SCALE,
     ],
+    serializedStateSchema: SERIALIZED_STATE_SCHEMA,
 });

frontend/src/modules/Intersection/settings/atoms/baseAtoms.ts

@@ -3,6 +3,6 @@ import { atom } from "jotai";
 import type { DataProviderManager } from "@modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager";
 import { PreferredViewLayout } from "@modules/Intersection/typesAndEnums";
 
-export const userSelectedFieldIdentifierAtom = atom<string | null>(null);
 export const dataProviderManagerAtom = atom<DataProviderManager | null>(null);
 export const preferredViewLayoutAtom = atom<PreferredViewLayout>(PreferredViewLayout.VERTICAL);
+export const dataProviderSerializedStateAtom = atom<string>("");

frontend/src/modules/Intersection/settings/atoms/derivedAtoms.ts

@@ -0,0 +1,16 @@
+import { EnsembleSetAtom } from "@framework/GlobalAtoms";
+import { persistableFixableAtom } from "@framework/utils/atomUtils";
+
+export const selectedFieldIdentifierAtom = persistableFixableAtom<string | null>({
+    initialValue: null,
+    isValidFunction: ({ get, value }) => {
+        const ensembleSet = get(EnsembleSetAtom);
+        return (
+            value !== null && ensembleSet.getRegularEnsembleArray().some((ens) => ens.getFieldIdentifier() === value)
+        );
+    },
+    fixupFunction: ({ get }) => {
+        const ensembleSet = get(EnsembleSetAtom);
+        return ensembleSet.getRegularEnsembleArray().at(0)?.getFieldIdentifier() ?? null;
+    },
+});

frontend/src/modules/Intersection/settings/atoms/persistableFixableAtoms.ts

@@ -0,0 +1,45 @@
+import type { DeserializeStateFunction, SerializeStateFunction } from "@framework/Module";
+import { setIfDefined } from "@framework/utils/atomUtils";
+import { SchemaBuilder } from "@modules/_shared/jtd-schemas/SchemaBuilder";
+
+import { PreferredViewLayout } from "../typesAndEnums";
+
+import { dataProviderSerializedStateAtom, preferredViewLayoutAtom } from "./atoms/baseAtoms";
+import { selectedFieldIdentifierAtom } from "./atoms/persistableFixableAtoms";
+
+export type SerializedSettings = {
+    dataProviderSerializedState: string;
+    fieldIdentifier: string | null;
+    preferredViewLayout: PreferredViewLayout;
+};
+
+const schemaBuilder = new SchemaBuilder<SerializedSettings>(() => ({
+    properties: {
+        dataProviderSerializedState: {
+            type: "string",
+        },
+        fieldIdentifier: {
+            type: "string",
+            nullable: true,
+        },
+        preferredViewLayout: {
+            enum: [PreferredViewLayout.VERTICAL, PreferredViewLayout.HORIZONTAL],
+        },
+    },
+}));
+
+export const SERIALIZED_SETTINGS_SCHEMA = schemaBuilder.build();
+
+export const serializeSettings: SerializeStateFunction<SerializedSettings> = (get) => {
+    return {
+        dataProviderSerializedState: get(dataProviderSerializedStateAtom),
+        fieldIdentifier: get(selectedFieldIdentifierAtom).value,
+        preferredViewLayout: get(preferredViewLayoutAtom),
+    };
+};
+
+export const deserializeSettings: DeserializeStateFunction<SerializedSettings> = (raw, set) => {
+    setIfDefined(set, dataProviderSerializedStateAtom, raw.dataProviderSerializedState);
+    setIfDefined(set, selectedFieldIdentifierAtom, raw.fieldIdentifier);
+    setIfDefined(set, preferredViewLayoutAtom, raw.preferredViewLayout);
+};

frontend/src/modules/Intersection/settings/persistence.ts

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { useQueryClient } from "@tanstack/react-query";
-import { useAtom, useAtomValue, useSetAtom } from "jotai";
+import { useAtom } from "jotai";
 
 import { FieldDropdown } from "@framework/components/FieldDropdown";
 import type { ModuleSettingsProps } from "@framework/Module";
@@ -20,8 +20,8 @@ import { GroupType } from "@modules/_shared/DataProviderFramework/groups/groupTy
 
 import type { Interfaces } from "../interfaces";
 
-import { dataProviderManagerAtom, preferredViewLayoutAtom, userSelectedFieldIdentifierAtom } from "./atoms/baseAtoms";
-import { selectedFieldIdentifierAtom } from "./atoms/derivedAtoms";
+import { dataProviderManagerAtom, dataProviderSerializedStateAtom } from "./atoms/baseAtoms";
+import { selectedFieldIdentifierAtom } from "./atoms/persistableFixableAtoms";
 import { DataProviderManagerWrapper } from "./components/dataProviderManagerWrapper";
 
 export function Settings(props: ModuleSettingsProps<Interfaces>): JSX.Element {
@@ -30,35 +30,29 @@ export function Settings(props: ModuleSettingsProps<Interfaces>): JSX.Element {
     const colorSet = useColorSet(props.workbenchSettings);
 
     const [dataProviderManager, setDataProviderManager] = useAtom(dataProviderManagerAtom);
+    const [selectedFieldIdentifier, setSelectedFieldIdentifier] = useAtom(selectedFieldIdentifierAtom);
 
-    const selectedFieldIdentifier = useAtomValue(selectedFieldIdentifierAtom);
-    const setSelectedFieldIdentifier = useSetAtom(userSelectedFieldIdentifierAtom);
-    const [preferredViewLayout, setPreferredViewLayout] = useAtom(preferredViewLayoutAtom);
+    const [dataProviderSerializedState, setDataProviderSerializedState] = useAtom(dataProviderSerializedStateAtom);
+    const dataProviderSerializedStateRef = React.useRef(dataProviderSerializedState);
 
-    const persistState = React.useCallback(
+    const persistDataProviderManagerState = React.useCallback(
         function persistDataProviderManagerState() {
             if (!dataProviderManager) {
                 return;
             }
 
             const serializedState = {
                 dataProviderManager: dataProviderManager.serializeState(),
-                selectedFieldIdentifier,
-                preferredViewLayout,
             };
-            window.localStorage.setItem(
-                `${props.settingsContext.getInstanceIdString()}-settings`,
-                JSON.stringify(serializedState),
-            );
+            setDataProviderSerializedState(JSON.stringify(serializedState));
         },
-        [dataProviderManager, selectedFieldIdentifier, preferredViewLayout, props.settingsContext],
+        [dataProviderManager, setDataProviderSerializedState],
     );
 
     const applyPersistedState = React.useCallback(
         function applyPersistedState(dataProviderManager: DataProviderManager) {
-            const serializedState = window.localStorage.getItem(
-                `${props.settingsContext.getInstanceIdString()}-settings`,
-            );
+            const serializedState = dataProviderSerializedStateRef.current;
+
             if (!serializedState) {
                 const groupDelegate = dataProviderManager.getGroupDelegate();
 
@@ -80,21 +74,14 @@ export function Settings(props: ModuleSettingsProps<Interfaces>): JSX.Element {
             }
 
             const parsedState = JSON.parse(serializedState);
-            if (parsedState.fieldIdentifier) {
-                setSelectedFieldIdentifier(parsedState.fieldIdentifier);
-            }
-            if (parsedState.preferredViewLayout) {
-                setPreferredViewLayout(parsedState.preferredViewLayout);
-            }
-
             if (parsedState.dataProviderManager) {
                 if (!dataProviderManager) {
                     return;
                 }
                 dataProviderManager.deserializeState(parsedState.dataProviderManager);
             }
         },
-        [setSelectedFieldIdentifier, setPreferredViewLayout, props.settingsContext, colorSet],
+        [colorSet],
     );
 
     React.useEffect(
@@ -121,31 +108,31 @@ export function Settings(props: ModuleSettingsProps<Interfaces>): JSX.Element {
                 return;
             }
 
-            persistState();
+            persistDataProviderManagerState();
 
             const unsubscribeDataRev = dataProviderManager
                 .getPublishSubscribeDelegate()
-                .makeSubscriberFunction(DataProviderManagerTopic.DATA_REVISION)(persistState);
+                .makeSubscriberFunction(DataProviderManagerTopic.DATA_REVISION)(persistDataProviderManagerState);
 
             const unsubscribeExpands = dataProviderManager
                 .getGroupDelegate()
                 .getPublishSubscribeDelegate()
-                .makeSubscriberFunction(GroupDelegateTopic.CHILDREN_EXPANSION_STATES)(persistState);
+                .makeSubscriberFunction(GroupDelegateTopic.CHILDREN_EXPANSION_STATES)(persistDataProviderManagerState);
 
             return function onUnmountEffect() {
                 unsubscribeDataRev();
                 unsubscribeExpands();
             };
         },
-        [dataProviderManager, props.workbenchSession, props.workbenchSettings, persistState],
+        [dataProviderManager, props.workbenchSession, props.workbenchSettings, persistDataProviderManagerState],
     );
 
     React.useEffect(
         function onFieldIdentifierChangedEffect() {
             if (!dataProviderManager) {
                 return;
             }
-            dataProviderManager.updateGlobalSetting("fieldId", selectedFieldIdentifier);
+            dataProviderManager.updateGlobalSetting("fieldId", selectedFieldIdentifier.value);
         },
         [selectedFieldIdentifier, dataProviderManager],
     );
@@ -159,7 +146,7 @@ export function Settings(props: ModuleSettingsProps<Interfaces>): JSX.Element {
             <CollapsibleGroup title="Field" expanded>
                 <FieldDropdown
                     ensembleSet={ensembleSet}
-                    value={selectedFieldIdentifier}
+                    value={selectedFieldIdentifier.value}
                     onChange={handleFieldIdentifierChange}
                 />
             </CollapsibleGroup>

frontend/src/modules/Intersection/settings/settings.tsx

@@ -2,6 +2,7 @@
 // Generated by generateModuleSerializedStateMap CLI
 
 import type { SerializedSettings as M_2DViewerSettings } from "@modules/2DViewer/settings/persistence";
+import type { SerializedSettings as IntersectionSettings } from "@modules/Intersection/settings/persistence";
 import type { SerializedSettings as MyModuleSettings } from "@modules/MyModule/settings/persistence";
 import type { SerializedView as M_2DViewerView } from "@modules/2DViewer/view/persistence";
 
@@ -30,6 +31,10 @@ export type ModuleSerializedStateMap = {
     settings?: never,
     view?: never,
   },
+  "Grid3DIntersection": {
+    settings?: never,
+    view?: never,
+  },
   "InplaceVolumesPlot": {
     settings?: never,
     view?: never,
@@ -39,7 +44,7 @@ export type ModuleSerializedStateMap = {
     view?: never,
   },
   "Intersection": {
-    settings?: never,
+    settings?: Partial<IntersectionSettings>,
     view?: never,
   },
   "Map": {
@@ -82,6 +87,18 @@ export type ModuleSerializedStateMap = {
     settings?: never,
     view?: never,
   },
+  "SeismicIntersection": {
+    settings?: never,
+    view?: never,
+  },
+  "SeismicMap": {
+    settings?: never,
+    view?: never,
+  },
+  "Sensitivity": {
+    settings?: never,
+    view?: never,
+  },
   "SimulationTimeSeries": {
     settings?: never,
     view?: never,
@@ -90,6 +107,10 @@ export type ModuleSerializedStateMap = {
     settings?: never,
     view?: never,
   },
+  "StructuralUncertaintyIntersection": {
+    settings?: never,
+    view?: never,
+  },
   "SubsurfaceMap": {
     settings?: never,
     view?: never,
@@ -98,6 +119,10 @@ export type ModuleSerializedStateMap = {
     settings?: never,
     view?: never,
   },
+  "TopographicMap": {
+    settings?: never,
+    view?: never,
+  },
   "TornadoChart": {
     settings?: never,
     view?: never,