diff --git a/frontend/src/framework/internal/components/NavBar/private-components/UserSessionState.tsx b/frontend/src/framework/internal/components/NavBar/private-components/UserSessionState.tsx
index a0a71a129..35e611e56 100644
--- a/frontend/src/framework/internal/components/NavBar/private-components/UserSessionState.tsx
+++ b/frontend/src/framework/internal/components/NavBar/private-components/UserSessionState.tsx
@@ -1,23 +1,20 @@
import { Memory } from "@mui/icons-material";
-import { useQuery } from "@tanstack/react-query";
-import { apiService } from "@framework/ApiService";
+export const UserSessionState = ({ expanded }: { expanded: boolean }) => {
+ // const sessionState = useUserSessionState();
+ // const memoryPercent = Math.round(sessionState.data?.memorySystem?.percent) || "-"
+ // const cpuPercent = Math.round(sessionState.data?.cpuPercent) || "-"
+ const memoryPercent = "-";
+ const cpuPercent = "-";
-const useUserSessionState = () => useQuery({
- queryKey: ["default.userSessionContainer"],
- queryFn: () => apiService.default.userSessionContainer(),
- refetchInterval: 2000
-});
-
-export const UserSessionState = ({expanded}: {expanded: boolean}) => {
-
- const sessionState = useUserSessionState();
-
- const memoryPercent = Math.round(sessionState.data?.memorySystem?.percent) || "-"
- const cpuPercent = Math.round(sessionState.data?.cpuPercent) || "-"
-
- return ): ImportState => {
+export const useImportState = (moduleInstance: ModuleInstance): ImportState => {
const [importState, setImportState] = React.useState(moduleInstance.getImportState());
React.useEffect(() => {
diff --git a/frontend/src/framework/internal/hooks/workbenchHooks.ts b/frontend/src/framework/internal/hooks/workbenchHooks.ts
index 3fbba8d1c..73cceaa16 100644
--- a/frontend/src/framework/internal/hooks/workbenchHooks.ts
+++ b/frontend/src/framework/internal/hooks/workbenchHooks.ts
@@ -3,8 +3,8 @@ import React from "react";
import { ModuleInstance } from "@framework/ModuleInstance";
import { Workbench, WorkbenchEvents } from "@framework/Workbench";
-export function useModuleInstances(workbench: Workbench): ModuleInstance[] {
- const [moduleInstances, setModuleInstances] = React.useState[]>([]);
+export function useModuleInstances(workbench: Workbench): ModuleInstance[] {
+ const [moduleInstances, setModuleInstances] = React.useState[]>([]);
React.useEffect(() => {
function handleModuleInstancesChange() {
diff --git a/frontend/src/framework/internal/providers/QueryClientProvider.tsx b/frontend/src/framework/internal/providers/QueryClientProvider.tsx
index bb421a0b2..fedebb4fd 100644
--- a/frontend/src/framework/internal/providers/QueryClientProvider.tsx
+++ b/frontend/src/framework/internal/providers/QueryClientProvider.tsx
@@ -3,8 +3,12 @@ import React from "react";
import { QueryCache, QueryClient, QueryClientProvider } from "@tanstack/react-query";
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
+import { Provider } from "jotai";
+
import { AuthState, useAuthProvider } from "./AuthProvider";
+import { HydrateQueryClientAtom } from "../components/HydrateQueryClientAtom";
+
type QueryError = {
url: string;
status: number;
@@ -40,7 +44,9 @@ export const CustomQueryClientProvider: React.FC<{ children: React.ReactElement
return (
- {props.children}
+
+ {props.children}
+
);
diff --git a/frontend/src/framework/utils/atomUtils.ts b/frontend/src/framework/utils/atomUtils.ts
new file mode 100644
index 000000000..bfbf784ae
--- /dev/null
+++ b/frontend/src/framework/utils/atomUtils.ts
@@ -0,0 +1,59 @@
+import { DefaultError, QueryClient, QueryKey, QueryObserverOptions, QueryObserverResult } from "@tanstack/query-core";
+
+import { Atom, Getter, atom } from "jotai";
+import { atomWithQuery } from "jotai-tanstack-query";
+import { atomWithReducer } from "jotai/utils";
+
+export function atomWithCompare(initialValue: Value, areEqualFunc: (prev: Value, next: Value) => boolean) {
+ return atomWithReducer(initialValue, (prev: Value, next: Value) => {
+ if (areEqualFunc(prev, next)) {
+ return prev;
+ }
+
+ return next;
+ });
+}
+
+type QueriesOptions<
+ TQueryFnData = unknown,
+ TError = DefaultError,
+ TData = TQueryFnData,
+ TQueryData = TQueryFnData,
+ TQueryKey extends QueryKey = QueryKey
+> = ((get: Getter) => Omit, "suspense">)[];
+
+export function atomWithQueries<
+ TQueryFnData = unknown,
+ TError = DefaultError,
+ TData = TQueryFnData,
+ TQueryData = TQueryFnData,
+ TQueryKey extends QueryKey = QueryKey,
+ TCombinedResult = QueryObserverResult[]
+>(
+ getOptions: (get: Getter) => {
+ queries: readonly [...QueriesOptions];
+ combine?: (result: QueryObserverResult[]) => TCombinedResult;
+ },
+ getQueryClient?: (get: Getter) => QueryClient
+): Atom {
+ const optionsAtom = atom(getOptions);
+ const atoms = atom((get) => {
+ const options = get(optionsAtom);
+
+ const queries = options.queries.map((option) => {
+ return atomWithQuery(option, getQueryClient);
+ });
+
+ return queries;
+ });
+ return atom((get) => {
+ const options = get(optionsAtom);
+ const results = get(atoms).map((atom) => get(atom));
+
+ if (options.combine) {
+ return options.combine(results) as TCombinedResult;
+ }
+
+ return results as TCombinedResult;
+ });
+}
diff --git a/frontend/src/lib/components/Input/input.tsx b/frontend/src/lib/components/Input/input.tsx
index be81b0ccd..8391dab3b 100644
--- a/frontend/src/lib/components/Input/input.tsx
+++ b/frontend/src/lib/components/Input/input.tsx
@@ -38,21 +38,24 @@ export const Input = React.forwardRef((props: InputProps, ref: React.ForwardedRe
}, []);
const handleInputChange = React.useCallback(
- (event: React.ChangeEvent) => {
+ function handleInputChange(event: React.ChangeEvent) {
if (props.type === "number") {
- let newValue = parseFloat(event.target.value || "0");
- if (props.min !== undefined) {
- newValue = Math.max(props.min, newValue);
- }
+ let newValue = 0;
+ if (!isNaN(parseFloat(event.target.value))) {
+ newValue = parseFloat(event.target.value || "0");
+ if (props.min !== undefined) {
+ newValue = Math.max(props.min, newValue);
+ }
- if (props.max !== undefined) {
- newValue = Math.min(props.max, newValue);
+ if (props.max !== undefined) {
+ newValue = Math.min(props.max, newValue);
+ }
+ } else {
+ setValue(event.target.value);
+ return;
}
- if (newValue !== prevValue) {
- setValue(newValue);
- setPrevValue(newValue);
- }
+ setValue(newValue);
event.target.value = newValue.toString();
}
@@ -60,7 +63,7 @@ export const Input = React.forwardRef((props: InputProps, ref: React.ForwardedRe
onChange(event);
}
},
- [props.min, props.max, onChange, props.type, prevValue]
+ [props.min, props.max, onChange, props.type]
);
return (
@@ -103,8 +106,9 @@ export const Input = React.forwardRef((props: InputProps, ref: React.ForwardedRe
className: "grow",
},
input: {
- className:
- "h-full focus:border-indigo-500 block w-full sm:text-sm border-gray-300 outline-none",
+ className: resolveClassNames(
+ "h-full focus:border-indigo-500 block w-full sm:text-sm border-gray-300 outline-none"
+ ),
},
}}
/>
diff --git a/frontend/src/lib/components/PendingWrapper/pendingWrapper.tsx b/frontend/src/lib/components/PendingWrapper/pendingWrapper.tsx
index 8eaeca0a1..5ef3cd648 100644
--- a/frontend/src/lib/components/PendingWrapper/pendingWrapper.tsx
+++ b/frontend/src/lib/components/PendingWrapper/pendingWrapper.tsx
@@ -6,6 +6,7 @@ import { resolveClassNames } from "@lib/utils/resolveClassNames";
// Base state wrapper props
export type PendingWrapperProps = {
isPending: boolean;
+ errorMessage?: string;
children: React.ReactNode;
};
@@ -14,6 +15,7 @@ export const PendingWrapper: React.FC = (props) => {
);
diff --git a/frontend/src/lib/components/RadioGroup/index.ts b/frontend/src/lib/components/RadioGroup/index.ts
index 1301fddcb..9540de2ef 100644
--- a/frontend/src/lib/components/RadioGroup/index.ts
+++ b/frontend/src/lib/components/RadioGroup/index.ts
@@ -1 +1,2 @@
export { RadioGroup, Radio } from "./radioGroup";
+export type { RadioGroupProps, RadioProps, RadioGroupOption } from "./radioGroup";
diff --git a/frontend/src/lib/components/RadioGroup/radioGroup.tsx b/frontend/src/lib/components/RadioGroup/radioGroup.tsx
index 4592dd83e..a6b374632 100644
--- a/frontend/src/lib/components/RadioGroup/radioGroup.tsx
+++ b/frontend/src/lib/components/RadioGroup/radioGroup.tsx
@@ -6,33 +6,16 @@ import { v4 } from "uuid";
import { BaseComponent } from "../BaseComponent";
import { BaseComponentProps } from "../BaseComponent";
-import { OptionalValues, withDefaults } from "../_component-utils/components";
-export type RadioGroupProps
-
-}
+ return (
+
+
+ );
+};
diff --git a/frontend/src/framework/internal/hooks/moduleHooks.ts b/frontend/src/framework/internal/hooks/moduleHooks.ts
index 534258722..995e2f01b 100644
--- a/frontend/src/framework/internal/hooks/moduleHooks.ts
+++ b/frontend/src/framework/internal/hooks/moduleHooks.ts
@@ -3,7 +3,7 @@ import React from "react";
import { ImportState } from "@framework/Module";
import { ModuleInstance } from "@framework/ModuleInstance";
-export const useImportState = (moduleInstance: ModuleInstance
+
+
+
+
{props.isPending && (
@@ -21,6 +23,11 @@ export const PendingWrapper: React.FC = (props) => {
)}
+ {!props.isPending && props.errorMessage && (
+
+ {props.errorMessage}
+
+ )}
{props.children}
{props.options.map((option) => (
@@ -105,6 +102,4 @@ export const RadioGroup = withDefaults()(defaultProps, (props)
+
+
+ );
+};
+
export const ResizablePanels: React.FC
{props.children.map((el: React.ReactNode, index: number) => (
@@ -193,67 +329,12 @@ export const ResizablePanels: React.FC = (props) => {
diff --git a/frontend/src/modules/DbgWorkbenchSpy/implementation.tsx b/frontend/src/modules/DbgWorkbenchSpy/implementation.tsx
index 575705112..b7b0b5b7a 100644
--- a/frontend/src/modules/DbgWorkbenchSpy/implementation.tsx
+++ b/frontend/src/modules/DbgWorkbenchSpy/implementation.tsx
@@ -1,7 +1,7 @@
import React from "react";
import { EnsembleSet } from "@framework/EnsembleSet";
-import { ModuleFCProps } from "@framework/Module";
+import { ModuleSettingsProps, ModuleViewProps } from "@framework/Module";
import { AllTopicDefinitions, WorkbenchServices } from "@framework/WorkbenchServices";
import { useEnsembleSet } from "@framework/WorkbenchSession";
import { timestampUtcMsToIsoString } from "@framework/utils/timestampUtils";
@@ -12,8 +12,8 @@ export type SharedState = {
};
//-----------------------------------------------------------------------------------------------------------
-export function WorkbenchSpySettings(props: ModuleFCProps (resizablePanelRefs.current[index] = element)}
- style={
- props.direction === "horizontal"
- ? {
- width: `calc(${sizes[index]}% - 3px)`,
- minWidth:
- props.visible?.at(index) === false
- ? 0
- : sizes[index] > minSizesToggleVisibilityValue
- ? props.minSizes?.at(index) || 0
- : 0,
- maxWidth:
- (sizes[index] < minSizesToggleVisibilityValue && props.minSizes?.at(index)) ||
- props.visible?.at(index) === false
- ? 0
- : undefined,
- }
- : {
- height: `calc(${sizes[index]}% - 3px)`,
- minHeight:
- props.visible?.at(index) === false
- ? 0
- : sizes[index] > minSizesToggleVisibilityValue
- ? props.minSizes?.at(index) || 0
- : 0,
- maxHeight:
- (sizes[index] < minSizesToggleVisibilityValue && props.minSizes?.at(index)) ||
- props.visible?.at(index) === false
- ? 0
- : undefined,
- }
- }
+ ref={(element) => (individualPanelRefs.current[index] = element)}
+ style={makeStyle(index)}
>
{el}
- {index < props.children.length - 1 && (
-
-
-
- )}
+ {maybeMakeDragBar(index)}
))}
@@ -22,14 +22,14 @@ export function WorkbenchSpySettings(props: ModuleFCProps) {
}
//-----------------------------------------------------------------------------------------------------------
-export function WorkbenchSpyView(props: ModuleFCProps) {
+export function WorkbenchSpyView(props: ModuleViewProps) {
const ensembleSet = useEnsembleSet(props.workbenchSession);
const [hoverRealization, hoverRealization_TS] = useServiceValueWithTS(
"global.hoverRealization",
props.workbenchServices
);
const [hoverTimestamp, hoverTimestamp_TS] = useServiceValueWithTS("global.hoverTimestamp", props.workbenchServices);
- const triggeredRefreshCounter = props.moduleContext.useStoreValue("triggeredRefreshCounter");
+ const triggeredRefreshCounter = props.viewContext.useStoreValue("triggeredRefreshCounter");
const componentRenderCount = React.useRef(0);
React.useEffect(function incrementComponentRenderCount() {
@@ -48,7 +48,10 @@ export function WorkbenchSpyView(props: ModuleFCProps) {
{makeTableRow("hoverRealization", hoverRealization?.realization, hoverRealization_TS)}
{makeTableRow("hoverTimestamp", hoverTimestamp?.timestampUtcMs, hoverTimestamp_TS)}
- {makeTableRow("hoverTimestamp isoStr", hoverTimestamp ? timestampUtcMsToIsoString(hoverTimestamp.timestampUtcMs) : "UNDEF")}
+ {makeTableRow(
+ "hoverTimestamp isoStr",
+ hoverTimestamp ? timestampUtcMsToIsoString(hoverTimestamp.timestampUtcMs) : "UNDEF"
+ )}
diff --git a/frontend/src/modules/DistributionPlot/settings.tsx b/frontend/src/modules/DistributionPlot/settings.tsx index 14a220129..1109082d2 100644 --- a/frontend/src/modules/DistributionPlot/settings.tsx +++ b/frontend/src/modules/DistributionPlot/settings.tsx @@ -1,7 +1,7 @@ import React from "react"; import { useApplyInitialSettingsToState } from "@framework/InitialSettings"; -import { ModuleFCProps } from "@framework/Module"; +import { ModuleSettingsProps } from "@framework/Module"; import { CollapsibleGroup } from "@lib/components/CollapsibleGroup"; import { Dropdown } from "@lib/components/Dropdown"; import { Label } from "@lib/components/Label"; @@ -30,10 +30,10 @@ const plotTypes = [ ]; //----------------------------------------------------------------------------------------------------------- -export function Settings({ moduleContext, initialSettings }: ModuleFCProps) {
- const [plotType, setPlotType] = moduleContext.useStoreState("plotType");
- const [numBins, setNumBins] = moduleContext.useStoreState("numBins");
- const [orientation, setOrientation] = moduleContext.useStoreState("orientation");
+export function Settings({ settingsContext, initialSettings }: ModuleSettingsProps) {
+ const [plotType, setPlotType] = settingsContext.useStoreState("plotType");
+ const [numBins, setNumBins] = settingsContext.useStoreState("numBins");
+ const [orientation, setOrientation] = settingsContext.useStoreState("orientation");
useApplyInitialSettingsToState(initialSettings, "plotType", "string", setPlotType);
useApplyInitialSettingsToState(initialSettings, "numBins", "number", setNumBins);
diff --git a/frontend/src/modules/DistributionPlot/view.tsx b/frontend/src/modules/DistributionPlot/view.tsx
index 2b3e0b042..7bfc7b1c5 100644
--- a/frontend/src/modules/DistributionPlot/view.tsx
+++ b/frontend/src/modules/DistributionPlot/view.tsx
@@ -1,12 +1,13 @@
import React from "react";
import { ChannelReceiverChannelContent, KeyKind } from "@framework/DataChannelTypes";
-import { ModuleFCProps } from "@framework/Module";
+import { ModuleViewProps } from "@framework/Module";
import { useViewStatusWriter } from "@framework/StatusWriter";
import { Tag } from "@lib/components/Tag";
import { useElementSize } from "@lib/hooks/useElementSize";
import { ColorScaleGradientType } from "@lib/utils/ColorScale";
import { Size2D } from "@lib/utils/geometry";
+import { makeSubplots } from "@modules/_shared/Figure";
import { ContentInfo } from "@modules/_shared/components/ContentMessage";
import { ContentWarning } from "@modules/_shared/components/ContentMessage/contentMessage";
import { Warning } from "@mui/icons-material";
@@ -14,7 +15,6 @@ import { Warning } from "@mui/icons-material";
import { Layout, PlotData } from "plotly.js";
import { PlotType, State } from "./state";
-import { makeSubplots } from "./utils/Figure";
import { makeHistogramTrace } from "./utils/histogram";
import { makeHoverText, makeHoverTextWithColor, makeTitleFromChannelContent } from "./utils/stringUtils";
import { calcTextSize } from "./utils/textSize";
@@ -33,7 +33,7 @@ const MaxNumberPlotsExceededMessage: React.FC = () => {
MaxNumberPlotsExceededMessage.displayName = "MaxNumberPlotsExceededMessage";
-export const View = ({ moduleContext, workbenchSettings }: ModuleFCProps) => {
+export const View = ({ viewContext, workbenchSettings }: ModuleViewProps) => {
const [isPending, startTransition] = React.useTransition();
const [content, setContent] = React.useState(null);
const [revNumberX, setRevNumberX] = React.useState(0);
@@ -44,11 +44,11 @@ export const View = ({ moduleContext, workbenchSettings }: ModuleFCProps)
const [prevOrientation, setPrevOrientation] = React.useState<"v" | "h" | null>(null);
const [prevSize, setPrevSize] = React.useState(null);
- const plotType = moduleContext.useStoreValue("plotType");
- const numBins = moduleContext.useStoreValue("numBins");
- const orientation = moduleContext.useStoreValue("orientation");
+ const plotType = viewContext.useStoreValue("plotType");
+ const numBins = viewContext.useStoreValue("numBins");
+ const orientation = viewContext.useStoreValue("orientation");
- const statusWriter = useViewStatusWriter(moduleContext);
+ const statusWriter = useViewStatusWriter(viewContext);
const colorSet = workbenchSettings.useColorSet();
const seqColorScale = workbenchSettings.useContinuousColorScale({
@@ -58,15 +58,15 @@ export const View = ({ moduleContext, workbenchSettings }: ModuleFCProps)
const wrapperDivRef = React.useRef(null);
const wrapperDivSize = useElementSize(wrapperDivRef);
- const receiverX = moduleContext.useChannelReceiver({
+ const receiverX = viewContext.useChannelReceiver({
receiverIdString: "channelX",
expectedKindsOfKeys: [KeyKind.REALIZATION],
});
- const receiverY = moduleContext.useChannelReceiver({
+ const receiverY = viewContext.useChannelReceiver({
receiverIdString: "channelY",
expectedKindsOfKeys: [KeyKind.REALIZATION],
});
- const receiverColorMapping = moduleContext.useChannelReceiver({
+ const receiverColorMapping = viewContext.useChannelReceiver({
receiverIdString: "channelColorMapping",
expectedKindsOfKeys: [KeyKind.REALIZATION],
});
diff --git a/frontend/src/modules/Grid3D/queryHooks.ts b/frontend/src/modules/Grid3D/queryHooks.ts
index 88e217ff5..3efe5c4c8 100644
--- a/frontend/src/modules/Grid3D/queryHooks.ts
+++ b/frontend/src/modules/Grid3D/queryHooks.ts
@@ -15,7 +15,7 @@ export function useGridSurface(
return useQuery({
queryKey: ["getGridSurface", caseUuid, ensembleName, gridName, realization],
queryFn: () =>
- apiService.grid.gridSurface(caseUuid ?? "", ensembleName ?? "", gridName ?? "", realization ?? ""),
+ apiService.grid3D.gridSurface(caseUuid ?? "", ensembleName ?? "", gridName ?? "", realization ?? ""),
select: transformGridSurface,
staleTime: STALE_TIME,
gcTime: 0,
@@ -29,12 +29,11 @@ export function useGridParameter(
gridName: string | null,
parameterName: string | null,
realization: string | null,
- useStatistics: boolean
): UseQueryResult {
return useQuery({
queryKey: ["getGridParameter", caseUuid, ensembleName, gridName, parameterName, realization],
queryFn: () =>
- apiService.grid.gridParameter(
+ apiService.grid3D.gridParameter(
caseUuid ?? "",
ensembleName ?? "",
gridName ?? "",
@@ -43,38 +42,14 @@ export function useGridParameter(
),
staleTime: STALE_TIME,
gcTime: 0,
- enabled: caseUuid && ensembleName && gridName && parameterName && realization && !useStatistics ? true : false,
- });
-}
-
-export function useStatisticalGridParameter(
- caseUuid: string | null,
- ensembleName: string | null,
- gridName: string | null,
- parameterName: string | null,
- realizations: string[] | null,
- useStatistics: boolean
-): UseQueryResult {
- return useQuery({
- queryKey: ["getStatisticalGridParameter", caseUuid, ensembleName, gridName, parameterName, realizations],
- queryFn: () =>
- apiService.grid.statisticalGridParameter(
- caseUuid ?? "",
- ensembleName ?? "",
- gridName ?? "",
- parameterName ?? "",
- realizations ?? []
- ),
- staleTime: STALE_TIME,
- gcTime: 0,
- enabled: caseUuid && ensembleName && gridName && parameterName && realizations && useStatistics ? true : false,
+ enabled: caseUuid && ensembleName && gridName && parameterName && realization ? true : false,
});
}
export function useGridModelNames(caseUuid: string | null, ensembleName: string | null): UseQueryResult {
return useQuery({
queryKey: ["getGridModelNames", caseUuid, ensembleName],
- queryFn: () => apiService.grid.getGridModelNames(caseUuid ?? "", ensembleName ?? ""),
+ queryFn: () => apiService.grid3D.getGridModelNames(caseUuid ?? "", ensembleName ?? ""),
staleTime: STALE_TIME,
gcTime: CACHE_TIME,
enabled: caseUuid && ensembleName ? true : false,
@@ -88,7 +63,7 @@ export function useGridParameterNames(
): UseQueryResult {
return useQuery({
queryKey: ["getParameterNames", caseUuid, ensembleName, gridName],
- queryFn: () => apiService.grid.getParameterNames(caseUuid ?? "", ensembleName ?? "", gridName ?? ""),
+ queryFn: () => apiService.grid3D.getParameterNames(caseUuid ?? "", ensembleName ?? "", gridName ?? ""),
staleTime: STALE_TIME,
gcTime: CACHE_TIME,
enabled: caseUuid && ensembleName && gridName ? true : false,
diff --git a/frontend/src/modules/Grid3D/settings.tsx b/frontend/src/modules/Grid3D/settings.tsx
index fab0d73e0..917ed4c64 100644
--- a/frontend/src/modules/Grid3D/settings.tsx
+++ b/frontend/src/modules/Grid3D/settings.tsx
@@ -1,7 +1,7 @@
import React from "react";
import { EnsembleIdent } from "@framework/EnsembleIdent";
-import { ModuleFCProps } from "@framework/Module";
+import { ModuleSettingsProps } from "@framework/Module";
import { SyncSettingKey, SyncSettingsHelper } from "@framework/SyncSettings";
import { useEnsembleSet } from "@framework/WorkbenchSession";
import { fixupEnsembleIdent, maybeAssignFirstSyncedEnsemble } from "@framework/utils/ensembleUiHelpers";
@@ -18,18 +18,18 @@ import { useGridModelNames, useGridParameterNames } from "./queryHooks";
import state from "./state";
//-----------------------------------------------------------------------------------------------------------
-export function Settings({ moduleContext, workbenchServices, workbenchSession }: ModuleFCProps) {
+export function Settings({ settingsContext, workbenchServices, workbenchSession }: ModuleSettingsProps) {
// From Workbench
const ensembleSet = useEnsembleSet(workbenchSession);
const [selectedEnsembleIdent, setSelectedEnsembleIdent] = React.useState(null);
// State
- const [gridName, setGridName] = moduleContext.useStoreState("gridName");
- const [parameterName, setParameterName] = moduleContext.useStoreState("parameterName");
- const [realizations, setRealizations] = moduleContext.useStoreState("realizations");
- const [useStatistics, setUseStatistics] = moduleContext.useStoreState("useStatistics");
- const [selectedWellUuids, setSelectedWellUuids] = moduleContext.useStoreState("selectedWellUuids");
- const syncedSettingKeys = moduleContext.useSyncedSettingKeys();
+ const [gridName, setGridName] = settingsContext.useStoreState("gridName");
+ const [parameterName, setParameterName] = settingsContext.useStoreState("parameterName");
+ const [realizations, setRealizations] = settingsContext.useStoreState("realizations");
+ const [useStatistics, setUseStatistics] = settingsContext.useStoreState("useStatistics");
+ const [selectedWellUuids, setSelectedWellUuids] = settingsContext.useStoreState("selectedWellUuids");
+ const syncedSettingKeys = settingsContext.useSyncedSettingKeys();
const syncHelper = new SyncSettingsHelper(syncedSettingKeys, workbenchServices);
const syncedValueEnsembles = syncHelper.useValue(SyncSettingKey.ENSEMBLE, "global.syncValue.ensembles");
diff --git a/frontend/src/modules/Grid3D/view.tsx b/frontend/src/modules/Grid3D/view.tsx
index 06afb2eb4..12790d2d6 100644
--- a/frontend/src/modules/Grid3D/view.tsx
+++ b/frontend/src/modules/Grid3D/view.tsx
@@ -1,6 +1,6 @@
import { WellBoreTrajectory_api } from "@api";
import { ContinuousLegend } from "@emerson-eps/color-tables";
-import { ModuleFCProps } from "@framework/Module";
+import { ModuleViewProps } from "@framework/Module";
import { useFirstEnsembleInEnsembleSet } from "@framework/WorkbenchSession";
import { ColorScaleGradientType } from "@lib/utils/ColorScale";
import {
@@ -13,12 +13,12 @@ import { useFieldWellsTrajectoriesQuery } from "@modules/_shared/WellBore/queryH
import SubsurfaceViewer from "@webviz/subsurface-viewer";
import { ViewAnnotation } from "@webviz/subsurface-viewer/dist/components/ViewAnnotation";
-import { useGridParameter, useGridSurface, useStatisticalGridParameter } from "./queryHooks";
+import { useGridParameter, useGridSurface } from "./queryHooks";
import state from "./state";
//-----------------------------------------------------------------------------------------------------------
-export function View({ moduleContext, workbenchSettings, workbenchSession }: ModuleFCProps) {
- const myInstanceIdStr = moduleContext.getInstanceIdString();
+export function View({ viewContext, workbenchSettings, workbenchSession }: ModuleViewProps) {
+ const myInstanceIdStr = viewContext.getInstanceIdString();
const viewIds = {
view: `${myInstanceIdStr}--view`,
annotation: `${myInstanceIdStr}--annotation`,
@@ -27,11 +27,10 @@ export function View({ moduleContext, workbenchSettings, workbenchSession }: Mod
const firstEnsemble = useFirstEnsembleInEnsembleSet(workbenchSession);
// State
- const gridName = moduleContext.useStoreValue("gridName");
- const parameterName = moduleContext.useStoreValue("parameterName");
- const realizations = moduleContext.useStoreValue("realizations");
- const useStatistics = moduleContext.useStoreValue("useStatistics");
- const selectedWellUuids = moduleContext.useStoreValue("selectedWellUuids");
+ const gridName = viewContext.useStoreValue("gridName");
+ const parameterName = viewContext.useStoreValue("parameterName");
+ const realizations = viewContext.useStoreValue("realizations");
+ const selectedWellUuids = viewContext.useStoreValue("selectedWellUuids");
const colorScale = workbenchSettings.useContinuousColorScale({
gradientType: ColorScaleGradientType.Sequential,
});
@@ -51,16 +50,7 @@ export function View({ moduleContext, workbenchSettings, workbenchSession }: Mod
firstEnsembleName,
gridName,
parameterName,
- realizations ? realizations[0] : "0",
- useStatistics
- );
- const statisticalGridParameterQuery = useStatisticalGridParameter(
- firstCaseUuid,
- firstEnsembleName,
- gridName,
- parameterName,
- realizations,
- useStatistics
+ realizations ? realizations[0] : "0"
);
const wellTrajectoriesQuery = useFieldWellsTrajectoriesQuery(firstCaseUuid ?? undefined);
const bounds = gridSurfaceQuery?.data
@@ -84,10 +74,8 @@ export function View({ moduleContext, workbenchSettings, workbenchSession }: Mod
];
let propertiesArray: number[] = [0, 1];
- if (!useStatistics && gridParameterQuery?.data) {
+ if (gridParameterQuery?.data) {
propertiesArray = Array.from(gridParameterQuery.data);
- } else if (useStatistics && statisticalGridParameterQuery?.data) {
- propertiesArray = Array.from(statisticalGridParameterQuery.data);
}
if (gridSurfaceQuery.data) {
@@ -125,7 +113,6 @@ export function View({ moduleContext, workbenchSettings, workbenchSession }: Mod
bounds={[bounds[0], bounds[1], bounds[3], bounds[4]]}
colorTables={colorTables}
layers={newLayers}
- toolbar={{ visible: true }}
views={{
layout: [1, 1],
showLabel: false,
@@ -151,7 +138,7 @@ export function View({ moduleContext, workbenchSettings, workbenchSession }: Mod
-
);
}
diff --git a/frontend/src/modules/Grid3DIntersection/plotlyGridIntersection.tsx b/frontend/src/modules/Grid3DIntersection/plotlyGridIntersection.tsx
index 16dbf22ec..0116c57dc 100644
--- a/frontend/src/modules/Grid3DIntersection/plotlyGridIntersection.tsx
+++ b/frontend/src/modules/Grid3DIntersection/plotlyGridIntersection.tsx
@@ -1,12 +1,12 @@
import React from "react";
import Plot from "react-plotly.js";
-import { GridIntersection_api } from "@api";
+import { GridIntersectionVtk_api } from "@api";
import { Layout, PlotData } from "plotly.js";
export interface PlotlyGridIntersectionProps {
- data: GridIntersection_api;
+ data: GridIntersectionVtk_api;
width?: number | 100;
height?: number | 100;
}
diff --git a/frontend/src/modules/Grid3DIntersection/queryHooks.ts b/frontend/src/modules/Grid3DIntersection/queryHooks.ts
index 28b19c30a..237aec063 100644
--- a/frontend/src/modules/Grid3DIntersection/queryHooks.ts
+++ b/frontend/src/modules/Grid3DIntersection/queryHooks.ts
@@ -1,4 +1,4 @@
-import { GridIntersection_api } from "@api";
+import { GridIntersectionVtk_api } from "@api";
import { apiService } from "@framework/ApiService";
import { UseQueryResult, useQuery } from "@tanstack/react-query";
@@ -12,11 +12,11 @@ export function useGridIntersection(
parameterName: string | null,
realization: string | null,
useStatistics: boolean
-): UseQueryResultdiff --git a/frontend/src/modules/DistributionPlot/settings.tsx b/frontend/src/modules/DistributionPlot/settings.tsx index 14a220129..1109082d2 100644 --- a/frontend/src/modules/DistributionPlot/settings.tsx +++ b/frontend/src/modules/DistributionPlot/settings.tsx @@ -1,7 +1,7 @@ import React from "react"; import { useApplyInitialSettingsToState } from "@framework/InitialSettings"; -import { ModuleFCProps } from "@framework/Module"; +import { ModuleSettingsProps } from "@framework/Module"; import { CollapsibleGroup } from "@lib/components/CollapsibleGroup"; import { Dropdown } from "@lib/components/Dropdown"; import { Label } from "@lib/components/Label"; @@ -30,10 +30,10 @@ const plotTypes = [ ]; //----------------------------------------------------------------------------------------------------------- -export function Settings({ moduleContext, initialSettings }: ModuleFCProps
{moduleContext.getInstanceIdString()}
+ {viewContext.getInstanceIdString()}
{moduleContext.getInstanceIdString()}
+ {viewContext.getInstanceIdString()}
+
+
+ ) => setUseStatistics(event.target.checked)}
+ />
+ {"(Select multiple realizations)"}
+
+
+
+
+
+
+ );
+}
+
+const stringToOptions = (strings: string[]): SelectOption[] => {
+ return strings.map((string) => ({ label: string, value: string }));
+};
diff --git a/frontend/src/modules/Grid3DVTK/state.ts b/frontend/src/modules/Grid3DVTK/state.ts
new file mode 100644
index 000000000..1a1e52b95
--- /dev/null
+++ b/frontend/src/modules/Grid3DVTK/state.ts
@@ -0,0 +1,7 @@
+export default interface state {
+ gridName: string | null;
+ parameterName: string | null;
+ selectedWellUuids: string[];
+ realizations: string[] | null;
+ useStatistics: boolean;
+}
diff --git a/frontend/src/modules/Grid3DVTK/view.tsx b/frontend/src/modules/Grid3DVTK/view.tsx
new file mode 100644
index 000000000..eb301422d
--- /dev/null
+++ b/frontend/src/modules/Grid3DVTK/view.tsx
@@ -0,0 +1,156 @@
+import { WellBoreTrajectory_api } from "@api";
+import { ContinuousLegend } from "@emerson-eps/color-tables";
+import { ModuleViewProps } from "@framework/Module";
+import { useFirstEnsembleInEnsembleSet } from "@framework/WorkbenchSession";
+import { ColorScaleGradientType } from "@lib/utils/ColorScale";
+import {
+ createContinuousColorScaleForMap,
+ createNorthArrowLayer,
+ createWellBoreHeaderLayer,
+ createWellboreTrajectoryLayer,
+} from "@modules/SubsurfaceMap/_utils";
+import { useFieldWellsTrajectoriesQuery } from "@modules/_shared/WellBore/queryHooks";
+import SubsurfaceViewer from "@webviz/subsurface-viewer";
+import { ViewAnnotation } from "@webviz/subsurface-viewer/dist/components/ViewAnnotation";
+
+import { useGridParameterVtk, useGridSurfaceVtk, useStatisticalGridParameterVtk } from "./queryHooks";
+import state from "./state";
+
+//-----------------------------------------------------------------------------------------------------------
+export function View({ viewContext, workbenchSettings, workbenchSession }: ModuleViewProps
+ layer.id) as string[],
+ },
+ ],
+ }}
+ >
+ {" "}
+
+
+
+
+
+ );
+}
diff --git a/frontend/src/modules/InplaceVolumetrics/settings.tsx b/frontend/src/modules/InplaceVolumetrics/settings.tsx
index 15ce7eb8a..a115b5ed6 100644
--- a/frontend/src/modules/InplaceVolumetrics/settings.tsx
+++ b/frontend/src/modules/InplaceVolumetrics/settings.tsx
@@ -2,9 +2,9 @@ import React from "react";
import { InplaceVolumetricsCategoricalMetaData_api, InplaceVolumetricsTableMetaData_api } from "@api";
import { EnsembleIdent } from "@framework/EnsembleIdent";
-import { ModuleFCProps } from "@framework/Module";
+import { ModuleSettingsProps } from "@framework/Module";
import { useEnsembleSet } from "@framework/WorkbenchSession";
-import { SingleEnsembleSelect } from "@framework/components/SingleEnsembleSelect";
+import { EnsembleDropdown } from "@framework/components/EnsembleDropdown";
import { fixupEnsembleIdent } from "@framework/utils/ensembleUiHelpers";
import { CircularProgress } from "@lib/components/CircularProgress";
import { Dropdown } from "@lib/components/Dropdown";
@@ -96,12 +96,12 @@ function getTableResponseOptions(
return responsesToSelectOptions(responses);
}
-export function Settings({ moduleContext, workbenchSession }: ModuleFCProps{viewContext.getInstanceIdString()}
+