(
props.colorScaleSpecification?.colorScale.getGradientType() === ColorScaleGradientType.Diverging
? props.colorScaleSpecification?.colorScale.getColorPalette()
- : props.workbenchSettings.getColorPalettes()[ColorPaletteType.ContinuousDiverging][0] ?? ""
+ : (props.workbenchSettings.getColorPalettes()[ColorPaletteType.ContinuousDiverging][0] ?? ""),
);
if (!isEqual(props.colorScaleSpecification, prevColorScaleSpecification)) {
@@ -163,7 +163,7 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
colorScaleSpecification.colorScale.getMax(),
colorScaleSpecification.colorScale.getNumSteps(),
colorScaleSpecification.colorScale.getDivMidPoint(),
- colorScaleSpecification.areBoundariesUserDefined
+ colorScaleSpecification.areBoundariesUserDefined,
);
}
@@ -181,7 +181,7 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
colorScaleSpecification.colorScale.getMax(),
colorScaleSpecification.colorScale.getNumSteps(),
colorScaleSpecification.colorScale.getDivMidPoint(),
- colorScaleSpecification.areBoundariesUserDefined
+ colorScaleSpecification.areBoundariesUserDefined,
);
}
@@ -199,7 +199,7 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
colorScaleSpecification.colorScale.getMax(),
colorScaleSpecification.colorScale.getNumSteps(),
colorScaleSpecification.colorScale.getDivMidPoint(),
- colorScaleSpecification.areBoundariesUserDefined
+ colorScaleSpecification.areBoundariesUserDefined,
);
}
@@ -212,7 +212,7 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
colorScaleSpecification.colorScale.getMax(),
numSteps,
colorScaleSpecification.colorScale.getDivMidPoint(),
- colorScaleSpecification.areBoundariesUserDefined
+ colorScaleSpecification.areBoundariesUserDefined,
);
}
@@ -225,7 +225,7 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
max: number,
numSteps: number,
divMid: number,
- areBoundariesUserDefined: boolean
+ areBoundariesUserDefined: boolean,
) {
const colorScale = new ColorScale({
colorPalette,
@@ -244,7 +244,7 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
onChange(colorScaleSpecification);
}
},
- [onChange]
+ [onChange],
);
const handleMinMaxDivMidPointChange = React.useCallback(
@@ -257,10 +257,10 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
max,
colorScaleSpecification.colorScale.getNumSteps(),
divMidPoint ?? colorScaleSpecification.colorScale.getDivMidPoint(),
- colorScaleSpecification.areBoundariesUserDefined
+ colorScaleSpecification.areBoundariesUserDefined,
);
},
- [colorScaleSpecification, makeAndPropagateColorScale]
+ [colorScaleSpecification, makeAndPropagateColorScale],
);
const handleAreBoundariesUserDefinedChange = React.useCallback(
@@ -273,10 +273,10 @@ function ColorScaleSelectorDialog(props: ColorScaleSelectorProps): React.ReactNo
colorScaleSpecification.colorScale.getMax(),
colorScaleSpecification.colorScale.getNumSteps(),
colorScaleSpecification.colorScale.getDivMidPoint(),
- areBoundariesUserDefined
+ areBoundariesUserDefined,
);
},
- [colorScaleSpecification, makeAndPropagateColorScale]
+ [colorScaleSpecification, makeAndPropagateColorScale],
);
return (
@@ -387,15 +387,14 @@ function ColorScaleSetter(props: ColorScaleSetterProps): React.ReactNode {
const handleMinMaxDivMidPointChange = React.useCallback(function handleMinMaxDivMidPointChange(
min: number,
max: number,
- divMidPoint?: number
+ divMidPoint?: number,
) {
setMin(min);
setMax(max);
if (divMidPoint !== undefined) {
setDivMidPoint(divMidPoint);
}
- },
- []);
+ }, []);
return (
@@ -439,10 +438,10 @@ function MinMaxDivMidPointSetter(props: MinMaxDivMidPointSetterProps): React.Rea
const [divMidPoint, setDivMidPoint] = React.useState(props.divMidPoint);
const [prevDivMidPoint, setPrevDivMidPoint] = React.useState(props.divMidPoint);
const [areBoundariesUserDefined, setAreBoundariesUserDefined] = React.useState(
- props.areBoundariesUserDefined
+ props.areBoundariesUserDefined,
);
const [prevAreBoundariesUserDefined, setPrevAreBoundariesUserDefined] = React.useState(
- props.areBoundariesUserDefined
+ props.areBoundariesUserDefined,
);
const [isDragging, setIsDragging] = React.useState(false);
@@ -520,7 +519,7 @@ function MinMaxDivMidPointSetter(props: MinMaxDivMidPointSetterProps): React.Rea
const newRelativeDivMidPoint = Math.min(
Math.max((dx + convertRemToPixels(0.75) - containerRect.left) / containerRect.width, 0),
- 1
+ 1,
);
newDivMidPoint = min + newRelativeDivMidPoint * (max - min);
@@ -550,7 +549,7 @@ function MinMaxDivMidPointSetter(props: MinMaxDivMidPointSetterProps): React.Rea
document.removeEventListener("pointerup", handlePointerUp);
};
},
- [onChange, onChangePreview, min, max]
+ [onChange, onChangePreview, min, max],
);
function handleMinChange(value: string) {
@@ -609,7 +608,7 @@ function MinMaxDivMidPointSetter(props: MinMaxDivMidPointSetterProps): React.Rea
"z-50": isDragging,
hidden:
props.gradientType === ColorScaleGradientType.Sequential || !areBoundariesUserDefined,
- }
+ },
)}
style={{ left: `${(Math.abs(divMidPoint - min) / Math.abs(max - min)) * 100}%` }}
ref={divMidPointRef}
@@ -677,7 +676,7 @@ const ColorScalePaletteSelector: React.FC = (pro
const [open, setOpen] = React.useState(false);
const [selectedColorPalette, setSelectedColorPalette] = React.useState(props.selectedColorPalette);
const [prevSelectedColorPalette, setPrevSelectedColorPalette] = React.useState(
- props.selectedColorPalette
+ props.selectedColorPalette,
);
if (prevSelectedColorPalette.getId() !== props.selectedColorPalette.getId()) {
@@ -769,7 +768,7 @@ const ColorScalePaletteSelector: React.FC = (pro
>
{renderColorPalettes()}
-
+ ,
)}
);
diff --git a/frontend/src/framework/internal/components/Content/private-components/layout.tsx b/frontend/src/framework/internal/components/Content/private-components/layout.tsx
index 4b8748488..a2f059e3c 100644
--- a/frontend/src/framework/internal/components/Content/private-components/layout.tsx
+++ b/frontend/src/framework/internal/components/Content/private-components/layout.tsx
@@ -14,7 +14,7 @@ import type { Rect2D, Size2D } from "@lib/utils/geometry";
import { MANHATTAN_LENGTH, addMarginToRect, pointRelativeToDomRect, rectContainsPoint } from "@lib/utils/geometry";
import { convertRemToPixels } from "@lib/utils/screenUnitConversions";
import type { Vec2 } from "@lib/utils/vec2";
-import { multiplyVec2, point2Distance, scaleVec2NonUniform, subtractVec2, vec2FromPointerEvent } from "@lib/utils/vec2";
+import { multiplyElementWiseVec2, point2Distance, scaleVec2NonUniform, subtractVec2, vec2FromPointerEvent } from "@lib/utils/vec2";
import { ViewWrapper } from "./ViewWrapper";
import { ViewWrapperPlaceholder } from "./viewWrapperPlaceholder";
@@ -91,7 +91,7 @@ export const Layout: React.FC = (props) => {
setPosition(
subtractVec2(
relativePointerPosition,
- multiplyVec2(relativePointerToElementDiff, {
+ multiplyElementWiseVec2(relativePointerToElementDiff, {
x: draggedElementSize.width,
y: 1,
}),
@@ -193,7 +193,7 @@ export const Layout: React.FC = (props) => {
setPosition(
subtractVec2(
relativePointerPosition,
- multiplyVec2(relativePointerToElementDiff, {
+ multiplyElementWiseVec2(relativePointerToElementDiff, {
x: draggedElementSize.width,
y: 1,
}),
diff --git a/frontend/src/framework/userCreatedItems/IntersectionPolylines.ts b/frontend/src/framework/userCreatedItems/IntersectionPolylines.ts
index 7c02070ca..721add8dd 100644
--- a/frontend/src/framework/userCreatedItems/IntersectionPolylines.ts
+++ b/frontend/src/framework/userCreatedItems/IntersectionPolylines.ts
@@ -1,5 +1,5 @@
import { atom } from "jotai";
-import { cloneDeep } from "lodash";
+import { cloneDeep, isEqual } from "lodash";
import { v4 } from "uuid";
import type { AtomStoreMaster } from "@framework/AtomStoreMaster";
@@ -8,6 +8,7 @@ import type { UserCreatedItemSet } from "@framework/UserCreatedItems";
export type IntersectionPolyline = {
id: string;
name: string;
+ color: [number, number, number];
path: number[][];
fieldId: string;
};
@@ -55,7 +56,15 @@ export class IntersectionPolylines implements UserCreatedItemSet {
this.notifySubscribers(IntersectionPolylinesEvent.CHANGE);
}
- getPolylines(): IntersectionPolyline[] {
+ setPolylines(polylines: IntersectionPolyline[]): void {
+ if (isEqual(this._polylines, polylines)) {
+ return;
+ }
+ this._polylines = polylines;
+ this.notifySubscribers(IntersectionPolylinesEvent.CHANGE);
+ }
+
+ getPolylines(): readonly IntersectionPolyline[] {
return this._polylines;
}
diff --git a/frontend/src/lib/components/ToggleButton/toggleButton.tsx b/frontend/src/lib/components/ToggleButton/toggleButton.tsx
index 4215f501b..f7381b134 100644
--- a/frontend/src/lib/components/ToggleButton/toggleButton.tsx
+++ b/frontend/src/lib/components/ToggleButton/toggleButton.tsx
@@ -14,6 +14,12 @@ export type ToggleButtonProps = ButtonUnstyledProps & {
function ToggleButtonComponent(props: ToggleButtonProps, ref: React.ForwardedRef) {
const { active, onToggle, ...other } = props;
const [isActive, setIsActive] = React.useState(active);
+ const [prevActive, setPrevActive] = React.useState(active);
+
+ if (active !== prevActive) {
+ setIsActive(active);
+ setPrevActive(active);
+ }
const buttonRef = React.useRef(null);
React.useImperativeHandle(
diff --git a/frontend/src/lib/icons/icons/addPathPointIcon.tsx b/frontend/src/lib/icons/icons/addPathPointIcon.tsx
new file mode 100644
index 000000000..77d5da3be
--- /dev/null
+++ b/frontend/src/lib/icons/icons/addPathPointIcon.tsx
@@ -0,0 +1,11 @@
+import { createSvgIcon } from "@mui/material";
+
+export const AddPathPointIcon = createSvgIcon(
+ ,
+ "AddPathPoint"
+);
diff --git a/frontend/src/lib/icons/icons/pathIcon.tsx b/frontend/src/lib/icons/icons/pathIcon.tsx
new file mode 100644
index 000000000..39b6d38b0
--- /dev/null
+++ b/frontend/src/lib/icons/icons/pathIcon.tsx
@@ -0,0 +1,10 @@
+import { createSvgIcon } from "@mui/material";
+
+export const DrawPathIcon = createSvgIcon(
+ ,
+ "DrawPath"
+);
diff --git a/frontend/src/lib/icons/icons/removePathPointIcon.tsx b/frontend/src/lib/icons/icons/removePathPointIcon.tsx
new file mode 100644
index 000000000..c643ac9e6
--- /dev/null
+++ b/frontend/src/lib/icons/icons/removePathPointIcon.tsx
@@ -0,0 +1,11 @@
+import { createSvgIcon } from "@mui/material";
+
+export const RemovePathPointIcon = createSvgIcon(
+ ,
+ "RemovePathPoint"
+);
diff --git a/frontend/src/lib/icons/index.ts b/frontend/src/lib/icons/index.ts
new file mode 100644
index 000000000..efa0a00f2
--- /dev/null
+++ b/frontend/src/lib/icons/index.ts
@@ -0,0 +1,3 @@
+export { DrawPathIcon } from "./icons/pathIcon";
+export { AddPathPointIcon } from "./icons/addPathPointIcon";
+export { RemovePathPointIcon } from "./icons/removePathPointIcon";
diff --git a/frontend/src/lib/utils/boundingBox.ts b/frontend/src/lib/utils/boundingBox.ts
new file mode 100644
index 000000000..b71dddf23
--- /dev/null
+++ b/frontend/src/lib/utils/boundingBox.ts
@@ -0,0 +1,117 @@
+import { BoundingBox3D_api } from "@api";
+
+import * as vec3 from "./vec3";
+
+export type BBox = {
+ min: vec3.Vec3;
+ max: vec3.Vec3;
+};
+
+/**
+ * Creates a new bounding box.
+ * @param min The minimum point of the bounding box.
+ * @param max The maximum point of the bounding box.
+ * @returns A new bounding box.
+ */
+export function create(min: vec3.Vec3, max: vec3.Vec3): BBox {
+ return { min, max };
+}
+
+export function fromBoundingBox3DApi(boundingBox: BoundingBox3D_api): BBox {
+ return create(
+ vec3.create(boundingBox.xmin, boundingBox.ymin, boundingBox.zmin),
+ vec3.create(boundingBox.xmax, boundingBox.ymax, boundingBox.zmax)
+ );
+}
+
+export function fromBoundingBox2DApi(boundingBox: BoundingBox3D_api): BBox {
+ return create(
+ vec3.create(boundingBox.xmin, boundingBox.ymin, 0),
+ vec3.create(boundingBox.xmax, boundingBox.ymax, 0)
+ );
+}
+
+/**
+ Returns true if the bounding box contains the given point.
+ */
+export function containsPoint(box: BBox, point: vec3.Vec3): boolean {
+ return (
+ point.x >= box.min.x &&
+ point.x <= box.max.x &&
+ point.y >= box.min.y &&
+ point.y <= box.max.y &&
+ point.z >= box.min.z &&
+ point.z <= box.max.z
+ );
+}
+
+/**
+ Returns true if the two bounding boxes intersect.
+ */
+export function intersects(box1: BBox, box2: BBox): boolean {
+ return (
+ box1.min.x <= box2.max.x &&
+ box1.max.x >= box2.min.x &&
+ box1.min.y <= box2.max.y &&
+ box1.max.y >= box2.min.y &&
+ box1.min.z <= box2.max.z &&
+ box1.max.z >= box2.min.z
+ );
+}
+
+/**
+ * Returns true if outerBox contains innerBox.
+ */
+export function outerBoxcontainsInnerBox(outerBox: BBox, innerBox: BBox): boolean {
+ return (
+ outerBox.min.x <= innerBox.min.x &&
+ outerBox.min.y <= innerBox.min.y &&
+ outerBox.min.z <= innerBox.min.z &&
+ outerBox.max.x >= innerBox.max.x &&
+ outerBox.max.y >= innerBox.max.y &&
+ outerBox.max.z >= innerBox.max.z
+ );
+}
+
+/**
+ Converts a bounding box to an array of numbers.
+ The array contains the following numbers in the following order:
+ [min.x, min.y, min.z, max.x, max.y, max.z]
+ */
+export function toNumArray(box: BBox): [number, number, number, number, number, number] {
+ return [box.min.x, box.min.y, box.min.z, box.max.x, box.max.y, box.max.z];
+}
+
+/**
+ Converts an array of numbers to a bounding box.
+ The array should contain the following numbers in the following order:
+ [min.x, min.y, min.z, max.x, max.y, max.z]
+ */
+export function fromNumArray(array: [number, number, number, number, number, number]): BBox {
+ return create(vec3.fromArray(array.slice(0, 3)), vec3.fromArray(array.slice(3, 6)));
+}
+
+/**
+ * Clones the given bounding box.
+ */
+export function clone(box: BBox): BBox {
+ return create(vec3.clone(box.min), vec3.clone(box.max));
+}
+
+/**
+ * Combines the two bounding boxes into a new bounding box that contains both.
+ */
+export function combine(box1: BBox, box2: BBox): BBox {
+ return create(
+ vec3.create(
+ Math.min(box1.min.x, box2.min.x),
+ Math.min(box1.min.y, box2.min.y),
+ Math.min(box1.min.z, box2.min.z)
+ ),
+ vec3.create(
+ Math.max(box1.max.x, box2.max.x),
+ Math.max(box1.max.y, box2.max.y),
+ Math.max(box1.max.z, box2.max.z)
+ )
+ );
+}
diff --git a/frontend/src/lib/utils/colorConstants.ts b/frontend/src/lib/utils/colorConstants.ts
new file mode 100644
index 000000000..98f7748b9
--- /dev/null
+++ b/frontend/src/lib/utils/colorConstants.ts
@@ -0,0 +1,11 @@
+// This is used to set colors for different states throughout the application where CSS properties are not accessible (e.g. WebGL).
+// However, it should be in sync with what is set in Tailwind CSS.
+// The location of this file can still be decided upon.
+export type Colors = {
+ hover: [number, number, number];
+ selected: [number, number, number];
+};
+export const COLORS: Colors = {
+ hover: [191, 219, 254],
+ selected: [37, 99, 235],
+};
diff --git a/frontend/src/lib/utils/geometry.ts b/frontend/src/lib/utils/geometry.ts
index 7b1bd5613..97b981b50 100644
--- a/frontend/src/lib/utils/geometry.ts
+++ b/frontend/src/lib/utils/geometry.ts
@@ -1,10 +1,18 @@
+import { BBox } from "./boundingBox";
import type { Vec2 } from "./vec2";
+import { Vec3 } from "./vec3";
export type Size2D = {
width: number;
height: number;
};
+export type Size3D = {
+ width: number;
+ height: number;
+ depth: number;
+};
+
export type Rect2D = {
x: number;
y: number;
@@ -12,6 +20,36 @@ export type Rect2D = {
height: number;
};
+export type Rect3D = {
+ x: number;
+ y: number;
+ z: number;
+ width: number;
+ height: number;
+ depth: number;
+};
+
+export enum ShapeType {
+ BOX = "box",
+}
+
+export type Shape = {
+ type: ShapeType.BOX;
+ centerPoint: Vec3;
+ dimensions: Size3D;
+ normalizedEdgeVectors: {
+ // along width
+ u: Vec3;
+ // along height
+ v: Vec3;
+ };
+};
+
+export type Geometry = {
+ shapes: Shape[];
+ boundingBox: BBox;
+};
+
export const ORIGIN = Object.freeze({ x: 0, y: 0 });
export const MANHATTAN_LENGTH = 13.11;
@@ -78,7 +116,20 @@ export function addMarginToRect(rect: Rect2D, margin: number): Rect2D {
};
}
-export function outerRectContainsInnerRect(outerRect: Rect2D, innerRect: Rect2D): boolean {
+export function outerRectContainsInnerRect(outerRect: Rect3D, innerRect: Rect3D): boolean;
+export function outerRectContainsInnerRect(outerRect: Rect2D, innerRect: Rect2D): boolean;
+export function outerRectContainsInnerRect(outerRect: Rect2D | Rect3D, innerRect: Rect2D | Rect3D): boolean {
+ if ("depth" in outerRect && "depth" in innerRect) {
+ return (
+ outerRect.x <= innerRect.x &&
+ outerRect.y <= innerRect.y &&
+ outerRect.z <= innerRect.z &&
+ outerRect.x + outerRect.width >= innerRect.x + innerRect.width &&
+ outerRect.y + outerRect.height >= innerRect.y + innerRect.height &&
+ outerRect.z + outerRect.depth >= innerRect.z + innerRect.depth
+ );
+ }
+
return (
outerRect.x <= innerRect.x &&
outerRect.y <= innerRect.y &&
diff --git a/frontend/src/lib/utils/index.ts b/frontend/src/lib/utils/index.ts
new file mode 100644
index 000000000..a8c6b55be
--- /dev/null
+++ b/frontend/src/lib/utils/index.ts
@@ -0,0 +1 @@
+export * as bbox from "./boundingBox";
diff --git a/frontend/src/lib/utils/mat3.ts b/frontend/src/lib/utils/mat3.ts
new file mode 100644
index 000000000..6864161b7
--- /dev/null
+++ b/frontend/src/lib/utils/mat3.ts
@@ -0,0 +1,83 @@
+/**
+ * A 3x3 matrix.
+ */
+export type Mat3 = {
+ m00: number;
+ m01: number;
+ m02: number;
+ m10: number;
+ m11: number;
+ m12: number;
+ m20: number;
+ m21: number;
+ m22: number;
+};
+
+/**
+ * Creates a new 3x3 matrix with all elements set to 0.
+ *
+ * @returns A new 3x3 matrix.
+ */
+export function createEmpty(): Mat3 {
+ return {
+ m00: 0,
+ m01: 0,
+ m02: 0,
+ m10: 0,
+ m11: 0,
+ m12: 0,
+ m20: 0,
+ m21: 0,
+ m22: 0,
+ };
+}
+
+/**
+ * Creates a new 3x3 matrix with the given elements.
+ *
+ * @param m00 The element at row 0, column 0.
+ * @param m01 The element at row 0, column 1.
+ * @param m02 The element at row 0, column 2.
+ * @param m10 The element at row 1, column 0.
+ * @param m11 The element at row 1, column 1.
+ * @param m12 The element at row 1, column 2.
+ * @param m20 The element at row 2, column 0.
+ * @param m21 The element at row 2, column 1.
+ * @param m22 The element at row 2, column 2.
+ * @returns A new 3x3 matrix.
+ */
+export function create(
+ m00: number,
+ m01: number,
+ m02: number,
+ m10: number,
+ m11: number,
+ m12: number,
+ m20: number,
+ m21: number,
+ m22: number
+): Mat3 {
+ return { m00, m01, m02, m10, m11, m12, m20, m21, m22 };
+}
+
+/**
+ * Creates a new 3x3 matrix from the given array of numbers.
+ *
+ * @param array An array of numbers in the following order: [m00, m01, m02, m10, m11, m12, m20, m21, m22].
+ * @returns A new 3x3 matrix.
+ */
+export function fromArray(
+ array: ArrayLike | [number, number, number, number, number, number, number, number, number]
+): Mat3 {
+ return {
+ m00: array[0],
+ m01: array[1],
+ m02: array[2],
+ m10: array[3],
+ m11: array[4],
+ m12: array[5],
+ m20: array[6],
+ m21: array[7],
+ m22: array[8],
+ };
+}
\ No newline at end of file
diff --git a/frontend/src/lib/utils/orientedBoundingBox.ts b/frontend/src/lib/utils/orientedBoundingBox.ts
new file mode 100644
index 000000000..989d15608
--- /dev/null
+++ b/frontend/src/lib/utils/orientedBoundingBox.ts
@@ -0,0 +1,164 @@
+import * as bbox from "./boundingBox";
+import * as vec3 from "./vec3";
+
+export type OBBox = {
+ centerPoint: vec3.Vec3;
+ principalAxes: vec3.Vec3[];
+ halfExtents: number[];
+};
+
+/**
+ * Creates a new oriented bounding box.
+ */
+export function create(center: vec3.Vec3, principalAxes: vec3.Vec3[], halfExtents: number[]): OBBox {
+ return { centerPoint: center, principalAxes, halfExtents };
+}
+
+/*
+ * Returns true if the oriented bounding box contains the given point.
+ */
+export function containsPoint(box: OBBox, point: vec3.Vec3): boolean {
+ const diff = vec3.subtract(point, box.centerPoint);
+ return (
+ Math.abs(vec3.dot(diff, box.principalAxes[0])) <= box.halfExtents[0] &&
+ Math.abs(vec3.dot(diff, box.principalAxes[1])) <= box.halfExtents[1] &&
+ Math.abs(vec3.dot(diff, box.principalAxes[2])) <= box.halfExtents[2]
+ );
+}
+
+/**
+ * Converts an oriented bounding box to an axis-aligned bounding box.
+ */
+export function toAxisAlignedBoundingBox(box: OBBox): bbox.BBox {
+ const absAxisX = vec3.abs(box.principalAxes[0]);
+ const absAxisY = vec3.abs(box.principalAxes[1]);
+ const absAxisZ = vec3.abs(box.principalAxes[2]);
+
+ const halfSize: vec3.Vec3 = {
+ x: box.halfExtents[0] * absAxisX.x + box.halfExtents[1] * absAxisY.x + box.halfExtents[2] * absAxisZ.x,
+ y: box.halfExtents[0] * absAxisX.y + box.halfExtents[1] * absAxisY.y + box.halfExtents[2] * absAxisZ.y,
+ z: box.halfExtents[0] * absAxisX.z + box.halfExtents[1] * absAxisY.z + box.halfExtents[2] * absAxisZ.z,
+ };
+ return bbox.create(vec3.subtract(box.centerPoint, halfSize), vec3.add(box.centerPoint, halfSize));
+}
+
+export function fromAxisAlignedBoundingBox(box: bbox.BBox): OBBox {
+ const centerPoint = vec3.scale(vec3.add(box.min, box.max), 0.5);
+ const principalAxes = [vec3.create(1, 0, 0), vec3.create(0, 1, 0), vec3.create(0, 0, 1)];
+ const halfExtents = vec3.scale(vec3.subtract(box.max, box.min), 0.5);
+ return create(centerPoint, principalAxes, [halfExtents.x, halfExtents.y, halfExtents.z]);
+}
+
+/**
+ * Returns true if outerBox contains innerBox.
+ */
+export function containsBox(outerBox: OBBox, innerBox: OBBox): boolean {
+ const points = calcCornerPoints(innerBox);
+ for (const point of points) {
+ if (!containsPoint(outerBox, point)) {
+ return false;
+ }
+ }
+ return true;
+}
+
+/**
+ * Returns the corner points of the oriented bounding box.
+ *
+ * The points are returned in the following order for z-axis up coordinate system:
+ * 0: bottom front left
+ * 1: bottom front right
+ * 2: bottom back left
+ * 3: bottom back right
+ * 4: top front left
+ * 5: top front right
+ * 6: top back left
+ * 7: top back right
+ */
+
+export function calcCornerPoints(box: OBBox): vec3.Vec3[] {
+ const halfExtents = box.halfExtents;
+ const principalAxes = box.principalAxes;
+ const centerPoint = box.centerPoint;
+
+ const points: vec3.Vec3[] = [];
+ for (let i = 0; i < 8; i++) {
+ const x = (i & 1) === 0 ? -1 : 1;
+ const y = (i & 2) === 0 ? -1 : 1;
+ const z = (i & 4) === 0 ? -1 : 1;
+ const point = vec3.add(
+ centerPoint,
+ vec3.add(
+ vec3.scale(principalAxes[0], x * halfExtents[0]),
+ vec3.add(
+ vec3.scale(principalAxes[1], y * halfExtents[1]),
+ vec3.scale(principalAxes[2], z * halfExtents[2])
+ )
+ )
+ );
+ points.push(point);
+ }
+ return points;
+}
+
+/**
+ * Creates an oriented bounding box from the given corner points.
+ */
+export function fromCornerPoints(points: vec3.Vec3[]): OBBox {
+ const min = vec3.create(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);
+ const max = vec3.create(-Number.MAX_VALUE, -Number.MAX_VALUE, -Number.MAX_VALUE);
+ for (const point of points) {
+ min.x = Math.min(min.x, point.x);
+ min.y = Math.min(min.y, point.y);
+ min.z = Math.min(min.z, point.z);
+ max.x = Math.max(max.x, point.x);
+ max.y = Math.max(max.y, point.y);
+ max.z = Math.max(max.z, point.z);
+ }
+ const center = vec3.scale(vec3.add(min, max), 0.5);
+ const halfExtents = vec3.scale(vec3.subtract(max, min), 0.5);
+ const principalAxes = [
+ vec3.normalize(vec3.subtract(points[0], points[1])),
+ vec3.normalize(vec3.subtract(points[0], points[2])),
+ vec3.normalize(vec3.subtract(points[0], points[4])),
+ ];
+ return create(center, principalAxes, [halfExtents.x, halfExtents.y, halfExtents.z]);
+}
+
+/**
+ * Combines two oriented bounding boxes into a new oriented bounding box that contains both input boxes.
+ */
+export function combine(box1: OBBox, box2: OBBox): OBBox {
+ const points1 = calcCornerPoints(box1);
+ const points2 = calcCornerPoints(box2);
+ const allPoints = points1.concat(points2);
+ const min = vec3.create(Number.MAX_VALUE, Number.MAX_VALUE, Number.MAX_VALUE);
+ const max = vec3.create(-Number.MAX_VALUE, -Number.MAX_VALUE, -Number.MAX_VALUE);
+ for (const point of allPoints) {
+ min.x = Math.min(min.x, point.x);
+ min.y = Math.min(min.y, point.y);
+ min.z = Math.min(min.z, point.z);
+ max.x = Math.max(max.x, point.x);
+ max.y = Math.max(max.y, point.y);
+ max.z = Math.max(max.z, point.z);
+ }
+ const center = vec3.scale(vec3.add(min, max), 0.5);
+ const halfExtents = vec3.scale(vec3.subtract(max, min), 0.5);
+ const principalAxes = [
+ vec3.normalize(vec3.subtract(points1[0], points1[1])),
+ vec3.normalize(vec3.subtract(points1[0], points1[2])),
+ vec3.normalize(vec3.subtract(points1[0], points1[4])),
+ ];
+ return create(center, principalAxes, [halfExtents.x, halfExtents.y, halfExtents.z]);
+}
+
+/**
+ * Clones the given oriented bounding box.
+ */
+export function clone(box: OBBox): OBBox {
+ return create(
+ vec3.clone(box.centerPoint),
+ [vec3.clone(box.principalAxes[0]), vec3.clone(box.principalAxes[1]), vec3.clone(box.principalAxes[2])],
+ [...box.halfExtents]
+ );
+}
diff --git a/frontend/src/lib/utils/vec2.ts b/frontend/src/lib/utils/vec2.ts
index d07b0a03a..9d10e6db1 100644
--- a/frontend/src/lib/utils/vec2.ts
+++ b/frontend/src/lib/utils/vec2.ts
@@ -40,7 +40,7 @@ export function scaleVec2NonUniform(vector: Vec2, scalarX: number, scalarY: numb
return { x: vector.x * scalarX, y: vector.y * scalarY };
}
-export function multiplyVec2(vecA: Vec2, vecB: Vec2): Vec2 {
+export function multiplyElementWiseVec2(vecA: Vec2, vecB: Vec2): Vec2 {
return { x: vecA.x * vecB.x, y: vecA.y * vecB.y };
}
diff --git a/frontend/src/lib/utils/vec3.ts b/frontend/src/lib/utils/vec3.ts
index 7105315cd..41cbd8e37 100644
--- a/frontend/src/lib/utils/vec3.ts
+++ b/frontend/src/lib/utils/vec3.ts
@@ -1,3 +1,5 @@
+import { Mat3 } from "./mat3";
+
/**
* A 3D vector.
*/
@@ -51,3 +53,195 @@ export function toArray(vector: Vec3): [number, number, number] {
export function clone(vector: Vec3): Vec3 {
return { x: vector.x, y: vector.y, z: vector.z };
}
+
+/**
+ * Calculates the length of the given vector.
+ *
+ * @param vector The vector.
+ * @returns The length of the vector.
+ */
+export function length(vector: Vec3): number {
+ return Math.sqrt(vector.x ** 2 + vector.y ** 2 + vector.z ** 2);
+}
+
+/**
+ * Calculates the squared length of the given vector.
+ *
+ * @param vector The vector.
+ * @returns The squared length of the vector.
+ */
+export function squaredLength(vector: Vec3): number {
+ return vector.x ** 2 + vector.y ** 2 + vector.z ** 2;
+}
+
+/**
+ * Calculates the distance between two points.
+ *
+ * @param point1 The first point.
+ * @param point2 The second point.
+ * @returns The distance between the two points.
+ */
+export function distance(point1: Vec3, point2: Vec3): number {
+ return Math.sqrt((point1.x - point2.x) ** 2 + (point1.y - point2.y) ** 2 + (point1.z - point2.z) ** 2);
+}
+
+/**
+ * Calculates the squared distance between two points.
+ *
+ * @param point1 The first point.
+ * @param point2 The second point.
+ * @returns The squared distance between the two points.
+ */
+export function squaredDistance(point1: Vec3, point2: Vec3): number {
+ return (point1.x - point2.x) ** 2 + (point1.y - point2.y) ** 2 + (point1.z - point2.z) ** 2;
+}
+
+/**
+ * Subtracts the subtrahend from the minuend.
+ *
+ * @param minuend The minuend.
+ * @param subtrahend The subtrahend.
+ * @returns A new vector that is the result of the subtraction.
+ */
+export function subtract(minuend: Vec3, subtrahend: Vec3): Vec3 {
+ return { x: minuend.x - subtrahend.x, y: minuend.y - subtrahend.y, z: minuend.z - subtrahend.z };
+}
+
+/**
+ * Adds two vectors.
+ *
+ * @param vector1 The first vector.
+ * @param vector2 The second vector.
+ * @returns A new vector that is the result of the addition.
+ */
+export function add(vector1: Vec3, vector2: Vec3): Vec3 {
+ return { x: vector1.x + vector2.x, y: vector1.y + vector2.y, z: vector1.z + vector2.z };
+}
+
+/**
+ * Concatenates multiple vectors.
+ *
+ * @param vectors The vectors to concatenate.
+ * @returns A new vector that is the result of the concatenation.
+ */
+export function concat(...vectors: Vec3[]): Vec3 {
+ return vectors.reduce((acc, vector) => add(acc, vector), create(0, 0, 0));
+}
+
+/**
+ * Normalizes the given vector.
+ *
+ * @param vector The vector.
+ * @returns A new vector that is the normalized version of the given vector.
+ */
+export function normalize(vector: Vec3): Vec3 {
+ const len = length(vector);
+ return { x: vector.x / len, y: vector.y / len, z: vector.z / len };
+}
+
+/**
+ * Negates the given vector.
+ *
+ * @param vector The vector.
+ * @returns A new vector that is the negated version of the given vector.
+ */
+export function negate(vector: Vec3): Vec3 {
+ return { x: -vector.x, y: -vector.y, z: -vector.z };
+}
+
+/**
+ * Returns the absolute values of the components of the given vector.
+ *
+ * @param vector The vector.
+ * @returns A new vector that is the absolute version of the given vector.
+ */
+export function abs(vector: Vec3): Vec3 {
+ return { x: Math.abs(vector.x), y: Math.abs(vector.y), z: Math.abs(vector.z) };
+}
+
+/**
+ * Scales the given vector by the given scalar.
+ *
+ * @param vector The vector.
+ * @param scalar The scalar.
+ * @returns A new vector that is the result of the scaling.
+ */
+export function scale(vector: Vec3, scalar: number): Vec3 {
+ return { x: vector.x * scalar, y: vector.y * scalar, z: vector.z * scalar };
+}
+
+/**
+ * Scales the given vector components by the respective given scalar.
+ *
+ * @param vector The vector.
+ * @param scalarX The scalar for the x component.
+ * @param scalarY The scalar for the y component.
+ * @param scalarZ The scalar for the z component.
+ * @returns A new vector that is the result of the scaling.
+ */
+export function scaleNonUniform(vector: Vec3, scalarX: number, scalarY: number, scalarZ: number): Vec3 {
+ return { x: vector.x * scalarX, y: vector.y * scalarY, z: vector.z * scalarZ };
+}
+
+/**
+ * Multiplies two vectors element-wise.
+ *
+ * @param vecA The first vector.
+ * @param vecB The second vector.
+ * @returns A new vector that is the result of the element-wise multiplication.
+ */
+export function multiplyElementWise(vecA: Vec3, vecB: Vec3): Vec3 {
+ return { x: vecA.x * vecB.x, y: vecA.y * vecB.y, z: vecA.z * vecB.z };
+}
+
+/**
+ * Returns true if the two vectors are equal.
+ *
+ * @param vector1 The first vector.
+ * @param vector2 The second vector.
+ * @returns True if the two vectors are equal.
+ */
+export function equal(vector1: Vec3, vector2: Vec3): boolean {
+ return vector1.x === vector2.x && vector1.y === vector2.y && vector1.z === vector2.z;
+}
+
+/**
+ * Calculates the dot product of two vectors.
+ *
+ * @param vector1 The first vector.
+ * @param vector2 The second vector.
+ * @returns The dot product of the two vectors.
+ */
+export function dot(vector1: Vec3, vector2: Vec3): number {
+ return vector1.x * vector2.x + vector1.y * vector2.y + vector1.z * vector2.z;
+}
+
+/**
+ * Calculates the cross product of two vectors.
+ *
+ * @param vector1 The first vector.
+ * @param vector2 The second vector.
+ * @returns A new vector that is the cross product of the two vectors.
+ */
+export function cross(vector1: Vec3, vector2: Vec3): Vec3 {
+ return {
+ x: vector1.y * vector2.z - vector1.z * vector2.y,
+ y: vector1.z * vector2.x - vector1.x * vector2.z,
+ z: vector1.x * vector2.y - vector1.y * vector2.x,
+ };
+}
+
+/**
+ * Transforms the given vector by the given matrix.
+ *
+ * @param vector A 3D vector to transform.
+ * @param matrix A 3x3 matrix to transform the vector with.
+ * @returns A new 3D vector that is the result of the transformation.
+ */
+export function transform(vector: Vec3, matrix: Mat3): Vec3 {
+ return {
+ x: matrix.m00 * vector.x + matrix.m01 * vector.y + matrix.m02 * vector.z,
+ y: matrix.m10 * vector.x + matrix.m11 * vector.y + matrix.m12 * vector.z,
+ z: matrix.m20 * vector.x + matrix.m21 * vector.y + matrix.m22 * vector.z,
+ };
+}
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/annotations/makeColorScaleAnnotation.ts b/frontend/src/modules/2DViewer/DataProviderFramework/annotations/makeColorScaleAnnotation.ts
index e43098908..a9f32545a 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/annotations/makeColorScaleAnnotation.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/annotations/makeColorScaleAnnotation.ts
@@ -9,6 +9,7 @@ export function makeColorScaleAnnotation({
getSetting,
id,
name,
+ getValueRange,
}: TransformerArgs<[Setting.COLOR_SCALE], any>): Annotation[] {
const colorScale = getSetting(Setting.COLOR_SCALE)?.colorScale;
@@ -16,5 +17,13 @@ export function makeColorScaleAnnotation({
return [];
}
- return [{ id, colorScale: ColorScaleWithName.fromColorScale(colorScale, name) }];
+ const range = getValueRange();
+ if (!range) {
+ return [];
+ }
+
+ const localColorScale = colorScale.clone();
+ localColorScale.setRange(range[0], range[1]);
+
+ return [{ id, colorScale: ColorScaleWithName.fromColorScale(localColorScale, name) }];
}
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/ObservedSurfaceProvider.ts b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/ObservedSurfaceProvider.ts
index 91ec86689..093c271f5 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/ObservedSurfaceProvider.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/ObservedSurfaceProvider.ts
@@ -16,7 +16,6 @@ import type { SurfaceDataFloat_trans } from "@modules/_shared/Surface/queryDataT
import { transformSurfaceData } from "@modules/_shared/Surface/queryDataTransforms";
import { encodeSurfAddrStr } from "@modules/_shared/Surface/surfaceAddress";
-
const observedSurfaceSettings = [
Setting.ENSEMBLE,
Setting.ATTRIBUTE,
@@ -199,7 +198,7 @@ export class ObservedSurfaceProvider
resample_to_def_str: null,
},
});
-
+
registerQueryKey(surfaceDataOptions.queryKey);
const promise = queryClient
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationGridProvider.ts b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationGridProvider.ts
index 3fd36e43a..63c531156 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationGridProvider.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationGridProvider.ts
@@ -4,6 +4,7 @@ import { getGridModelsInfoOptions, getGridParameterOptions, getGridSurfaceOption
import type { GridMappedProperty_trans, GridSurface_trans } from "@modules/3DViewer/view/queries/queryDataTransforms";
import { transformGridMappedProperty, transformGridSurface } from "@modules/3DViewer/view/queries/queryDataTransforms";
import type {
+ AreSettingsValidArgs,
CustomDataProviderImplementation,
DataProviderInformationAccessors,
FetchDataParams,
@@ -12,7 +13,6 @@ import type { DefineDependenciesArgs } from "@modules/_shared/DataProviderFramew
import type { MakeSettingTypesMap } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
import { Setting } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
-
const realizationGridSettings = [
Setting.ENSEMBLE,
Setting.REALIZATION,
@@ -133,13 +133,9 @@ export class RealizationGridProvider
registerQueryKey(gridSurfaceOptions.queryKey);
- const gridParameterPromise = queryClient
- .fetchQuery(gridParameterOptions)
- .then(transformGridMappedProperty);
+ const gridParameterPromise = queryClient.fetchQuery(gridParameterOptions).then(transformGridMappedProperty);
- const gridSurfacePromise = queryClient
- .fetchQuery(gridSurfaceOptions)
- .then(transformGridSurface);
+ const gridSurfacePromise = queryClient.fetchQuery(gridSurfaceOptions).then(transformGridSurface);
return Promise.all([gridSurfacePromise, gridParameterPromise]).then(([gridSurfaceData, gridParameterData]) => ({
gridSurfaceData,
@@ -149,7 +145,7 @@ export class RealizationGridProvider
areCurrentSettingsValid({
getSetting,
- }: DataProviderInformationAccessors): boolean {
+ }: AreSettingsValidArgs): boolean {
return (
getSetting(Setting.ENSEMBLE) !== null &&
getSetting(Setting.REALIZATION) !== null &&
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationPolygonsProvider.ts b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationPolygonsProvider.ts
index 80ec813ea..81f27f05f 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationPolygonsProvider.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationPolygonsProvider.ts
@@ -10,7 +10,6 @@ import type { DefineDependenciesArgs } from "@modules/_shared/DataProviderFramew
import type { MakeSettingTypesMap } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
import { Setting } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
-
const realizationPolygonsSettings = [
Setting.ENSEMBLE,
Setting.REALIZATION,
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationSurfaceProvider.ts b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationSurfaceProvider.ts
index 844d8fca6..af26f4ea3 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationSurfaceProvider.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationSurfaceProvider.ts
@@ -16,7 +16,6 @@ import type { SurfaceDataFloat_trans } from "@modules/_shared/Surface/queryDataT
import { transformSurfaceData } from "@modules/_shared/Surface/queryDataTransforms";
import { encodeSurfAddrStr } from "@modules/_shared/Surface/surfaceAddress";
-
const realizationSurfaceSettings = [
Setting.ENSEMBLE,
Setting.REALIZATION,
@@ -247,9 +246,7 @@ export class RealizationSurfaceProvider
registerQueryKey(surfaceDataOptions.queryKey);
const promise = queryClient
- .fetchQuery(
- surfaceDataOptions,
- )
+ .fetchQuery(surfaceDataOptions)
.then((data) => ({ format: this._dataFormat, surfaceData: transformSurfaceData(data) }));
return promise as Promise;
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/StatisticalSurfaceProvider.ts b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/StatisticalSurfaceProvider.ts
index 081f8f28c..6d62f5ef9 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/StatisticalSurfaceProvider.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/customDataProviderImplementations/StatisticalSurfaceProvider.ts
@@ -22,7 +22,6 @@ import type { SurfaceDataFloat_trans } from "@modules/_shared/Surface/queryDataT
import { transformSurfaceData } from "@modules/_shared/Surface/queryDataTransforms";
import { encodeSurfAddrStr } from "@modules/_shared/Surface/surfaceAddress";
-
const statisicalSurfaceSettings = [
Setting.ENSEMBLE,
Setting.STATISTIC_FUNCTION,
@@ -65,7 +64,10 @@ export class StatisticalSurfaceProvider
return "Statistical Surface";
}
- doSettingsChangesRequireDataRefetch(prevSettings: SettingsWithTypes, newSettings: SettingsWithTypes): boolean {
+ doSettingsChangesRequireDataRefetch(
+ prevSettings: SettingsWithTypes | null,
+ newSettings: SettingsWithTypes,
+ ): boolean {
return !isEqual(prevSettings, newSettings);
}
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationGridLayer.ts b/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationGridLayer.ts
index c8097c353..bf02d1979 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationGridLayer.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationGridLayer.ts
@@ -33,7 +33,7 @@ export function makeRealizationGridLayer({
polysData: polysNumberArray,
propertiesData: gridParameterData.polyPropsFloat32Arr,
ZIncreasingDownwards: false,
- gridLines: showGridLines,
+ gridLines: showGridLines ?? false,
material: { ambient: 0.4, diffuse: 0.7, shininess: 8, specularColor: [25, 25, 25] },
pickable: true,
colorMapName: "Physics",
diff --git a/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationPolygonsLayer.ts b/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationPolygonsLayer.ts
index 26bbc2ab2..7109fee24 100644
--- a/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationPolygonsLayer.ts
+++ b/frontend/src/modules/2DViewer/DataProviderFramework/visualization/makeRealizationPolygonsLayer.ts
@@ -4,13 +4,12 @@ import type { Feature, FeatureCollection, GeoJsonProperties, Geometry } from "ge
import type { PolygonData_api } from "@api";
import type { TransformerArgs } from "@modules/_shared/DataProviderFramework/visualization/VisualizationAssembler";
-
import type {
RealizationPolygonsData,
RealizationPolygonsSettings,
} from "../customDataProviderImplementations/RealizationPolygonsProvider";
-function zipCoords(xArr: number[], yArr: number[], zArr: number[]): number[][] {
+function zipCoords(xArr: readonly number[], yArr: readonly number[], zArr: readonly number[]): number[][] {
const coords: number[][] = [];
for (let i = 0; i < xArr.length; i++) {
coords.push([xArr[i], yArr[i], -zArr[i]]);
diff --git a/frontend/src/modules/2DViewer/settings/settings.tsx b/frontend/src/modules/2DViewer/settings/settings.tsx
index df5c4b31a..b5af7cbe4 100644
--- a/frontend/src/modules/2DViewer/settings/settings.tsx
+++ b/frontend/src/modules/2DViewer/settings/settings.tsx
@@ -9,7 +9,6 @@ import { useEnsembleSet } from "@framework/WorkbenchSession";
import { CollapsibleGroup } from "@lib/components/CollapsibleGroup";
import { GroupDelegateTopic } from "@modules/_shared/DataProviderFramework/delegates/GroupDelegate";
-
import {
DataProviderManager,
DataProviderManagerTopic,
@@ -19,7 +18,6 @@ import { dataProviderManagerAtom, preferredViewLayoutAtom, userSelectedFieldIden
import { selectedFieldIdentifierAtom } from "./atoms/derivedAtoms";
import { DataProviderManagerWrapper } from "./components/dataProviderManagerWrapper";
-
export function Settings(props: ModuleSettingsProps): React.ReactNode {
const ensembleSet = useEnsembleSet(props.workbenchSession);
const queryClient = useQueryClient();
@@ -112,7 +110,6 @@ export function Settings(props: ModuleSettingsProps): React.ReactNode {
.makeSubscriberFunction(GroupDelegateTopic.CHILDREN_EXPANSION_STATES)(persistState);
return function onUnmountEffect() {
- dataProviderManager.beforeDestroy();
unsubscribeDataRev();
unsubscribeExpands();
};
diff --git a/frontend/src/modules/3DViewer/preview.webp b/frontend/src/modules/3DViewer/preview.webp
deleted file mode 100644
index d180acb38..000000000
Binary files a/frontend/src/modules/3DViewer/preview.webp and /dev/null differ
diff --git a/frontend/src/modules/3DViewer/settings/settings.tsx b/frontend/src/modules/3DViewer/settings/settings.tsx
index 798ee02de..1b1f4ecfe 100644
--- a/frontend/src/modules/3DViewer/settings/settings.tsx
+++ b/frontend/src/modules/3DViewer/settings/settings.tsx
@@ -32,7 +32,6 @@ import { resolveClassNames } from "@lib/utils/resolveClassNames";
import { usePropagateApiErrorToStatusWriter } from "@modules/_shared/hooks/usePropagateApiErrorToStatusWriter";
import { isoIntervalStringToDateLabel, isoStringToDateLabel } from "@modules/_shared/utils/isoDatetimeStringFormatting";
-
import type { Interfaces } from "../interfaces";
import type { GridCellIndexRanges } from "../typesAndEnums";
@@ -71,7 +70,6 @@ import { drilledWellboreHeadersQueryAtom, gridModelInfosQueryAtom } from "./atom
import { GridCellIndexFilter } from "./components/gridCellIndexFilter";
import { WellboreSelector } from "./components/wellboreSelector";
-
export function Settings(props: ModuleSettingsProps): JSX.Element {
const ensembleSet = useEnsembleSet(props.workbenchSession);
const statusWriter = useSettingsStatusWriter(props.settingsContext);
@@ -515,7 +513,7 @@ function makeWellHeaderOptions(wellHeaders: WellboreHeader_api[]): SelectOption[
}
function makeCustomIntersectionPolylineOptions(
- polylines: IntersectionPolyline[],
+ polylines: readonly IntersectionPolyline[],
selectedId: string | null,
filter: string,
actions: React.ReactNode,
diff --git a/frontend/src/modules/3DViewer/view/components/PolylineEditingPanel.tsx b/frontend/src/modules/3DViewer/view/components/PolylineEditingPanel.tsx
index 9466c49db..bec1fcd29 100644
--- a/frontend/src/modules/3DViewer/view/components/PolylineEditingPanel.tsx
+++ b/frontend/src/modules/3DViewer/view/components/PolylineEditingPanel.tsx
@@ -15,7 +15,7 @@ export type PolylineEditingPanelProps = {
currentlyEditedPolylineName?: string;
selectedPolylineIndex: number | null;
hoveredPolylineIndex: number | null;
- intersectionPolylines: IntersectionPolyline[];
+ intersectionPolylines: readonly IntersectionPolyline[];
onPolylinePointSelectionChange: (index: number | null) => void;
onPolylineEditingModusChange: (active: boolean) => void;
onDeleteCurrentlySelectedPoint: () => void;
@@ -204,7 +204,7 @@ function makeSelectOptionsFromPoints(points: number[][]): SelectOption[] {
}));
}
-function makeUniquePolylineName(intersectionPolylines: IntersectionPolyline[]): string {
+function makeUniquePolylineName(intersectionPolylines: readonly IntersectionPolyline[]): string {
const names = intersectionPolylines.map((polyline) => polyline.name);
let i = 1;
while (names.includes(`Polyline ${i}`)) {
diff --git a/frontend/src/modules/3DViewer/view/components/SubsurfaceViewerWrapper.tsx b/frontend/src/modules/3DViewer/view/components/SubsurfaceViewerWrapper.tsx
index cc54a86ec..5ceafdad6 100644
--- a/frontend/src/modules/3DViewer/view/components/SubsurfaceViewerWrapper.tsx
+++ b/frontend/src/modules/3DViewer/view/components/SubsurfaceViewerWrapper.tsx
@@ -55,7 +55,7 @@ export type SubsurfaceViewerWrapperProps = {
onIntersectionPolylineEditCancel?: () => void;
onVerticalScaleChange?: (verticalScale: number) => void;
intersectionPolyline?: IntersectionPolyline;
- intersectionPolylines?: IntersectionPolyline[];
+ intersectionPolylines?: readonly IntersectionPolyline[];
};
type IntersectionZValues = {
@@ -372,6 +372,7 @@ export function SubsurfaceViewerWrapper(props: SubsurfaceViewerWrapperProps): Re
name,
fieldId: props.fieldId,
path: currentlyEditedPolyline,
+ color: [255, 0, 0],
});
}
handlePolylineEditingCancel();
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicCrosslineProvider.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicCrosslineProvider.ts
new file mode 100644
index 000000000..dfaf1ef2b
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicCrosslineProvider.ts
@@ -0,0 +1,214 @@
+import { type SeismicCubeMeta_api, getCrosslineSliceOptions, getSeismicCubeMetaListOptions } from "@api";
+import {
+ type SeismicSliceData_trans,
+ transformSeismicSlice,
+} from "@modules/3DViewerNew/settings/queries/queryDataTransforms";
+import type {
+ CustomDataProviderImplementation,
+ DataProviderInformationAccessors,
+ FetchDataParams,
+} from "@modules/_shared/DataProviderFramework/interfacesAndTypes/customDataProviderImplementation";
+import type { DefineDependenciesArgs } from "@modules/_shared/DataProviderFramework/interfacesAndTypes/customSettingsHandler";
+import { Setting, type MakeSettingTypesMap } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+
+import { isEqual } from "lodash";
+
+const realizationSeismicCrosslineSettings = [
+ Setting.ENSEMBLE,
+ Setting.REALIZATION,
+ Setting.ATTRIBUTE,
+ Setting.TIME_OR_INTERVAL,
+ Setting.SEISMIC_CROSSLINE,
+ Setting.COLOR_SCALE,
+] as const;
+export type RealizationSeismicCrosslineSettings = typeof realizationSeismicCrosslineSettings;
+type SettingsWithTypes = MakeSettingTypesMap;
+
+export type RealizationSeismicCrosslineData = SeismicSliceData_trans;
+
+export type RealizationSeismicCrosslineStoredData = {
+ seismicCubeMeta: SeismicCubeMeta_api[];
+};
+
+export class RealizationSeismicCrosslineProvider
+ implements
+ CustomDataProviderImplementation<
+ RealizationSeismicCrosslineSettings,
+ RealizationSeismicCrosslineData,
+ RealizationSeismicCrosslineStoredData
+ >
+{
+ settings = realizationSeismicCrosslineSettings;
+
+ getDefaultName(): string {
+ return "Seismic Crossline (realization)";
+ }
+
+ doSettingsChangesRequireDataRefetch(prevSettings: SettingsWithTypes, newSettings: SettingsWithTypes): boolean {
+ return !isEqual(prevSettings, newSettings);
+ }
+
+ makeValueRange(
+ accessors: DataProviderInformationAccessors<
+ RealizationSeismicCrosslineSettings,
+ RealizationSeismicCrosslineData,
+ RealizationSeismicCrosslineStoredData
+ >,
+ ): [number, number] | null {
+ const data = accessors.getData();
+ if (!data) {
+ return null;
+ }
+ return [data.value_min, data.value_max];
+ }
+
+ fetchData({
+ getSetting,
+ registerQueryKey,
+ queryClient,
+ }: FetchDataParams<
+ RealizationSeismicCrosslineSettings,
+ RealizationSeismicCrosslineData
+ >): Promise {
+ const ensembleIdent = getSetting(Setting.ENSEMBLE);
+ const realizationNum = getSetting(Setting.REALIZATION);
+ const attribute = getSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getSetting(Setting.TIME_OR_INTERVAL);
+ const crosslineNumber = getSetting(Setting.SEISMIC_CROSSLINE);
+
+ const queryOptions = getCrosslineSliceOptions({
+ query: {
+ case_uuid: ensembleIdent?.getCaseUuid() ?? "",
+ ensemble_name: ensembleIdent?.getEnsembleName() ?? "",
+ realization_num: realizationNum ?? 0,
+ seismic_attribute: attribute ?? "",
+ time_or_interval_str: timeOrInterval ?? "",
+ observed: false,
+ crossline_no: crosslineNumber ?? 0,
+ },
+ });
+
+ registerQueryKey(queryOptions.queryKey);
+
+ return queryClient
+ .fetchQuery({
+ ...queryOptions,
+ })
+ .then((data) => transformSeismicSlice(data));
+ }
+
+ defineDependencies({
+ helperDependency,
+ availableSettingsUpdater,
+ storedDataUpdater,
+ queryClient,
+ }: DefineDependenciesArgs): void {
+ availableSettingsUpdater(Setting.ENSEMBLE, ({ getGlobalSetting }) => {
+ const fieldIdentifier = getGlobalSetting("fieldId");
+ const ensembles = getGlobalSetting("ensembles");
+
+ const ensembleIdents = ensembles
+ .filter((ensemble) => ensemble.getFieldIdentifier() === fieldIdentifier)
+ .map((ensemble) => ensemble.getIdent());
+
+ return ensembleIdents;
+ });
+
+ availableSettingsUpdater(Setting.REALIZATION, ({ getLocalSetting, getGlobalSetting }) => {
+ const ensembleIdent = getLocalSetting(Setting.ENSEMBLE);
+ const realizationFilterFunc = getGlobalSetting("realizationFilterFunction");
+
+ if (!ensembleIdent) {
+ return [];
+ }
+
+ const realizations = realizationFilterFunc(ensembleIdent);
+
+ return [...realizations];
+ });
+
+ const realizationSeismicCrosslineDataDep = helperDependency(async ({ getLocalSetting, abortSignal }) => {
+ const ensembleIdent = getLocalSetting(Setting.ENSEMBLE);
+ const realization = getLocalSetting(Setting.REALIZATION);
+
+ if (!ensembleIdent || realization === null) {
+ return null;
+ }
+
+ return await queryClient.fetchQuery({
+ ...getSeismicCubeMetaListOptions({
+ query: {
+ case_uuid: ensembleIdent.getCaseUuid(),
+ ensemble_name: ensembleIdent.getEnsembleName(),
+ },
+ signal: abortSignal,
+ }),
+ });
+ });
+
+ storedDataUpdater("seismicCubeMeta", ({ getHelperDependency }) => {
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!data) {
+ return null;
+ }
+
+ return data;
+ });
+
+ availableSettingsUpdater(Setting.ATTRIBUTE, ({ getHelperDependency }) => {
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!data) {
+ return [];
+ }
+
+ const availableSeismicAttributes = [
+ ...Array.from(new Set(data.map((seismicInfos) => seismicInfos.seismicAttribute))),
+ ];
+
+ return availableSeismicAttributes;
+ });
+
+ availableSettingsUpdater(Setting.TIME_OR_INTERVAL, ({ getLocalSetting, getHelperDependency }) => {
+ const seismicAttribute = getLocalSetting(Setting.ATTRIBUTE);
+
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!seismicAttribute || !data) {
+ return [];
+ }
+
+ const availableTimeOrIntervals = [
+ ...Array.from(
+ new Set(
+ data
+ .filter((surface) => surface.seismicAttribute === seismicAttribute)
+ .map((el) => el.isoDateOrInterval),
+ ),
+ ),
+ ];
+
+ return availableTimeOrIntervals;
+ });
+
+ availableSettingsUpdater(Setting.SEISMIC_CROSSLINE, ({ getLocalSetting, getHelperDependency }) => {
+ const seismicAttribute = getLocalSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getLocalSetting(Setting.TIME_OR_INTERVAL);
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!seismicAttribute || !timeOrInterval || !data) {
+ return [0, 0, 0];
+ }
+ const seismicInfo = data.filter(
+ (seismicInfos) =>
+ seismicInfos.seismicAttribute === seismicAttribute &&
+ seismicInfos.isoDateOrInterval === timeOrInterval,
+ )[0];
+ const jMin = 0;
+ const jMax = seismicInfo.spec.numRows - 1;
+
+ return [jMin, jMax, 1];
+ });
+ }
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicDepthProvider.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicDepthProvider.ts
new file mode 100644
index 000000000..4c3685e31
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicDepthProvider.ts
@@ -0,0 +1,217 @@
+import { type SeismicCubeMeta_api, getDepthSliceOptions, getSeismicCubeMetaListOptions } from "@api";
+import {
+ type SeismicSliceData_trans,
+ transformSeismicSlice,
+} from "@modules/3DViewerNew/settings/queries/queryDataTransforms";
+import type {
+ CustomDataProviderImplementation,
+ DataProviderInformationAccessors,
+ FetchDataParams,
+} from "@modules/_shared/DataProviderFramework/interfacesAndTypes/customDataProviderImplementation";
+import type { DefineDependenciesArgs } from "@modules/_shared/DataProviderFramework/interfacesAndTypes/customSettingsHandler";
+import { Setting, type MakeSettingTypesMap } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+
+import { isEqual } from "lodash";
+
+const realizationSeismicDepthSliceSettings = [
+ Setting.ENSEMBLE,
+ Setting.REALIZATION,
+ Setting.ATTRIBUTE,
+ Setting.TIME_OR_INTERVAL,
+ Setting.SEISMIC_DEPTH_SLICE,
+ Setting.COLOR_SCALE,
+] as const;
+export type RealizationSeismicDepthSliceSettings = typeof realizationSeismicDepthSliceSettings;
+type SettingsWithTypes = MakeSettingTypesMap;
+
+export type RealizationSeismicDepthSliceData = SeismicSliceData_trans;
+
+export type RealizationSeismicDepthSliceStoredData = {
+ seismicCubeMeta: SeismicCubeMeta_api[];
+};
+
+export class RealizationSeismicDepthSliceProvider
+ implements
+ CustomDataProviderImplementation<
+ RealizationSeismicDepthSliceSettings,
+ RealizationSeismicDepthSliceData,
+ RealizationSeismicDepthSliceStoredData
+ >
+{
+ settings = realizationSeismicDepthSliceSettings;
+
+ getDefaultName(): string {
+ return "Seismic Inline (realization)";
+ }
+
+ doSettingsChangesRequireDataRefetch(prevSettings: SettingsWithTypes, newSettings: SettingsWithTypes): boolean {
+ return !isEqual(prevSettings, newSettings);
+ }
+
+ makeValueRange(
+ accessors: DataProviderInformationAccessors<
+ RealizationSeismicDepthSliceSettings,
+ RealizationSeismicDepthSliceData,
+ RealizationSeismicDepthSliceStoredData
+ >,
+ ): [number, number] | null {
+ const data = accessors.getData();
+ if (!data) {
+ return null;
+ }
+ return [data.value_min, data.value_max];
+ }
+
+ fetchData({
+ getSetting,
+ registerQueryKey,
+ queryClient,
+ }: FetchDataParams<
+ RealizationSeismicDepthSliceSettings,
+ RealizationSeismicDepthSliceData
+ >): Promise {
+ const ensembleIdent = getSetting(Setting.ENSEMBLE);
+ const realizationNum = getSetting(Setting.REALIZATION);
+ const attribute = getSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getSetting(Setting.TIME_OR_INTERVAL);
+ const depthSlice = getSetting(Setting.SEISMIC_DEPTH_SLICE);
+
+ const queryOptions = getDepthSliceOptions({
+ query: {
+ case_uuid: ensembleIdent?.getCaseUuid() ?? "",
+ ensemble_name: ensembleIdent?.getEnsembleName() ?? "",
+ realization_num: realizationNum ?? 0,
+ seismic_attribute: attribute ?? "",
+ time_or_interval_str: timeOrInterval ?? "",
+ observed: false,
+ depth_slice_no: depthSlice ?? 0,
+ },
+ });
+
+ registerQueryKey(queryOptions.queryKey);
+
+ return queryClient
+ .fetchQuery({
+ ...queryOptions,
+ })
+ .then((data) => transformSeismicSlice(data));
+ }
+
+ defineDependencies({
+ helperDependency,
+ availableSettingsUpdater,
+ storedDataUpdater,
+ queryClient,
+ }: DefineDependenciesArgs): void {
+ availableSettingsUpdater(Setting.ENSEMBLE, ({ getGlobalSetting }) => {
+ const fieldIdentifier = getGlobalSetting("fieldId");
+ const ensembles = getGlobalSetting("ensembles");
+
+ const ensembleIdents = ensembles
+ .filter((ensemble) => ensemble.getFieldIdentifier() === fieldIdentifier)
+ .map((ensemble) => ensemble.getIdent());
+
+ return ensembleIdents;
+ });
+
+ availableSettingsUpdater(Setting.REALIZATION, ({ getLocalSetting, getGlobalSetting }) => {
+ const ensembleIdent = getLocalSetting(Setting.ENSEMBLE);
+ const realizationFilterFunc = getGlobalSetting("realizationFilterFunction");
+
+ if (!ensembleIdent) {
+ return [];
+ }
+
+ const realizations = realizationFilterFunc(ensembleIdent);
+
+ return [...realizations];
+ });
+
+ const realizationSeismicCrosslineDataDep = helperDependency(async ({ getLocalSetting, abortSignal }) => {
+ const ensembleIdent = getLocalSetting(Setting.ENSEMBLE);
+ const realization = getLocalSetting(Setting.REALIZATION);
+
+ if (!ensembleIdent || realization === null) {
+ return null;
+ }
+
+ return await queryClient.fetchQuery({
+ ...getSeismicCubeMetaListOptions({
+ query: {
+ case_uuid: ensembleIdent.getCaseUuid(),
+ ensemble_name: ensembleIdent.getEnsembleName(),
+ },
+ signal: abortSignal,
+ }),
+ });
+ });
+
+ storedDataUpdater("seismicCubeMeta", ({ getHelperDependency }) => {
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!data) {
+ return null;
+ }
+
+ return data;
+ });
+
+ availableSettingsUpdater(Setting.ATTRIBUTE, ({ getHelperDependency }) => {
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!data) {
+ return [];
+ }
+
+ const availableSeismicAttributes = [
+ ...Array.from(new Set(data.map((seismicInfos) => seismicInfos.seismicAttribute))),
+ ];
+
+ return availableSeismicAttributes;
+ });
+
+ availableSettingsUpdater(Setting.TIME_OR_INTERVAL, ({ getLocalSetting, getHelperDependency }) => {
+ const seismicAttribute = getLocalSetting(Setting.ATTRIBUTE);
+
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!seismicAttribute || !data) {
+ return [];
+ }
+
+ const availableTimeOrIntervals = [
+ ...Array.from(
+ new Set(
+ data
+ .filter((surface) => surface.seismicAttribute === seismicAttribute)
+ .map((el) => el.isoDateOrInterval),
+ ),
+ ),
+ ];
+
+ return availableTimeOrIntervals;
+ });
+
+ availableSettingsUpdater(Setting.SEISMIC_DEPTH_SLICE, ({ getLocalSetting, getHelperDependency }) => {
+ const seismicAttribute = getLocalSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getLocalSetting(Setting.TIME_OR_INTERVAL);
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!seismicAttribute || !timeOrInterval || !data) {
+ return [0, 0, 0];
+ }
+ const seismicInfo = data.filter(
+ (seismicInfos) =>
+ seismicInfos.seismicAttribute === seismicAttribute &&
+ seismicInfos.isoDateOrInterval === timeOrInterval,
+ )[0];
+ const zMin = seismicInfo.spec.zOrigin;
+ const zMax =
+ seismicInfo.spec.zOrigin +
+ seismicInfo.spec.zInc * seismicInfo.spec.zFlip * (seismicInfo.spec.numLayers - 1);
+ const zInc = seismicInfo.spec.zInc;
+
+ return [zMin, zMax, zInc];
+ });
+ }
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicInlineProvider.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicInlineProvider.ts
new file mode 100644
index 000000000..26baf97ed
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/RealizationSeismicInlineProvider.ts
@@ -0,0 +1,214 @@
+import { type SeismicCubeMeta_api, getInlineSliceOptions, getSeismicCubeMetaListOptions } from "@api";
+import {
+ type SeismicSliceData_trans,
+ transformSeismicSlice,
+} from "@modules/3DViewerNew/settings/queries/queryDataTransforms";
+import type {
+ CustomDataProviderImplementation,
+ DataProviderInformationAccessors,
+ FetchDataParams,
+} from "@modules/_shared/DataProviderFramework/interfacesAndTypes/customDataProviderImplementation";
+import type { DefineDependenciesArgs } from "@modules/_shared/DataProviderFramework/interfacesAndTypes/customSettingsHandler";
+import { Setting, type MakeSettingTypesMap } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+
+import { isEqual } from "lodash";
+
+const realizationSeismicInlineSettings = [
+ Setting.ENSEMBLE,
+ Setting.REALIZATION,
+ Setting.ATTRIBUTE,
+ Setting.TIME_OR_INTERVAL,
+ Setting.SEISMIC_INLINE,
+ Setting.COLOR_SCALE,
+] as const;
+export type RealizationSeismicInlineSettings = typeof realizationSeismicInlineSettings;
+type SettingsWithTypes = MakeSettingTypesMap;
+
+export type RealizationSeismicInlineData = SeismicSliceData_trans;
+
+export type RealizationSeismicInlineStoredData = {
+ seismicCubeMeta: SeismicCubeMeta_api[];
+};
+
+export class RealizationSeismicInlineProvider
+ implements
+ CustomDataProviderImplementation<
+ RealizationSeismicInlineSettings,
+ RealizationSeismicInlineData,
+ RealizationSeismicInlineStoredData
+ >
+{
+ settings = realizationSeismicInlineSettings;
+
+ getDefaultName(): string {
+ return "Seismic Inline (realization)";
+ }
+
+ doSettingsChangesRequireDataRefetch(prevSettings: SettingsWithTypes, newSettings: SettingsWithTypes): boolean {
+ return !isEqual(prevSettings, newSettings);
+ }
+
+ makeValueRange(
+ accessors: DataProviderInformationAccessors<
+ RealizationSeismicInlineSettings,
+ RealizationSeismicInlineData,
+ RealizationSeismicInlineStoredData
+ >,
+ ): [number, number] | null {
+ const data = accessors.getData();
+ if (!data) {
+ return null;
+ }
+ return [data.value_min, data.value_max];
+ }
+
+ fetchData({
+ getSetting,
+ registerQueryKey,
+ queryClient,
+ }: FetchDataParams<
+ RealizationSeismicInlineSettings,
+ RealizationSeismicInlineData
+ >): Promise {
+ const ensembleIdent = getSetting(Setting.ENSEMBLE);
+ const realizationNum = getSetting(Setting.REALIZATION);
+ const attribute = getSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getSetting(Setting.TIME_OR_INTERVAL);
+ const inlineNumber = getSetting(Setting.SEISMIC_INLINE);
+
+ const queryOptions = getInlineSliceOptions({
+ query: {
+ case_uuid: ensembleIdent?.getCaseUuid() ?? "",
+ ensemble_name: ensembleIdent?.getEnsembleName() ?? "",
+ realization_num: realizationNum ?? 0,
+ seismic_attribute: attribute ?? "",
+ time_or_interval_str: timeOrInterval ?? "",
+ observed: false,
+ inline_no: inlineNumber ?? 0,
+ },
+ });
+
+ registerQueryKey(queryOptions.queryKey);
+
+ return queryClient
+ .fetchQuery({
+ ...queryOptions,
+ })
+ .then((data) => transformSeismicSlice(data));
+ }
+
+ defineDependencies({
+ helperDependency,
+ availableSettingsUpdater,
+ storedDataUpdater,
+ queryClient,
+ }: DefineDependenciesArgs): void {
+ availableSettingsUpdater(Setting.ENSEMBLE, ({ getGlobalSetting }) => {
+ const fieldIdentifier = getGlobalSetting("fieldId");
+ const ensembles = getGlobalSetting("ensembles");
+
+ const ensembleIdents = ensembles
+ .filter((ensemble) => ensemble.getFieldIdentifier() === fieldIdentifier)
+ .map((ensemble) => ensemble.getIdent());
+
+ return ensembleIdents;
+ });
+
+ availableSettingsUpdater(Setting.REALIZATION, ({ getLocalSetting, getGlobalSetting }) => {
+ const ensembleIdent = getLocalSetting(Setting.ENSEMBLE);
+ const realizationFilterFunc = getGlobalSetting("realizationFilterFunction");
+
+ if (!ensembleIdent) {
+ return [];
+ }
+
+ const realizations = realizationFilterFunc(ensembleIdent);
+
+ return [...realizations];
+ });
+
+ const realizationSeismicCrosslineDataDep = helperDependency(async ({ getLocalSetting, abortSignal }) => {
+ const ensembleIdent = getLocalSetting(Setting.ENSEMBLE);
+ const realization = getLocalSetting(Setting.REALIZATION);
+
+ if (!ensembleIdent || realization === null) {
+ return null;
+ }
+
+ return await queryClient.fetchQuery({
+ ...getSeismicCubeMetaListOptions({
+ query: {
+ case_uuid: ensembleIdent.getCaseUuid(),
+ ensemble_name: ensembleIdent.getEnsembleName(),
+ },
+ signal: abortSignal,
+ }),
+ });
+ });
+
+ storedDataUpdater("seismicCubeMeta", ({ getHelperDependency }) => {
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!data) {
+ return null;
+ }
+
+ return data;
+ });
+
+ availableSettingsUpdater(Setting.ATTRIBUTE, ({ getHelperDependency }) => {
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!data) {
+ return [];
+ }
+
+ const availableSeismicAttributes = [
+ ...Array.from(new Set(data.map((seismicInfos) => seismicInfos.seismicAttribute))),
+ ];
+
+ return availableSeismicAttributes;
+ });
+
+ availableSettingsUpdater(Setting.TIME_OR_INTERVAL, ({ getLocalSetting, getHelperDependency }) => {
+ const seismicAttribute = getLocalSetting(Setting.ATTRIBUTE);
+
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!seismicAttribute || !data) {
+ return [];
+ }
+
+ const availableTimeOrIntervals = [
+ ...Array.from(
+ new Set(
+ data
+ .filter((surface) => surface.seismicAttribute === seismicAttribute)
+ .map((el) => el.isoDateOrInterval),
+ ),
+ ),
+ ];
+
+ return availableTimeOrIntervals;
+ });
+
+ availableSettingsUpdater(Setting.SEISMIC_INLINE, ({ getLocalSetting, getHelperDependency }) => {
+ const seismicAttribute = getLocalSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getLocalSetting(Setting.TIME_OR_INTERVAL);
+ const data = getHelperDependency(realizationSeismicCrosslineDataDep);
+
+ if (!seismicAttribute || !timeOrInterval || !data) {
+ return [0, 0, 0];
+ }
+ const seismicInfo = data.filter(
+ (seismicInfos) =>
+ seismicInfos.seismicAttribute === seismicAttribute &&
+ seismicInfos.isoDateOrInterval === timeOrInterval,
+ )[0];
+ const iMin = 0;
+ const iMax = seismicInfo.spec.numCols - 1;
+
+ return [iMin, iMax, 1];
+ });
+ }
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/dataProviderTypes.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/dataProviderTypes.ts
new file mode 100644
index 000000000..53e1162e7
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/dataProviderTypes.ts
@@ -0,0 +1,5 @@
+export enum CustomDataProviderType {
+ REALIZATION_SEISMIC_CROSSLINE = "REALIZATION_SEISMIC_CROSSLINE",
+ REALIZATION_SEISMIC_INLINE = "REALIZATION_SEISMIC_INLINE",
+ REALIZATION_SEISMIC_DEPTH_SLICE = "REALIZATION_SEISMIC_DEPTH_SLICE",
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/registerAllDataProviders.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/registerAllDataProviders.ts
new file mode 100644
index 000000000..117d54bb7
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/customDataProviderImplementations/registerAllDataProviders.ts
@@ -0,0 +1,19 @@
+import { DataProviderRegistry } from "@modules/_shared/DataProviderFramework/dataProviders/DataProviderRegistry";
+
+import { CustomDataProviderType } from "./dataProviderTypes";
+import { RealizationSeismicCrosslineProvider } from "./RealizationSeismicCrosslineProvider";
+import { RealizationSeismicDepthSliceProvider } from "./RealizationSeismicDepthProvider";
+import { RealizationSeismicInlineProvider } from "./RealizationSeismicInlineProvider";
+
+DataProviderRegistry.registerDataProvider(
+ CustomDataProviderType.REALIZATION_SEISMIC_CROSSLINE,
+ RealizationSeismicCrosslineProvider,
+);
+DataProviderRegistry.registerDataProvider(
+ CustomDataProviderType.REALIZATION_SEISMIC_INLINE,
+ RealizationSeismicInlineProvider,
+);
+DataProviderRegistry.registerDataProvider(
+ CustomDataProviderType.REALIZATION_SEISMIC_DEPTH_SLICE,
+ RealizationSeismicDepthSliceProvider,
+);
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeDrilledWellTrajectoriesLayer.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeDrilledWellTrajectoriesLayer.ts
new file mode 100644
index 000000000..aed74af29
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeDrilledWellTrajectoriesLayer.ts
@@ -0,0 +1,47 @@
+import type { WellboreTrajectory_api } from "@api";
+import * as bbox from "@lib/utils/bbox";
+import { WellsLayer } from "@modules/_shared/customDeckGlLayers/WellsLayer/WellsLayer";
+import type { WellsLayerData } from "@modules/_shared/customDeckGlLayers/WellsLayer/WellsLayer";
+import { makeDrilledWellTrajectoriesBoundingBox } from "@modules/_shared/DataProviderFramework/visualization/deckgl/boundingBoxes/makeDrilledWellTrajectoriesBoundingBox";
+import type { TransformerArgs } from "@modules/_shared/DataProviderFramework/visualization/VisualizationAssembler";
+
+export function makeDrilledWellTrajectoriesLayer(
+ args: TransformerArgs,
+): WellsLayer | null {
+ const { id, getData, name } = args;
+
+ const fieldWellboreTrajectoriesData = getData();
+
+ if (!fieldWellboreTrajectoriesData) {
+ return null;
+ }
+
+ const wellsLayerData: WellsLayerData = [];
+ for (const wellboreData of fieldWellboreTrajectoriesData) {
+ const properties = {
+ uuid: wellboreData.wellboreUuid,
+ name: wellboreData.uniqueWellboreIdentifier,
+ mdArray: wellboreData.mdArr,
+ };
+ const coordinates: [number, number, number][] = wellboreData.eastingArr.map((easting, index) => {
+ return [easting, wellboreData.northingArr[index], -wellboreData.tvdMslArr[index]];
+ });
+ wellsLayerData.push({ properties, coordinates });
+ }
+
+ const boundingBox = makeDrilledWellTrajectoriesBoundingBox(args);
+
+ if (!boundingBox) {
+ return null;
+ }
+
+ const wellsLayer = new WellsLayer({
+ id: id,
+ name,
+ data: wellsLayerData,
+ zIncreaseDownwards: true,
+ boundingBox: bbox.toNumArray(boundingBox),
+ });
+
+ return wellsLayer;
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeIntersectionGrid3dLayer.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeIntersectionGrid3dLayer.ts
new file mode 100644
index 000000000..5d88a5b0d
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeIntersectionGrid3dLayer.ts
@@ -0,0 +1,114 @@
+import type { IntersectionRealizationGridSettings } from "@modules/_shared/DataProviderFramework/dataProviders/implementations/IntersectionRealizationGridProvider";
+import { Setting } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+import { makeColorMapFunctionFromColorScale } from "@modules/_shared/DataProviderFramework/visualization/utils/colors";
+import type { TransformerArgs } from "@modules/_shared/DataProviderFramework/visualization/VisualizationAssembler";
+import { FenceMeshSection_trans, PolylineIntersection_trans } from "@modules/_shared/utils/wellbore";
+import { TGrid3DColoringMode } from "@webviz/subsurface-viewer";
+import { Grid3DLayer } from "@webviz/subsurface-viewer/dist/layers";
+
+interface PolyDataVtk {
+ points: Float32Array;
+ polys: Uint32Array;
+ props: Float32Array;
+}
+
+function buildVtkStylePolyDataFromFenceSections(fenceSections: FenceMeshSection_trans[]): PolyDataVtk {
+ // Calculate sizes of typed arrays
+ let totNumVertices = 0;
+ let totNumPolygons = 0;
+ let totNumConnectivities = 0;
+ for (const section of fenceSections) {
+ totNumVertices += section.verticesUzFloat32Arr.length / 2;
+ totNumPolygons += section.verticesPerPolyUintArr.length;
+ totNumConnectivities += section.polyIndicesUintArr.length;
+ }
+
+ const pointsFloat32Arr = new Float32Array(3 * totNumVertices);
+ const polysUint32Arr = new Uint32Array(totNumPolygons + totNumConnectivities);
+ const polyPropsFloat32Arr = new Float32Array(totNumPolygons);
+
+ let floatPointsDstIdx = 0;
+ let polysDstIdx = 0;
+ let propsDstIdx = 0;
+ for (const section of fenceSections) {
+ // uv to xyz
+ const directionX = section.end_utm_x - section.start_utm_x;
+ const directionY = section.end_utm_y - section.start_utm_y;
+ const magnitude = Math.sqrt(directionX ** 2 + directionY ** 2);
+ const unitDirectionX = directionX / magnitude;
+ const unitDirectionY = directionY / magnitude;
+
+ const connOffset = floatPointsDstIdx / 3;
+
+ for (let i = 0; i < section.verticesUzFloat32Arr.length; i += 2) {
+ const u = section.verticesUzFloat32Arr[i];
+ const z = section.verticesUzFloat32Arr[i + 1];
+ const x = u * unitDirectionX + section.start_utm_x;
+ const y = u * unitDirectionY + section.start_utm_y;
+
+ pointsFloat32Arr[floatPointsDstIdx++] = x;
+ pointsFloat32Arr[floatPointsDstIdx++] = y;
+ pointsFloat32Arr[floatPointsDstIdx++] = z;
+ }
+
+ // Fix poly indexes for each section
+ const numPolysInSection = section.verticesPerPolyUintArr.length;
+ let srcIdx = 0;
+ for (let i = 0; i < numPolysInSection; i++) {
+ const numVertsInPoly = section.verticesPerPolyUintArr[i];
+ polysUint32Arr[polysDstIdx++] = numVertsInPoly;
+
+ for (let j = 0; j < numVertsInPoly; j++) {
+ polysUint32Arr[polysDstIdx++] = section.polyIndicesUintArr[srcIdx++] + connOffset;
+ }
+ }
+
+ polyPropsFloat32Arr.set(section.polyPropsFloat32Arr, propsDstIdx);
+ propsDstIdx += numPolysInSection;
+ }
+
+ return {
+ points: pointsFloat32Arr,
+ polys: polysUint32Arr,
+ props: polyPropsFloat32Arr,
+ };
+}
+
+export function makeIntersectionLayer({
+ id,
+ name,
+ getData,
+ getSetting,
+}: TransformerArgs): Grid3DLayer | null {
+ const data = getData();
+ const colorScale = getSetting(Setting.COLOR_SCALE)?.colorScale;
+ const showGridLines = getSetting(Setting.SHOW_GRID_LINES);
+
+ if (!data) {
+ return null;
+ }
+ const polyData = buildVtkStylePolyDataFromFenceSections(data.fenceMeshSections);
+
+ const grid3dIntersectionLayer = new Grid3DLayer({
+ id,
+ name,
+ pointsData: polyData.points,
+ polysData: polyData.polys,
+ propertiesData: polyData.props,
+ colorMapName: "Continuous",
+ colorMapRange: [data.min_grid_prop_value, data.max_grid_prop_value],
+ colorMapClampColor: true,
+ coloringMode: TGrid3DColoringMode.Property,
+ colorMapFunction: makeColorMapFunctionFromColorScale(
+ colorScale,
+ data.min_grid_prop_value,
+ data.max_grid_prop_value,
+ ),
+ ZIncreasingDownwards: false,
+ gridLines: showGridLines ?? false,
+ material: { ambient: 0.4, diffuse: 0.7, shininess: 8, specularColor: [25, 25, 25] },
+ pickable: true,
+ });
+
+ return grid3dIntersectionLayer;
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeRealizationSurfaceLayer.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeRealizationSurfaceLayer.ts
new file mode 100644
index 000000000..0d9dc5b41
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeRealizationSurfaceLayer.ts
@@ -0,0 +1,69 @@
+import { SurfaceDataFormat } from "@modules/2DViewer/DataProviderFramework/customDataProviderImplementations/ObservedSurfaceProvider";
+import type {
+ RealizationSurfaceData,
+ RealizationSurfaceSettings,
+} from "@modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationSurfaceProvider";
+import { Setting } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+import { makeColorMapFunctionFromColorScale } from "@modules/_shared/DataProviderFramework/visualization/utils/colors";
+import type { TransformerArgs } from "@modules/_shared/DataProviderFramework/visualization/VisualizationAssembler";
+import { MapLayer } from "@webviz/subsurface-viewer/dist/layers";
+
+export function makeRealizationSurfaceLayer({
+ id,
+ name,
+ getData,
+ getSetting,
+}: TransformerArgs): MapLayer | null {
+ const data = getData();
+ const colorScale = getSetting(Setting.COLOR_SCALE)?.colorScale;
+
+ if (!data) {
+ return null;
+ }
+
+ if (data.surfaceData.format === SurfaceDataFormat.FLOAT) {
+ return new MapLayer({
+ id,
+ name,
+ meshData: data.surfaceData.valuesFloat32Arr,
+ frame: {
+ origin: [data.surfaceData.surface_def.origin_utm_x, data.surfaceData.surface_def.origin_utm_y],
+ count: [data.surfaceData.surface_def.npoints_x, data.surfaceData.surface_def.npoints_y],
+ increment: [data.surfaceData.surface_def.inc_x, data.surfaceData.surface_def.inc_y],
+ rotDeg: data.surfaceData.surface_def.rot_deg,
+ },
+ valueRange: [data.surfaceData.value_min, data.surfaceData.value_max],
+ colorMapRange: [data.surfaceData.value_min, data.surfaceData.value_max],
+ colorMapFunction: makeColorMapFunctionFromColorScale(
+ colorScale,
+ data.surfaceData.value_min,
+ data.surfaceData.value_max,
+ ),
+ gridLines: false,
+ });
+ }
+
+ if (data.surfaceData.format === SurfaceDataFormat.PNG) {
+ return new MapLayer({
+ id,
+ name,
+ meshData: data.surfaceData.png_image_base64,
+ frame: {
+ origin: [data.surfaceData.surface_def.origin_utm_x, data.surfaceData.surface_def.origin_utm_y],
+ count: [data.surfaceData.surface_def.npoints_x, data.surfaceData.surface_def.npoints_y],
+ increment: [data.surfaceData.surface_def.inc_x, data.surfaceData.surface_def.inc_y],
+ rotDeg: data.surfaceData.surface_def.rot_deg,
+ },
+ valueRange: [data.surfaceData.value_min, data.surfaceData.value_max],
+ colorMapRange: [data.surfaceData.value_min, data.surfaceData.value_max],
+ colorMapFunction: makeColorMapFunctionFromColorScale(
+ colorScale,
+ data.surfaceData.value_min,
+ data.surfaceData.value_max,
+ ),
+ gridLines: false,
+ });
+ }
+
+ return null;
+}
diff --git a/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeSeismicFenceMeshLayer.ts b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeSeismicFenceMeshLayer.ts
new file mode 100644
index 000000000..b0ca68656
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/DataProviderFramework/visualization/makeSeismicFenceMeshLayer.ts
@@ -0,0 +1,278 @@
+import { Layer } from "@deck.gl/core";
+import * as bbox from "@lib/utils/bbox";
+import { Geometry, ShapeType, degreesToRadians } from "@lib/utils/geometry";
+import { rotatePoint2Around } from "@lib/utils/vec2";
+import * as vec3 from "@lib/utils/vec3";
+import { SeismicSliceData_trans } from "@modules/3DViewerNew/settings/queries/queryDataTransforms";
+import { SeismicFenceMeshLayer } from "@modules/_shared/customDeckGlLayers/SeismicFenceMeshLayer/SeismicFenceMeshLayer";
+
+import type { RealizationSeismicDepthSliceStoredData } from "../customDataProviderImplementations/RealizationSeismicDepthProvider";
+import type { TransformerArgs } from "@modules/_shared/DataProviderFramework/visualization/VisualizationAssembler";
+import { Setting } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+import { makeColorMapFunctionFromColorScale } from "@modules/_shared/DataProviderFramework/visualization/utils/colors";
+
+export enum Plane {
+ CROSSLINE = "CROSSLINE",
+ INLINE = "INLINE",
+ DEPTH = "DEPTH",
+}
+
+function predictDepthSliceGeometry({
+ getSetting,
+ getStoredData,
+}: TransformerArgs): Geometry | null {
+ const attribute = getSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getSetting(Setting.TIME_OR_INTERVAL);
+ const seismicDepthSliceNumber = getSetting(Setting.SEISMIC_DEPTH_SLICE);
+ const seismicCubeMeta = getStoredData("seismicCubeMeta");
+
+ if (!seismicCubeMeta || seismicDepthSliceNumber === null) {
+ return null;
+ }
+
+ const meta = seismicCubeMeta.find(
+ (m) => m.seismicAttribute === attribute && m.isoDateOrInterval === timeOrInterval,
+ );
+
+ if (!meta) {
+ return null;
+ }
+
+ const xmin = meta.spec.xOrigin;
+ const xmax = meta.spec.xOrigin + meta.spec.xInc * (meta.spec.numCols - 1);
+
+ const ymin = meta.spec.yOrigin;
+ const ymax = meta.spec.yOrigin + meta.spec.yInc * meta.spec.yFlip * (meta.spec.numRows - 1);
+
+ const zmin = seismicDepthSliceNumber;
+ const zmax = zmin;
+
+ const maxXY = { x: xmax, y: ymax };
+ const maxX = { x: xmax, y: ymin };
+ const maxY = { x: xmin, y: ymax };
+ const origin = { x: meta.spec.xOrigin, y: meta.spec.yOrigin };
+
+ const rotatedMaxXY = rotatePoint2Around(maxXY, origin, degreesToRadians(meta.spec.rotationDeg));
+ const rotatedMaxX = rotatePoint2Around(maxX, origin, degreesToRadians(meta.spec.rotationDeg));
+ const rotatedMaxY = rotatePoint2Around(maxY, origin, degreesToRadians(meta.spec.rotationDeg));
+
+ const boundingBox = bbox.create(
+ vec3.create(Math.min(origin.x, rotatedMaxXY.x), Math.min(origin.y, rotatedMaxXY.y), zmin),
+ vec3.create(Math.max(origin.x, rotatedMaxXY.x), Math.max(origin.y, rotatedMaxXY.y), zmax),
+ );
+
+ const geometry: Geometry = {
+ shapes: [
+ {
+ type: ShapeType.BOX,
+ centerPoint: vec3.create((origin.x + rotatedMaxXY.x) / 2, (origin.y + rotatedMaxXY.y) / 2, zmin),
+ dimensions: {
+ width: Math.abs(rotatedMaxX.x - origin.x),
+ height: Math.abs(rotatedMaxY.y - origin.y),
+ depth: 0,
+ },
+ normalizedEdgeVectors: {
+ u: vec3.normalize(vec3.create(rotatedMaxX.x - origin.x, rotatedMaxX.y - origin.y, 0)),
+ v: vec3.normalize(vec3.create(rotatedMaxY.x - origin.x, rotatedMaxY.y - origin.y, 0)),
+ },
+ },
+ ],
+ boundingBox,
+ };
+
+ return geometry;
+}
+
+function predictCrosslineGeometry({
+ getSetting,
+ getStoredData,
+}: TransformerArgs): Geometry | null {
+ const attribute = getSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getSetting(Setting.TIME_OR_INTERVAL);
+ const seismicCrosslineNumber = getSetting(Setting.SEISMIC_CROSSLINE);
+ const seismicCubeMeta = getStoredData("seismicCubeMeta");
+
+ if (!seismicCubeMeta || seismicCrosslineNumber === null) {
+ return null;
+ }
+
+ const meta = seismicCubeMeta.find(
+ (m) => m.seismicAttribute === attribute && m.isoDateOrInterval === timeOrInterval,
+ );
+
+ if (!meta) {
+ return null;
+ }
+
+ const xmin = meta.spec.xOrigin;
+ const xmax = meta.spec.xOrigin + meta.spec.xInc * (meta.spec.numCols - 1);
+
+ const ymin = meta.spec.yOrigin + meta.spec.yInc * meta.spec.yFlip * seismicCrosslineNumber;
+ const ymax = ymin;
+
+ const zmin = meta.spec.zOrigin;
+ const zmax = meta.spec.zOrigin + meta.spec.zInc * meta.spec.zFlip * (meta.spec.numLayers - 1);
+
+ const maxXY = { x: xmax, y: ymax };
+ const minXY = { x: xmin, y: ymin };
+ const origin = { x: meta.spec.xOrigin, y: meta.spec.yOrigin };
+
+ const rotatedMinXY = rotatePoint2Around(minXY, origin, degreesToRadians(meta.spec.rotationDeg));
+ const rotatedMaxXY = rotatePoint2Around(maxXY, origin, degreesToRadians(meta.spec.rotationDeg));
+
+ const geometry: Geometry = {
+ shapes: [
+ {
+ type: ShapeType.BOX,
+ centerPoint: vec3.create(
+ (rotatedMinXY.x + rotatedMaxXY.x) / 2,
+ (rotatedMinXY.y + rotatedMaxXY.y) / 2,
+ (zmin + zmax) / 2,
+ ),
+ dimensions: {
+ width: vec3.length(
+ vec3.create(rotatedMaxXY.x - rotatedMinXY.x, rotatedMaxXY.y - rotatedMinXY.y, 0),
+ ),
+ height: Math.abs(zmax - zmin),
+ depth: 0,
+ },
+ normalizedEdgeVectors: {
+ u: vec3.normalize(vec3.create(rotatedMaxXY.x - rotatedMinXY.x, rotatedMaxXY.y - rotatedMinXY.y, 0)),
+ v: vec3.create(0, 0, 1),
+ },
+ },
+ ],
+ boundingBox: bbox.create(
+ vec3.create(Math.min(rotatedMinXY.x, rotatedMaxXY.x), Math.min(rotatedMinXY.y, rotatedMaxXY.y), zmin),
+ vec3.create(Math.max(rotatedMinXY.x, rotatedMaxXY.x), Math.max(rotatedMinXY.y, rotatedMaxXY.y), zmax),
+ ),
+ };
+
+ return geometry;
+}
+
+function predictInlineGeometry({
+ getSetting,
+ getStoredData,
+}: TransformerArgs): Geometry | null {
+ const attribute = getSetting(Setting.ATTRIBUTE);
+ const timeOrInterval = getSetting(Setting.TIME_OR_INTERVAL);
+ const seismicInlineNumber = getSetting(Setting.SEISMIC_INLINE);
+ const seismicCubeMeta = getStoredData("seismicCubeMeta");
+
+ if (!seismicCubeMeta || seismicInlineNumber === null) {
+ return null;
+ }
+
+ const meta = seismicCubeMeta.find(
+ (m) => m.seismicAttribute === attribute && m.isoDateOrInterval === timeOrInterval,
+ );
+
+ if (!meta) {
+ return null;
+ }
+
+ const xmin = meta.spec.xOrigin + meta.spec.yInc * seismicInlineNumber;
+ const xmax = xmin;
+
+ const ymin = meta.spec.yOrigin;
+ const ymax = meta.spec.yOrigin + meta.spec.yInc * meta.spec.yFlip * (meta.spec.numRows - 1);
+
+ const zmin = meta.spec.zOrigin;
+ const zmax = meta.spec.zOrigin + meta.spec.zInc * meta.spec.zFlip * (meta.spec.numLayers - 1);
+
+ const maxXY = { x: xmax, y: ymax };
+ const minXY = { x: xmin, y: ymin };
+ const origin = { x: meta.spec.xOrigin, y: meta.spec.yOrigin };
+
+ const rotatedMinXY = rotatePoint2Around(minXY, origin, (meta.spec.rotationDeg / 180.0) * Math.PI);
+ const rotatedMaxXY = rotatePoint2Around(maxXY, origin, (meta.spec.rotationDeg / 180.0) * Math.PI);
+
+ const geometry: Geometry = {
+ shapes: [
+ {
+ type: ShapeType.BOX,
+ centerPoint: vec3.create(
+ (rotatedMinXY.x + rotatedMaxXY.x) / 2,
+ (rotatedMinXY.y + rotatedMaxXY.y) / 2,
+ (zmin + zmax) / 2,
+ ),
+ dimensions: {
+ width: vec3.length(
+ vec3.create(rotatedMaxXY.x - rotatedMinXY.x, rotatedMaxXY.y - rotatedMinXY.y, 0),
+ ),
+ height: Math.abs(zmax - zmin),
+ depth: 0,
+ },
+ normalizedEdgeVectors: {
+ u: vec3.normalize(vec3.create(rotatedMaxXY.x - rotatedMinXY.x, rotatedMaxXY.y - rotatedMinXY.y, 0)),
+ v: vec3.create(0, 0, 1),
+ },
+ },
+ ],
+ boundingBox: bbox.create(
+ vec3.create(Math.min(rotatedMinXY.x, rotatedMaxXY.x), Math.min(rotatedMinXY.y, rotatedMaxXY.y), zmin),
+ vec3.create(Math.max(rotatedMinXY.x, rotatedMaxXY.x), Math.max(rotatedMinXY.y, rotatedMaxXY.y), zmax),
+ ),
+ };
+
+ return geometry;
+}
+
+export function makeSeismicFenceMeshLayerFunction(plane: Plane) {
+ return function makeSeismicFenceMeshLayer(
+ args: TransformerArgs,
+ ): Layer | null {
+ const { id, name, getData, getSetting, isLoading } = args;
+ const data = getData();
+ const colorScale = getSetting("colorScale")?.colorScale;
+
+ if (!data) {
+ return null;
+ }
+
+ let bbox: number[][] = [
+ [data.bbox_utm[0][0], data.bbox_utm[0][1], data.u_min],
+ [data.bbox_utm[1][0], data.bbox_utm[1][1], data.u_min],
+ [data.bbox_utm[0][0], data.bbox_utm[0][1], data.u_max],
+ [data.bbox_utm[1][0], data.bbox_utm[1][1], data.u_max],
+ ];
+
+ let predictedGeometry: Geometry | null = null;
+
+ if (plane === Plane.DEPTH) {
+ const seismicDepthSlice = getSetting(Setting.SEISMIC_DEPTH_SLICE);
+ bbox = [
+ [data.bbox_utm[0][0], data.bbox_utm[0][1], seismicDepthSlice],
+ [data.bbox_utm[3][0], data.bbox_utm[3][1], seismicDepthSlice],
+ [data.bbox_utm[1][0], data.bbox_utm[1][1], seismicDepthSlice],
+ [data.bbox_utm[2][0], data.bbox_utm[2][1], seismicDepthSlice],
+ ];
+
+ predictedGeometry = predictDepthSliceGeometry(args);
+ } else if (plane === Plane.CROSSLINE) {
+ predictedGeometry = predictCrosslineGeometry(args);
+ } else if (plane === Plane.INLINE) {
+ predictedGeometry = predictInlineGeometry(args);
+ }
+
+ return new SeismicFenceMeshLayer({
+ id,
+ name,
+ data: {
+ sections: [
+ {
+ boundingBox: bbox,
+ properties: data.dataFloat32Arr,
+ numSamplesU: data.u_num_samples,
+ numSamplesV: data.v_num_samples,
+ },
+ ],
+ },
+ colorMapFunction: makeColorMapFunctionFromColorScale(colorScale, data.value_min, data.value_max, false),
+ zIncreaseDownwards: true,
+ isLoading,
+ loadingGeometry: predictedGeometry ?? undefined,
+ });
+ };
+}
diff --git a/frontend/src/modules/3DViewerNew/interfaces.ts b/frontend/src/modules/3DViewerNew/interfaces.ts
new file mode 100644
index 000000000..64cc6ce89
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/interfaces.ts
@@ -0,0 +1,29 @@
+import { InterfaceInitialization } from "@framework/UniDirectionalModuleComponentsInterface";
+
+import { providerManagerAtom, preferredViewLayoutAtom } from "./settings/atoms/baseAtoms";
+import { PreferredViewLayout } from "./types";
+
+import { DataProviderManager } from "@modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager";
+import { selectedFieldIdentifierAtom } from "./settings/atoms/derivedAtoms";
+
+export type SettingsToViewInterface = {
+ layerManager: DataProviderManager | null;
+ fieldIdentifier: string | null;
+ preferredViewLayout: PreferredViewLayout;
+};
+
+export type Interfaces = {
+ settingsToView: SettingsToViewInterface;
+};
+
+export const settingsToViewInterfaceInitialization: InterfaceInitialization = {
+ layerManager: (get) => {
+ return get(providerManagerAtom);
+ },
+ fieldIdentifier: (get) => {
+ return get(selectedFieldIdentifierAtom);
+ },
+ preferredViewLayout: (get) => {
+ return get(preferredViewLayoutAtom);
+ },
+};
diff --git a/frontend/src/modules/3DViewerNew/loadModule.tsx b/frontend/src/modules/3DViewerNew/loadModule.tsx
new file mode 100644
index 000000000..8bb478e21
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/loadModule.tsx
@@ -0,0 +1,16 @@
+import { ModuleRegistry } from "@framework/ModuleRegistry";
+
+import type { Interfaces } from "./interfaces";
+import { settingsToViewInterfaceInitialization } from "./interfaces";
+import { MODULE_NAME } from "./registerModule";
+import { Settings } from "./settings/settings";
+import { View } from "./view/view";
+
+import "./DataProviderFramework/customDataProviderImplementations/registerAllDataProviders";
+
+const module = ModuleRegistry.initModule(MODULE_NAME, {
+ settingsToViewInterfaceInitialization,
+});
+
+module.settingsFC = Settings;
+module.viewFC = View;
diff --git a/frontend/src/modules/3DViewerNew/preview.jpg b/frontend/src/modules/3DViewerNew/preview.jpg
new file mode 100644
index 000000000..d1e2273e9
Binary files /dev/null and b/frontend/src/modules/3DViewerNew/preview.jpg differ
diff --git a/frontend/src/modules/3DViewerNew/preview.tsx b/frontend/src/modules/3DViewerNew/preview.tsx
new file mode 100644
index 000000000..831e956e2
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/preview.tsx
@@ -0,0 +1,6 @@
+import { DrawPreviewFunc } from "@framework/Preview";
+import previewImg from "./preview.jpg";
+
+export const preview: DrawPreviewFunc = function (width: number, height: number) {
+ return ;
+};
diff --git a/frontend/src/modules/3DViewerNew/registerModule.ts b/frontend/src/modules/3DViewerNew/registerModule.ts
new file mode 100644
index 000000000..cb06a94f5
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/registerModule.ts
@@ -0,0 +1,29 @@
+import { ModuleCategory, ModuleDevState } from "@framework/Module";
+import { ModuleDataTagId } from "@framework/ModuleDataTags";
+import { ModuleRegistry } from "@framework/ModuleRegistry";
+
+import { Interfaces } from "./interfaces";
+import { preview } from "./preview";
+
+export const MODULE_NAME: string = "3DViewerNew";
+
+const description = "Generic 3D viewer for grid, surfaces, and wells.";
+
+ModuleRegistry.registerModule({
+ moduleName: MODULE_NAME,
+ category: ModuleCategory.MAIN,
+ devState: ModuleDevState.DEV,
+ defaultTitle: "3D Viewer (new)",
+ preview,
+ description,
+ dataTagIds: [
+ ModuleDataTagId.SURFACE,
+ ModuleDataTagId.DRILLED_WELLS,
+ ModuleDataTagId.SEISMIC,
+ ModuleDataTagId.GRID3D,
+ ModuleDataTagId.POLYGONS,
+ ],
+ onInstanceUnload: (instanceId) => {
+ window.localStorage.removeItem(`${instanceId}-settings`);
+ },
+});
diff --git a/frontend/src/modules/3DViewerNew/settings/atoms/baseAtoms.ts b/frontend/src/modules/3DViewerNew/settings/atoms/baseAtoms.ts
new file mode 100644
index 000000000..6c7f4e9ed
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/settings/atoms/baseAtoms.ts
@@ -0,0 +1,8 @@
+import { PreferredViewLayout } from "@modules/2DViewer/types";
+import type { DataProviderManager } from "@modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager";
+
+import { atom } from "jotai";
+
+export const userSelectedFieldIdentifierAtom = atom(null);
+export const providerManagerAtom = atom(null);
+export const preferredViewLayoutAtom = atom(PreferredViewLayout.VERTICAL);
diff --git a/frontend/src/modules/3DViewerNew/settings/atoms/derivedAtoms.ts b/frontend/src/modules/3DViewerNew/settings/atoms/derivedAtoms.ts
new file mode 100644
index 000000000..ae64f8ba7
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/settings/atoms/derivedAtoms.ts
@@ -0,0 +1,19 @@
+import { EnsembleSetAtom } from "@framework/GlobalAtoms";
+
+import { atom } from "jotai";
+
+import { userSelectedFieldIdentifierAtom } from "./baseAtoms";
+
+export const selectedFieldIdentifierAtom = atom((get) => {
+ const ensembleSet = get(EnsembleSetAtom);
+ const userSelectedField = get(userSelectedFieldIdentifierAtom);
+
+ if (
+ !userSelectedField ||
+ !ensembleSet.getRegularEnsembleArray().some((ens) => ens.getFieldIdentifier() === userSelectedField)
+ ) {
+ return ensembleSet.getRegularEnsembleArray().at(0)?.getFieldIdentifier() ?? null;
+ }
+
+ return userSelectedField;
+});
diff --git a/frontend/src/modules/3DViewerNew/settings/components/dataProviderManagerComponentWrapper.tsx b/frontend/src/modules/3DViewerNew/settings/components/dataProviderManagerComponentWrapper.tsx
new file mode 100644
index 000000000..5cf3aaec3
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/settings/components/dataProviderManagerComponentWrapper.tsx
@@ -0,0 +1,420 @@
+import type React from "react";
+
+import { Icon } from "@equinor/eds-core-react";
+import { color_palette, fault, grid_layer, settings, surface_layer, wellbore } from "@equinor/eds-icons";
+import type { WorkbenchSession } from "@framework/WorkbenchSession";
+import type { WorkbenchSettings } from "@framework/WorkbenchSettings";
+import { Menu } from "@lib/components/Menu";
+import { MenuButton } from "@lib/components/MenuButton";
+import { MenuHeading } from "@lib/components/MenuHeading";
+import { MenuItem } from "@lib/components/MenuItem";
+import { PreferredViewLayout } from "@modules/2DViewer/types";
+import { GroupType } from "@modules/_shared/LayerFramework/groups/groupTypes";
+import { usePublishSubscribeTopicValue } from "@modules/_shared/utils/PublishSubscribeDelegate";
+import { Dropdown } from "@mui/base";
+import {
+ Check,
+ Panorama,
+ SettingsApplications,
+ Settings as SettingsIcon,
+ TableRowsOutlined,
+ ViewColumnOutlined,
+} from "@mui/icons-material";
+
+import { useAtom } from "jotai";
+
+import { preferredViewLayoutAtom } from "../atoms/baseAtoms";
+import type { DataProviderManager } from "@modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager";
+import { GroupDelegateTopic, type GroupDelegate } from "@modules/_shared/DataProviderFramework/delegates/GroupDelegate";
+import { GroupRegistry } from "@modules/_shared/DataProviderFramework/groups/GroupRegistry";
+import { DeltaSurface } from "@modules/_shared/DataProviderFramework/framework/DeltaSurface/DeltaSurface";
+import { SettingsGroup } from "@modules/_shared/DataProviderFramework/framework/SettingsGroup/SettingsGroup";
+import { SharedSetting } from "@modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSetting";
+import { Setting } from "@modules/_shared/DataProviderFramework/settings/settingsDefinitions";
+import { DataProviderRegistry } from "@modules/_shared/DataProviderFramework/dataProviders/DataProviderRegistry";
+import { DataProviderType } from "@modules/_shared/DataProviderFramework/dataProviders/dataProviderTypes";
+import {
+ instanceofItemGroup,
+ type Item,
+ type ItemGroup,
+} from "@modules/_shared/DataProviderFramework/interfacesAndTypes/entities";
+import { DataProvider } from "@modules/_shared/DataProviderFramework/framework/DataProvider/DataProvider";
+import { RealizationSurfaceProvider } from "@modules/2DViewer/DataProviderFramework/customDataProviderImplementations/RealizationSurfaceProvider";
+import { StatisticalSurfaceProvider } from "@modules/2DViewer/DataProviderFramework/customDataProviderImplementations/StatisticalSurfaceProvider";
+import { ObservedSurfaceProvider } from "@modules/2DViewer/DataProviderFramework/customDataProviderImplementations/ObservedSurfaceProvider";
+import { Group } from "@modules/_shared/DataProviderFramework/framework/Group/Group";
+import { DataProviderManagerComponent } from "@modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManagerComponent";
+import type { ActionGroup } from "@modules/_shared/DataProviderFramework/Actions";
+
+export type LayerManagerComponentWrapperProps = {
+ layerManager: DataProviderManager;
+ workbenchSession: WorkbenchSession;
+ workbenchSettings: WorkbenchSettings;
+};
+
+export function LayerManagerComponentWrapper(props: LayerManagerComponentWrapperProps): React.ReactNode {
+ const colorSet = props.workbenchSettings.useColorSet();
+ const [preferredViewLayout, setPreferredViewLayout] = useAtom(preferredViewLayoutAtom);
+
+ const groupDelegate = props.layerManager.getGroupDelegate();
+ usePublishSubscribeTopicValue(groupDelegate, GroupDelegateTopic.CHILDREN);
+
+ function handleLayerAction(identifier: string, groupDelegate: GroupDelegate) {
+ switch (identifier) {
+ case "view":
+ groupDelegate.appendChild(
+ GroupRegistry.makeGroup(GroupType.VIEW, props.layerManager, colorSet.getNextColor()),
+ );
+ return;
+ case "delta-surface":
+ groupDelegate.appendChild(new DeltaSurface("Delta surface", props.layerManager));
+ return;
+ case "settings-group":
+ groupDelegate.appendChild(new SettingsGroup("Settings group", props.layerManager));
+ return;
+ case "color-scale":
+ groupDelegate.appendChild(new SharedSetting(Setting.COLOR_SCALE, null, props.layerManager));
+ return;
+ case "statistical-surface":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(DataProviderType.STATISTICAL_SURFACE_3D, props.layerManager),
+ );
+ return;
+ case "realization-surface":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(DataProviderType.REALIZATION_SURFACE_3D, props.layerManager),
+ );
+ return;
+ case "realization-polygons":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(DataProviderType.REALIZATION_POLYGONS, props.layerManager),
+ );
+ return;
+ case "drilled-wellbore-trajectories":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(
+ DataProviderType.DRILLED_WELL_TRAJECTORIES,
+ props.layerManager,
+ ),
+ );
+ return;
+ case "drilled-wellbore-picks":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(DataProviderType.DRILLED_WELLBORE_PICKS, props.layerManager),
+ );
+ return;
+ case "intersection-realization-grid":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(
+ DataProviderType.INTERSECTION_REALIZATION_GRID,
+ props.layerManager,
+ ),
+ );
+ return;
+ case "realization-grid":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(DataProviderType.REALIZATION_GRID, props.layerManager),
+ );
+ return;
+ case "realization-seismic-inline":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(
+ DataProviderType.REALIZATION_SEISMIC_INLINE,
+ props.layerManager,
+ ),
+ );
+ return;
+ case "realization-seismic-crossline":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(
+ DataProviderType.REALIZATION_SEISMIC_CROSSLINE,
+ props.layerManager,
+ ),
+ );
+ return;
+ case "realization-seismic-depth-slice":
+ groupDelegate.prependChild(
+ DataProviderRegistry.makeDataProvider(
+ DataProviderType.REALIZATION_SEISMIC_DEPTH_SLICE,
+ props.layerManager,
+ ),
+ );
+ return;
+ case "ensemble":
+ groupDelegate.appendChild(new SharedSetting(Setting.ENSEMBLE, null, props.layerManager));
+ return;
+ case "realization":
+ groupDelegate.appendChild(new SharedSetting(Setting.REALIZATION, null, props.layerManager));
+ return;
+ case "surface-name":
+ groupDelegate.appendChild(new SharedSetting(Setting.SURFACE_NAME, null, props.layerManager));
+ return;
+ case "attribute":
+ groupDelegate.appendChild(new SharedSetting(Setting.ATTRIBUTE, null, props.layerManager));
+ return;
+ case "Date":
+ groupDelegate.appendChild(new SharedSetting(Setting.TIME_OR_INTERVAL, null, props.layerManager));
+ return;
+ }
+ }
+
+ function checkIfItemMoveAllowed(movedItem: Item, destinationItem: ItemGroup): boolean {
+ if (destinationItem instanceof DeltaSurface) {
+ if (
+ movedItem instanceof DataProvider &&
+ !(
+ movedItem instanceof RealizationSurfaceProvider ||
+ movedItem instanceof StatisticalSurfaceProvider ||
+ movedItem instanceof ObservedSurfaceProvider
+ )
+ ) {
+ return false;
+ }
+
+ if (instanceofItemGroup(movedItem)) {
+ return false;
+ }
+
+ if (destinationItem.getGroupDelegate().findChildren((item) => item instanceof DataProvider).length >= 2) {
+ return false;
+ }
+ }
+
+ return true;
+ }
+
+ function makeActionsForGroup(group: ItemGroup): ActionGroup[] {
+ const hasView =
+ groupDelegate.getDescendantItems((item) => item instanceof Group && item.getGroupType() === GroupType.VIEW)
+ .length > 0;
+
+ const hasViewAncestor =
+ group
+ .getGroupDelegate()
+ .getAncestors((item) => item instanceof Group && item.getGroupType() === GroupType.VIEW).length > 0;
+ const actions: ActionGroup[] = [];
+
+ if (!hasView) {
+ return INITIAL_ACTIONS;
+ }
+
+ const groupActions: ActionGroup = {
+ label: "Groups",
+ children: [],
+ };
+
+ if (!hasViewAncestor) {
+ groupActions.children.push({
+ identifier: "view",
+ icon: ,
+ label: "View",
+ });
+ }
+
+ groupActions.children.push({
+ identifier: "settings-group",
+ icon: ,
+ label: "Settings group",
+ });
+
+ actions.push(groupActions);
+ actions.push(...ACTIONS);
+
+ return actions;
+ }
+
+ return (
+
+
+
+
+
+
+ }
+ groupActions={makeActionsForGroup}
+ onAction={handleLayerAction}
+ isMoveAllowed={checkIfItemMoveAllowed}
+ />
+ );
+}
+
+type ViewLayoutMenuItemProps = {
+ checked: boolean;
+ onClick: () => void;
+ children: React.ReactNode;
+};
+
+function ViewLayoutMenuItem(props: ViewLayoutMenuItemProps): React.ReactNode {
+ return (
+
+ );
+}
+
+const INITIAL_ACTIONS: ActionGroup[] = [
+ {
+ label: "Groups",
+ children: [
+ {
+ identifier: "view",
+ icon: ,
+ label: "View",
+ },
+ {
+ identifier: "settings-group",
+ icon: ,
+ label: "Settings group",
+ },
+ ],
+ },
+];
+
+const ACTIONS: ActionGroup[] = [
+ {
+ label: "Layers",
+ children: [
+ {
+ label: "Wells",
+ children: [
+ {
+ identifier: "drilled-wellbore-trajectories",
+ icon: ,
+ label: "Drilled Wellbore Trajectories",
+ },
+ {
+ identifier: "drilled-wellbore-picks",
+ icon: ,
+ label: "Drilled Wellbore Picks",
+ },
+ ],
+ },
+ {
+ label: "Intersection",
+ children: [
+ {
+ identifier: "intersection-realization-grid",
+ icon: ,
+ label: "Intersection Realization Grid",
+ },
+ ],
+ },
+ {
+ label: "Reservoir grid",
+ children: [
+ {
+ identifier: "realization-grid",
+ icon: ,
+ label: "Realization Grid",
+ },
+ ],
+ },
+ {
+ label: "Surface",
+ children: [
+ {
+ identifier: "statistical-surface",
+ icon: ,
+ label: "Statistical Surface",
+ },
+ {
+ identifier: "realization-surface",
+ icon: ,
+ label: "Realization Surface",
+ },
+ ],
+ },
+ {
+ label: "Polygons",
+ children: [
+ {
+ identifier: "realization-polygons",
+ icon: ,
+ label: "Realization Polygons",
+ },
+ ],
+ },
+ {
+ label: "Seismic",
+ children: [
+ {
+ label: "Synthetic",
+ children: [
+ {
+ identifier: "realization-seismic-inline",
+ icon: ,
+ label: "Realization Inline",
+ },
+ {
+ identifier: "realization-seismic-crossline",
+ icon: ,
+ label: "Realization Crossline",
+ },
+ {
+ identifier: "realization-seismic-depth-slice",
+ icon: ,
+ label: "Realization Depth Slice",
+ },
+ ],
+ },
+ ],
+ },
+ ],
+ },
+ {
+ label: "Shared Settings",
+ children: [
+ {
+ identifier: "ensemble",
+ icon: ,
+ label: "Ensemble",
+ },
+ {
+ identifier: "realization",
+ icon: ,
+ label: "Realization",
+ },
+ {
+ identifier: "attribute",
+ icon: ,
+ label: "Attribute",
+ },
+ {
+ identifier: "Date",
+ icon: ,
+ label: "Date",
+ },
+ ],
+ },
+ {
+ label: "Utilities",
+ children: [
+ {
+ identifier: "color-scale",
+ icon: ,
+ label: "Color scale",
+ },
+ ],
+ },
+];
diff --git a/frontend/src/modules/3DViewerNew/settings/queries/queryDataTransforms.ts b/frontend/src/modules/3DViewerNew/settings/queries/queryDataTransforms.ts
new file mode 100644
index 000000000..6dc734f2a
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/settings/queries/queryDataTransforms.ts
@@ -0,0 +1,20 @@
+import { SeismicSliceData_api } from "@api";
+import { b64DecodeFloatArrayToFloat32 } from "@modules/_shared/base64";
+
+export type SeismicSliceData_trans = Omit & {
+ dataFloat32Arr: Float32Array;
+};
+
+export function transformSeismicSlice(apiData: SeismicSliceData_api): SeismicSliceData_trans {
+ const startTS = performance.now();
+
+ const { slice_traces_b64arr, ...untransformedData } = apiData;
+ const dataFloat32Arr = b64DecodeFloatArrayToFloat32(slice_traces_b64arr);
+
+ console.debug(`transformSeismicSlice() took: ${(performance.now() - startTS).toFixed(1)}ms`);
+
+ return {
+ ...untransformedData,
+ dataFloat32Arr: dataFloat32Arr,
+ };
+}
diff --git a/frontend/src/modules/3DViewerNew/settings/settings.tsx b/frontend/src/modules/3DViewerNew/settings/settings.tsx
new file mode 100644
index 000000000..480497e8f
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/settings/settings.tsx
@@ -0,0 +1,152 @@
+import React from "react";
+
+import { ModuleSettingsProps } from "@framework/Module";
+import { useEnsembleSet } from "@framework/WorkbenchSession";
+import { FieldDropdown } from "@framework/components/FieldDropdown";
+import { CollapsibleGroup } from "@lib/components/CollapsibleGroup";
+import { useQueryClient } from "@tanstack/react-query";
+
+import { useAtom, useAtomValue, useSetAtom } from "jotai";
+
+import { providerManagerAtom, preferredViewLayoutAtom, userSelectedFieldIdentifierAtom } from "./atoms/baseAtoms";
+import { selectedFieldIdentifierAtom } from "./atoms/derivedAtoms";
+import { LayerManagerComponentWrapper } from "./components/dataProviderManagerComponentWrapper";
+import {
+ DataProviderManager,
+ DataProviderManagerTopic,
+} from "@modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager";
+import { GroupDelegateTopic } from "@modules/_shared/DataProviderFramework/delegates/GroupDelegate";
+
+export function Settings(props: ModuleSettingsProps): React.ReactNode {
+ const ensembleSet = useEnsembleSet(props.workbenchSession);
+ const queryClient = useQueryClient();
+
+ const [layerManager, setLayerManager] = useAtom(providerManagerAtom);
+
+ const fieldIdentifier = useAtomValue(selectedFieldIdentifierAtom);
+ const setFieldIdentifier = useSetAtom(userSelectedFieldIdentifierAtom);
+ const [preferredViewLayout, setPreferredViewLayout] = useAtom(preferredViewLayoutAtom);
+
+ const persistState = React.useCallback(
+ function persistLayerManagerState() {
+ if (!layerManager) {
+ return;
+ }
+
+ const serializedState = {
+ layerManager: layerManager.serializeState(),
+ fieldIdentifier,
+ preferredViewLayout,
+ };
+ window.localStorage.setItem(
+ `${props.settingsContext.getInstanceIdString()}-settings`,
+ JSON.stringify(serializedState),
+ );
+ },
+ [layerManager, fieldIdentifier, preferredViewLayout, props.settingsContext],
+ );
+
+ const applyPersistedState = React.useCallback(
+ function applyPersistedState(layerManager: DataProviderManager) {
+ const serializedState = window.localStorage.getItem(
+ `${props.settingsContext.getInstanceIdString()}-settings`,
+ );
+ if (!serializedState) {
+ return;
+ }
+
+ const parsedState = JSON.parse(serializedState);
+ if (parsedState.fieldIdentifier) {
+ setFieldIdentifier(parsedState.fieldIdentifier);
+ }
+ if (parsedState.preferredViewLayout) {
+ setPreferredViewLayout(parsedState.preferredViewLayout);
+ }
+
+ if (parsedState.layerManager) {
+ if (!layerManager) {
+ return;
+ }
+ layerManager.deserializeState(parsedState.layerManager);
+ }
+ },
+ [setFieldIdentifier, setPreferredViewLayout, props.settingsContext],
+ );
+
+ React.useEffect(
+ function onMountEffect() {
+ const newLayerManager = new DataProviderManager(
+ props.workbenchSession,
+ props.workbenchSettings,
+ queryClient,
+ );
+ setLayerManager(newLayerManager);
+
+ applyPersistedState(newLayerManager);
+
+ return function onUnmountEffect() {
+ newLayerManager.beforeDestroy();
+ };
+ },
+ [setLayerManager, props.workbenchSession, props.workbenchSettings, queryClient, applyPersistedState],
+ );
+
+ React.useEffect(
+ function onLayerManagerChangeEffect() {
+ if (!layerManager) {
+ return;
+ }
+
+ persistState();
+
+ const unsubscribeDataRev = layerManager
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(DataProviderManagerTopic.DATA_REVISION)(persistState);
+
+ const unsubscribeExpands = layerManager
+ .getGroupDelegate()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(GroupDelegateTopic.CHILDREN_EXPANSION_STATES)(persistState);
+
+ return function onUnmountEffect() {
+ layerManager.beforeDestroy();
+ unsubscribeDataRev();
+ unsubscribeExpands();
+ };
+ },
+ [layerManager, props.workbenchSession, props.workbenchSettings, persistState],
+ );
+
+ React.useEffect(
+ function onFieldIdentifierChangedEffect() {
+ if (!layerManager) {
+ return;
+ }
+ layerManager.updateGlobalSetting("fieldId", fieldIdentifier);
+ },
+ [fieldIdentifier, layerManager],
+ );
+
+ function handleFieldChange(fieldId: string | null) {
+ setFieldIdentifier(fieldId);
+ if (!layerManager) {
+ return;
+ }
+ layerManager.updateGlobalSetting("fieldId", fieldId);
+ }
+
+ return (
+
+
+
+
+ {layerManager && (
+
+ )}
+
+ );
+}
diff --git a/frontend/src/modules/3DViewerNew/types.ts b/frontend/src/modules/3DViewerNew/types.ts
new file mode 100644
index 000000000..a457c6616
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/types.ts
@@ -0,0 +1,4 @@
+export enum PreferredViewLayout {
+ HORIZONTAL = "horizontal",
+ VERTICAL = "vertical",
+}
diff --git a/frontend/src/modules/3DViewerNew/view/components/ContextMenu.tsx b/frontend/src/modules/3DViewerNew/view/components/ContextMenu.tsx
new file mode 100644
index 000000000..2eea7315f
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/view/components/ContextMenu.tsx
@@ -0,0 +1,63 @@
+import React from "react";
+
+import { usePublishSubscribeTopicValue } from "@modules/_shared/utils/PublishSubscribeDelegate";
+
+import { isEqual } from "lodash";
+
+import {
+ ContextMenu as ContextMenuType,
+ DeckGlInstanceManager,
+ DeckGlInstanceManagerTopic,
+} from "../utils/DeckGlInstanceManager";
+
+export type ContextMenuProps = {
+ deckGlManager: DeckGlInstanceManager;
+};
+
+export function ContextMenu(props: ContextMenuProps): React.ReactNode {
+ const [visible, setVisible] = React.useState(false);
+ const [prevContextMenu, setPrevContextMenu] = React.useState(null);
+ const contextMenu = usePublishSubscribeTopicValue(props.deckGlManager, DeckGlInstanceManagerTopic.CONTEXT_MENU);
+
+ React.useEffect(function handleMount() {
+ function hideContextMenu() {
+ setVisible(false);
+ }
+
+ window.addEventListener("blur", hideContextMenu);
+
+ return function handleUnmount() {
+ window.removeEventListener("blur", hideContextMenu);
+ };
+ }, []);
+
+ if (!isEqual(prevContextMenu, contextMenu)) {
+ setPrevContextMenu(contextMenu);
+ setVisible(true);
+ }
+
+ if (!contextMenu || !visible || !contextMenu.items.length) {
+ return null;
+ }
+
+ return (
+
+ {contextMenu.items.map((item, index) => (
+
{
+ item.onClick();
+ setVisible(false);
+ }}
+ >
+ {item.icon ? React.cloneElement(item.icon, { fontSize: "small" }) : null}
+ {item.label}
+
+ ))}
+
+
+ ({
+ ...viewport,
+ layerIds: [...(viewport.layerIds ?? []), ...globalLayerIds],
+ })),
+ showLabel: false,
+ }}
+ viewportAnnotations={viewportAnnotations}
+ layers={deckGlLayers}
+ workbenchSession={props.workbenchSession}
+ workbenchSettings={props.workbenchSettings}
+ />
+
+
+ Please add views and layers in the settings panel.
+
+ )}
+
+ );
+}
diff --git a/frontend/src/modules/3DViewerNew/view/components/Toolbar.tsx b/frontend/src/modules/3DViewerNew/view/components/Toolbar.tsx
new file mode 100644
index 000000000..1b0278b7b
--- /dev/null
+++ b/frontend/src/modules/3DViewerNew/view/components/Toolbar.tsx
@@ -0,0 +1,185 @@
+import React from "react";
+
+import { Button } from "@lib/components/Button";
+import { HoldPressedIntervalCallbackButton } from "@lib/components/HoldPressedIntervalCallbackButton/holdPressedIntervalCallbackButton";
+import { Input } from "@lib/components/Input";
+import { ToggleButton } from "@lib/components/ToggleButton";
+import { AddPathPointIcon, DrawPathIcon, RemovePathPointIcon } from "@lib/icons/";
+import { resolveClassNames } from "@lib/utils/resolveClassNames";
+import { Toolbar as GenericToolbar, ToolBarDivider } from "@modules/_shared/components/Toolbar";
+import { usePublishSubscribeTopicValue } from "@modules/_shared/utils/PublishSubscribeDelegate";
+import {
+ Add,
+ FilterCenterFocus,
+ GridOff,
+ GridOn,
+ KeyboardDoubleArrowLeft,
+ KeyboardDoubleArrowRight,
+ Polyline,
+ Remove,
+} from "@mui/icons-material";
+
+import { PolylineEditingMode } from "../hooks/editablePolylines/types";
+import { PolylinesPlugin, PolylinesPluginTopic } from "../utils/PolylinesPlugin";
+
+export type ToolbarProps = {
+ verticalScale: number;
+ hasActivePolyline: boolean;
+ activePolylineName?: string;
+ onFitInView: () => void;
+ polylinesPlugin: PolylinesPlugin;
+ onGridVisibilityChange: (visible: boolean) => void;
+ onVerticalScaleChange(value: number): void;
+ onPolylineNameChange(name: string): void;
+};
+
+export function Toolbar(props: ToolbarProps): React.ReactNode {
+ const [expanded, setExpanded] = React.useState(false);
+ const [gridVisible, setGridVisible] = React.useState(false);
+ const [polylineName, setPolylineName] = React.useState(null);
+ const [prevEditingPolylineId, setPrevEditingPolylineId] = React.useState(null);
+ const polylineEditingMode = usePublishSubscribeTopicValue(props.polylinesPlugin, PolylinesPluginTopic.EDITING_MODE);
+ const editingPolylineId = usePublishSubscribeTopicValue(
+ props.polylinesPlugin,
+ PolylinesPluginTopic.EDITING_POLYLINE_ID
+ );
+
+ if (editingPolylineId !== prevEditingPolylineId) {
+ setPrevEditingPolylineId(editingPolylineId);
+ const activePolyline = props.polylinesPlugin.getActivePolyline();
+ if (activePolyline) {
+ setPolylineName(activePolyline.name);
+ }
+ }
+
+ function handleFitInViewClick() {
+ props.onFitInView();
+ }
+
+ function handleGridToggle() {
+ props.onGridVisibilityChange(!gridVisible);
+ setGridVisible(!gridVisible);
+ }
+
+ function handleVerticalScaleIncrease() {
+ props.onVerticalScaleChange(props.verticalScale + 0.1);
+ }
+
+ function handleVerticalScaleDecrease() {
+ props.onVerticalScaleChange(props.verticalScale - 0.1);
+ }
+
+ function handleTogglePolylineEditing() {
+ if (polylineEditingMode !== PolylineEditingMode.NONE) {
+ props.polylinesPlugin.setEditingMode(PolylineEditingMode.NONE);
+ return;
+ }
+ props.polylinesPlugin.setEditingMode(PolylineEditingMode.IDLE);
+ }
+
+ function handlePolylineEditingModeChange(mode: PolylineEditingMode) {
+ props.polylinesPlugin.setEditingMode(mode);
+ }
+
+ function handlePolylineNameChange(event: React.ChangeEvent) {
+ props.polylinesPlugin.setActivePolylineName(event.target.value);
+ }
+
+ return (
+
+
+
+
+
+
+ {gridVisible ? : }
+
+
+
+
+
+
+
+
+
+
+ {props.verticalScale.toFixed(2)}
+
+
+
+
+
+
+
+
+ {polylineEditingMode !== PolylineEditingMode.NONE && expanded && (
+ <>
+
+
+ handlePolylineEditingModeChange(
+ active ? PolylineEditingMode.DRAW : PolylineEditingMode.IDLE
+ )
+ }
+ >
+
+
+
+ handlePolylineEditingModeChange(
+ active ? PolylineEditingMode.ADD_POINT : PolylineEditingMode.IDLE
+ )
+ }
+ >
+
+
+
+ handlePolylineEditingModeChange(
+ active ? PolylineEditingMode.REMOVE_POINT : PolylineEditingMode.IDLE
+ )
+ }
+ >
+
+
+
+
+
+ )}
+
+
);
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager.ts b/frontend/src/modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager.ts
index 60e46f7f8..3ac86855d 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager.ts
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/DataProviderManager/DataProviderManager.ts
@@ -12,7 +12,6 @@ import {
import type { WorkbenchSettings } from "@framework/WorkbenchSettings";
import { ColorPaletteType } from "@framework/WorkbenchSettings";
-
import type { PublishSubscribe } from "../../../utils/PublishSubscribeDelegate";
import { PublishSubscribeDelegate } from "../../../utils/PublishSubscribeDelegate";
import { GroupDelegate, GroupDelegateTopic } from "../../delegates/GroupDelegate";
@@ -24,26 +23,22 @@ import { type SerializedDataProviderManager, SerializedType } from "../../interf
export enum DataProviderManagerTopic {
ITEMS = "ITEMS",
SETTINGS_CHANGED = "SETTINGS_CHANGED",
- AVAILABLE_SETTINGS_CHANGED = "AVAILABLE_SETTINGS_CHANGED",
DATA_REVISION = "DATA_REVISION",
GLOBAL_SETTINGS = "GLOBAL_SETTINGS",
- SHARED_SETTINGS_CHANGED = "SHARED_SETTINGS_CHANGED",
}
export type DataProviderManagerTopicPayload = {
[DataProviderManagerTopic.ITEMS]: Item[];
[DataProviderManagerTopic.SETTINGS_CHANGED]: void;
- [DataProviderManagerTopic.AVAILABLE_SETTINGS_CHANGED]: void;
[DataProviderManagerTopic.DATA_REVISION]: number;
[DataProviderManagerTopic.GLOBAL_SETTINGS]: GlobalSettings;
- [DataProviderManagerTopic.SHARED_SETTINGS_CHANGED]: void;
};
export type GlobalSettings = {
fieldId: string | null;
ensembles: readonly RegularEnsemble[];
realizationFilterFunction: EnsembleRealizationFilterFunction;
- intersectionPolylines: IntersectionPolyline[];
+ intersectionPolylines: readonly IntersectionPolyline[];
};
/*
@@ -164,18 +159,12 @@ export class DataProviderManager implements ItemGroup, PublishSubscribe
{
+ .makeSubscriberFunction(SettingsContextDelegateTopic.SETTINGS_AND_STORED_DATA_CHANGED)(() => {
this.handleSettingsChange();
}),
);
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/ExternalSettingController/ExternalSettingController.ts b/frontend/src/modules/_shared/DataProviderFramework/framework/ExternalSettingController/ExternalSettingController.ts
new file mode 100644
index 000000000..afc2e342b
--- /dev/null
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/ExternalSettingController/ExternalSettingController.ts
@@ -0,0 +1,162 @@
+import { UnsubscribeHandlerDelegate } from "../../delegates/UnsubscribeHandlerDelegate";
+import type { Item } from "../../interfacesAndTypes/entities";
+import type { AvailableValuesType } from "../../interfacesAndTypes/utils";
+import {
+ type Setting,
+ type SettingCategories,
+ type SettingTypes,
+ settingCategoryAvailableValuesIntersectionReducerMap,
+} from "../../settings/settingsDefinitions";
+import { DataProvider } from "../DataProvider/DataProvider";
+import { DataProviderManagerTopic } from "../DataProviderManager/DataProviderManager";
+import { Group } from "../Group/Group";
+import type { SettingManager } from "../SettingManager/SettingManager";
+
+export class ExternalSettingController<
+ TSetting extends Setting,
+ TValue extends SettingTypes[TSetting] | null = SettingTypes[TSetting] | null,
+ TCategory extends SettingCategories[TSetting] = SettingCategories[TSetting],
+> {
+ private _parentItem: Item;
+ private _setting: SettingManager;
+ private _controlledSettings: Map> = new Map();
+ private _availableValuesMap: Map> = new Map();
+ private _unsubscribeHandler: UnsubscribeHandlerDelegate = new UnsubscribeHandlerDelegate();
+
+ constructor(parentItem: Item, setting: SettingManager) {
+ this._parentItem = parentItem;
+ this._setting = setting;
+
+ const dataProviderManager = parentItem.getItemDelegate().getDataProviderManager();
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "data-provider-manager",
+ dataProviderManager.getPublishSubscribeDelegate().makeSubscriberFunction(DataProviderManagerTopic.ITEMS)(
+ () => {
+ this.updateControlledSettings();
+ },
+ ),
+ );
+ }
+
+ beforeDestroy(): void {
+ this._unsubscribeHandler.unsubscribeAll();
+ this.unregisterAllControlledSettings();
+ }
+
+ getParentItem(): Item {
+ return this._parentItem;
+ }
+
+ registerSetting(settingManager: SettingManager): void {
+ this._controlledSettings.set(settingManager.getId(), settingManager);
+ settingManager.registerExternalSettingController(this);
+ }
+
+ getSetting(): SettingManager {
+ return this._setting;
+ }
+
+ private updateControlledSettings(): void {
+ const oldControlledSettings = new Map(this._controlledSettings);
+ this._controlledSettings.clear();
+ this._availableValuesMap.clear();
+
+ let parentGroup = this._parentItem.getItemDelegate().getParentGroup();
+ if (this._parentItem instanceof Group) {
+ parentGroup = this._parentItem.getGroupDelegate();
+ }
+
+ if (!parentGroup) {
+ return;
+ }
+
+ const providers = parentGroup.getDescendantItems((item) => item instanceof DataProvider) as DataProvider<
+ any,
+ any
+ >[];
+
+ for (const provider of providers) {
+ const setting = provider.getSettingsContextDelegate().getSettings()[this._setting.getType()];
+ if (setting) {
+ this._controlledSettings.set(setting.getId(), setting);
+ this._availableValuesMap.set(setting.getId(), setting.getAvailableValues());
+ setting.registerExternalSettingController(this);
+ }
+ }
+
+ for (const settingId of oldControlledSettings.keys()) {
+ if (!this._controlledSettings.has(settingId)) {
+ const setting = oldControlledSettings.get(settingId);
+ if (setting) {
+ setting.unregisterExternalSettingController();
+ }
+ }
+ }
+
+ if (this._controlledSettings.size === 0) {
+ this._setting.setAvailableValues(null);
+ return;
+ }
+
+ this.makeIntersectionOfAvailableValues();
+ }
+
+ unregisterAllControlledSettings(): void {
+ for (const setting of this._controlledSettings.values()) {
+ setting.unregisterExternalSettingController();
+ }
+ this._controlledSettings.clear();
+ this._availableValuesMap.clear();
+ }
+
+ setAvailableValues(settingId: string, availableValues: AvailableValuesType | null): void {
+ if (availableValues) {
+ this._availableValuesMap.set(settingId, availableValues);
+ } else {
+ this._availableValuesMap.delete(settingId);
+ }
+
+ this.makeIntersectionOfAvailableValues();
+ }
+
+ makeIntersectionOfAvailableValues(): void {
+ for (const setting of this._controlledSettings.values()) {
+ if (!setting.isInitialized(true)) {
+ return;
+ }
+ }
+
+ const category = this._setting.getCategory();
+ const reducerDefinition = settingCategoryAvailableValuesIntersectionReducerMap[category];
+
+ if (this._setting.isStatic()) {
+ this._setting.maybeResetPersistedValue();
+ return;
+ }
+
+ if (!reducerDefinition) {
+ return;
+ }
+
+ const { reducer, startingValue, isValid } = reducerDefinition;
+ let availableValues: AvailableValuesType = startingValue as AvailableValuesType;
+ let index = 0;
+ let isInvalid = false;
+
+ for (const value of this._availableValuesMap.values()) {
+ if (value === null) {
+ isInvalid = true;
+ break;
+ }
+ availableValues = reducer(availableValues as any, value as any, index++) as AvailableValuesType;
+ }
+
+ if (!isValid(availableValues as any) || isInvalid) {
+ this._setting.setAvailableValues(null);
+ this._setting.setValue(null as any);
+ return;
+ }
+
+ this._setting.setAvailableValues(availableValues);
+ }
+}
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/Group/Group.ts b/frontend/src/modules/_shared/DataProviderFramework/framework/Group/Group.ts
index 480ba9d0a..e872e97c9 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/Group/Group.ts
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/Group/Group.ts
@@ -9,6 +9,7 @@ import type {
CustomGroupImplementationWithSettings,
} from "../../interfacesAndTypes/customGroupImplementation";
import { includesSettings } from "../../interfacesAndTypes/customGroupImplementation";
+import type { DefineBasicDependenciesArgs } from "../../interfacesAndTypes/customSettingsHandler";
import type { ItemGroup } from "../../interfacesAndTypes/entities";
import type { SerializedGroup } from "../../interfacesAndTypes/serialization";
import { SerializedType } from "../../interfacesAndTypes/serialization";
@@ -57,7 +58,7 @@ export class Group<
private _type: GroupType;
private _icon: React.ReactNode | null = null;
private _emptyContentMessage: string | null = null;
- private _sharedSettingsDelegate: SharedSettingsDelegate | null = null;
+ private _sharedSettingsDelegate: SharedSettingsDelegate | null = null;
constructor(params: GroupParams) {
const { dataProviderManager, customGroupImplementation, type } = params;
@@ -65,12 +66,15 @@ export class Group<
this._groupDelegate.setColor(dataProviderManager.makeGroupColor());
this._itemDelegate = new ItemDelegate(customGroupImplementation.getDefaultName(), 1, dataProviderManager);
if (includesSettings(customGroupImplementation)) {
- this._sharedSettingsDelegate = new SharedSettingsDelegate(
+ this._sharedSettingsDelegate = new SharedSettingsDelegate(
this,
makeSettings(
customGroupImplementation.settings as unknown as TSettings,
- customGroupImplementation.getDefaultSettingsValues() as unknown as TSettingTypes,
+ customGroupImplementation.getDefaultSettingsValues?.() ?? {},
),
+ customGroupImplementation.defineDependencies as unknown as
+ | ((args: DefineBasicDependenciesArgs) => void)
+ | undefined,
);
}
this._type = type;
@@ -95,11 +99,11 @@ export class Group<
return this._emptyContentMessage;
}
- getSharedSettingsDelegate(): SharedSettingsDelegate | null {
+ getSharedSettingsDelegate(): SharedSettingsDelegate | null {
return this._sharedSettingsDelegate;
}
- getWrappedSettings(): { [K in TSettingKey]: SettingManager } {
+ getWrappedSettings(): { [K in TSettingKey]: SettingManager } {
if (!this._sharedSettingsDelegate) {
throw new Error("Group does not have shared settings.");
}
@@ -125,4 +129,9 @@ export class Group<
this._groupDelegate.setColor(serialized.color);
this._groupDelegate.deserializeChildren(serialized.children);
}
+
+ beforeDestroy(): void {
+ this._groupDelegate.beforeDestroy();
+ this._sharedSettingsDelegate?.beforeDestroy();
+ }
}
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/Group/GroupComponent.tsx b/frontend/src/modules/_shared/DataProviderFramework/framework/Group/GroupComponent.tsx
index a90ca492f..ac294c1d2 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/Group/GroupComponent.tsx
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/Group/GroupComponent.tsx
@@ -3,7 +3,6 @@ import React from "react";
import { ColorSelect } from "@lib/components/ColorSelect";
import { SortableListGroup } from "@lib/components/SortableList";
-
import { usePublishSubscribeTopicValue } from "../../../utils/PublishSubscribeDelegate";
import type { ActionGroup } from "../../Actions";
import { Actions } from "../../Actions";
@@ -11,7 +10,7 @@ import { GroupDelegateTopic } from "../../delegates/GroupDelegate";
import { ItemDelegateTopic } from "../../delegates/ItemDelegate";
import type { Item, ItemGroup } from "../../interfacesAndTypes/entities";
import type { SettingManager } from "../SettingManager/SettingManager";
-import { SettingComponent } from "../SettingManager/SettingManagerComponent";
+import { SettingManagerComponent } from "../SettingManager/SettingManagerComponent";
import { EditName } from "../utilityComponents/EditName";
import { EmptyContent } from "../utilityComponents/EmptyContent";
import { ExpandCollapseAllButton } from "../utilityComponents/ExpandCollapseAllButton";
@@ -49,7 +48,9 @@ export function GroupComponent(props: GroupComponentProps): React.ReactNode {
if (!manager) {
return null;
}
- return ;
+ return (
+
+ );
}
function makeSettings(settings: SettingManager[]): React.ReactNode[] {
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManager.ts b/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManager.ts
index c3fbbdd3a..7b00cd042 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManager.ts
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManager.ts
@@ -6,13 +6,13 @@ import type { WorkbenchSettings } from "@framework/WorkbenchSettings";
import type { PublishSubscribe } from "@modules/_shared/utils/PublishSubscribeDelegate";
import { PublishSubscribeDelegate } from "@modules/_shared/utils/PublishSubscribeDelegate";
-
+import { UnsubscribeHandlerDelegate } from "../../delegates/UnsubscribeHandlerDelegate";
import type { CustomSettingImplementation } from "../../interfacesAndTypes/customSettingImplementation";
import type { SettingAttributes } from "../../interfacesAndTypes/customSettingsHandler";
-import type { SharedSettingsProvider } from "../../interfacesAndTypes/entities";
import type { AvailableValuesType, MakeAvailableValuesTypeBasedOnCategory } from "../../interfacesAndTypes/utils";
import type { Setting, SettingCategories, SettingCategory, SettingTypes } from "../../settings/settingsDefinitions";
import { settingCategoryFixupMap, settingCategoryIsValueValidMap } from "../../settings/settingsDefinitions";
+import type { ExternalSettingController } from "../ExternalSettingController/ExternalSettingController";
import { Group } from "../Group/Group";
export enum SettingTopic {
@@ -20,8 +20,8 @@ export enum SettingTopic {
VALUE_ABOUT_TO_BE_CHANGED = "VALUE_ABOUT_TO_BE_CHANGED",
IS_VALID = "IS_VALID",
AVAILABLE_VALUES = "AVAILABLE_VALUES",
- OVERRIDDEN_VALUE = "OVERRIDDEN_VALUE",
- OVERRIDDEN_VALUE_PROVIDER = "OVERRIDDEN_VALUE_PROVIDER",
+ IS_EXTERNALLY_CONTROLLED = "IS_EXTERNALLY_CONTROLLED",
+ EXTERNAL_CONTROLLER_PROVIDER = "EXTERNAL_CONTROLLER_PROVIDER",
IS_LOADING = "IS_LOADING",
IS_INITIALIZED = "IS_INITIALIZED",
IS_PERSISTED = "IS_PERSISTED",
@@ -33,8 +33,8 @@ export type SettingTopicPayloads = {
[SettingTopic.VALUE_ABOUT_TO_BE_CHANGED]: void;
[SettingTopic.IS_VALID]: boolean;
[SettingTopic.AVAILABLE_VALUES]: MakeAvailableValuesTypeBasedOnCategory | null;
- [SettingTopic.OVERRIDDEN_VALUE]: TValue | undefined;
- [SettingTopic.OVERRIDDEN_VALUE_PROVIDER]: OverriddenValueProviderType | undefined;
+ [SettingTopic.IS_EXTERNALLY_CONTROLLED]: boolean;
+ [SettingTopic.EXTERNAL_CONTROLLER_PROVIDER]: OverriddenValueProviderType | undefined;
[SettingTopic.IS_LOADING]: boolean;
[SettingTopic.IS_INITIALIZED]: boolean;
[SettingTopic.IS_PERSISTED]: boolean;
@@ -66,7 +66,7 @@ export enum OverriddenValueProviderType {
*/
export class SettingManager<
TSetting extends Setting,
- TValue extends SettingTypes[TSetting] = SettingTypes[TSetting],
+ TValue extends SettingTypes[TSetting] | null = SettingTypes[TSetting] | null,
TCategory extends SettingCategories[TSetting] = SettingCategories[TSetting],
> implements PublishSubscribe>
{
@@ -78,9 +78,7 @@ export class SettingManager<
private _value: TValue;
private _isValueValid: boolean = false;
private _publishSubscribeDelegate = new PublishSubscribeDelegate>();
- private _availableValues: MakeAvailableValuesTypeBasedOnCategory | null = null;
- private _overriddenValue: TValue | undefined = undefined;
- private _overriddenValueProviderType: OverriddenValueProviderType | undefined = undefined;
+ private _availableValues: AvailableValuesType | null = null;
private _loading: boolean = false;
private _initialized: boolean = false;
private _currentValueFromPersistence: TValue | null = null;
@@ -89,6 +87,8 @@ export class SettingManager<
enabled: true,
visible: true,
};
+ private _externalController: ExternalSettingController | null = null;
+ private _unsubscribeHandler: UnsubscribeHandlerDelegate = new UnsubscribeHandlerDelegate();
constructor({
type,
@@ -109,6 +109,93 @@ export class SettingManager<
}
}
+ registerExternalSettingController(
+ externalController: ExternalSettingController,
+ ): void {
+ this._externalController = externalController;
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController.getSetting().getPublishSubscribeDelegate().makeSubscriberFunction(SettingTopic.VALUE)(
+ () => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.VALUE);
+ this._value = externalController.getSetting().getValue();
+ },
+ ),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController.getSetting().getPublishSubscribeDelegate().makeSubscriberFunction(SettingTopic.IS_VALID)(
+ () => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.IS_VALID);
+ },
+ ),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController
+ .getSetting()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(SettingTopic.IS_LOADING)(() => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.IS_LOADING);
+ }),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController
+ .getSetting()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(SettingTopic.ATTRIBUTES)(() => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.ATTRIBUTES);
+ }),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController
+ .getSetting()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(SettingTopic.VALUE_ABOUT_TO_BE_CHANGED)(() => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.VALUE_ABOUT_TO_BE_CHANGED);
+ }),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController
+ .getSetting()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(SettingTopic.IS_INITIALIZED)(() => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.IS_INITIALIZED);
+ }),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController
+ .getSetting()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(SettingTopic.IS_PERSISTED)(() => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.IS_PERSISTED);
+ }),
+ );
+ this._unsubscribeHandler.registerUnsubscribeFunction(
+ "external-setting-controller",
+ externalController
+ .getSetting()
+ .getPublishSubscribeDelegate()
+ .makeSubscriberFunction(SettingTopic.AVAILABLE_VALUES)(() => {
+ this._publishSubscribeDelegate.notifySubscribers(SettingTopic.AVAILABLE_VALUES);
+ }),
+ );
+ }
+
+ unregisterExternalSettingController(): void {
+ this._externalController = null;
+ this._unsubscribeHandler.unsubscribe("external-setting-controller");
+ this.applyAvailableValues();
+ }
+
+ beforeDestroy(): void {
+ this._unsubscribeHandler.unsubscribeAll();
+ }
+
getId(): string {
return this._id;
}
@@ -134,14 +221,17 @@ export class SettingManager<
return;
}
- Object.assign(this._attributes, attributes);
+ this._attributes = {
+ ...this._attributes,
+ ...attributes,
+ };
this._publishSubscribeDelegate.notifySubscribers(SettingTopic.ATTRIBUTES);
}
getValue(): TValue {
- if (this._overriddenValue !== undefined) {
- return this._overriddenValue;
+ if (this._externalController) {
+ return this._externalController.getSetting().getValue();
}
if (this._currentValueFromPersistence !== null) {
@@ -173,10 +263,16 @@ export class SettingManager<
}
isValueValid(): boolean {
+ if (this._externalController) {
+ return this._externalController.getSetting().isValueValid();
+ }
return this._isValueValid;
}
isPersistedValue(): boolean {
+ if (this._externalController) {
+ return this._externalController.getSetting().isPersistedValue();
+ }
return this._currentValueFromPersistence !== null;
}
@@ -210,6 +306,11 @@ export class SettingManager<
if (this._loading === loading) {
return;
}
+
+ if (this._externalController) {
+ this._externalController.getSetting().setLoading(loading);
+ }
+
this._loading = loading;
this._publishSubscribeDelegate.notifySubscribers(SettingTopic.IS_LOADING);
}
@@ -219,14 +320,21 @@ export class SettingManager<
return;
}
this._initialized = true;
+
this._publishSubscribeDelegate.notifySubscribers(SettingTopic.IS_INITIALIZED);
}
- isInitialized(): boolean {
+ isInitialized(itself: boolean = false): boolean {
+ if (this._externalController && !itself) {
+ return this._externalController.getSetting().isInitialized();
+ }
return this._initialized || this._isStatic;
}
isLoading(): boolean {
+ if (this._externalController) {
+ return this._externalController.getSetting().isLoading();
+ }
return this._loading;
}
@@ -235,6 +343,12 @@ export class SettingManager<
workbenchSession: WorkbenchSession,
workbenchSettings: WorkbenchSettings,
): React.ReactNode {
+ if (this._externalController) {
+ return this._externalController
+ .getSetting()
+ .valueToRepresentation(value, workbenchSession, workbenchSettings);
+ }
+
if (this._customSettingImplementation.overriddenValueRepresentation) {
return this._customSettingImplementation.overriddenValueRepresentation({
value,
@@ -258,63 +372,22 @@ export class SettingManager<
return "Value has no string representation";
}
- checkForOverrides(sharedSettingsProviders: SharedSettingsProvider[]) {
- let overriddenValue: TValue | undefined;
- let overriddenValueProviderType: OverriddenValueProviderType | undefined;
-
- for (const provider of sharedSettingsProviders) {
- if (!provider.getSharedSettingsDelegate()) {
- continue;
- }
- for (const sharedSettingKey in provider.getSharedSettingsDelegate().getWrappedSettings()) {
- const sharedSetting = provider.getSharedSettingsDelegate().getWrappedSettings()[sharedSettingKey];
- if (sharedSetting.getType() === this._type) {
- overriddenValue = sharedSetting.getValue();
- overriddenValueProviderType = OverriddenValueProviderType.SHARED_SETTING;
- if (provider instanceof Group) {
- overriddenValueProviderType = OverriddenValueProviderType.GROUP;
- }
- break;
+ makeSnapshotGetter(topic: T): () => SettingTopicPayloads[T] {
+ const externalController = this._externalController;
+ if (externalController) {
+ return (): any => {
+ if (topic === SettingTopic.IS_EXTERNALLY_CONTROLLED) {
+ return true;
}
- }
- }
-
- this.setOverriddenValue(overriddenValue);
- this._overriddenValueProviderType = overriddenValueProviderType;
- this._publishSubscribeDelegate.notifySubscribers(SettingTopic.OVERRIDDEN_VALUE_PROVIDER);
- }
-
- setOverriddenValue(overriddenValue: TValue | undefined): void {
- if (isEqual(this._overriddenValue, overriddenValue)) {
- return;
- }
-
- const prevValue = this._overriddenValue;
- this._overriddenValue = overriddenValue;
- this._publishSubscribeDelegate.notifySubscribers(SettingTopic.OVERRIDDEN_VALUE);
-
- if (overriddenValue === undefined) {
- // Keep overridden value, if invalid fix it
- if (prevValue !== undefined) {
- this._value = prevValue;
- }
- this.maybeFixupValue();
- }
-
- this.setValueValid(this.checkIfValueIsValid(this.getValue()));
-
- if (prevValue === undefined && overriddenValue !== undefined && isEqual(this._value, overriddenValue)) {
- return;
- }
-
- if (prevValue !== undefined && overriddenValue === undefined && isEqual(this._value, prevValue)) {
- return;
+ if (topic === SettingTopic.EXTERNAL_CONTROLLER_PROVIDER) {
+ return externalController.getParentItem() instanceof Group
+ ? OverriddenValueProviderType.GROUP
+ : OverriddenValueProviderType.SHARED_SETTING;
+ }
+ return externalController.getSetting().makeSnapshotGetter(topic)();
+ };
}
- this._publishSubscribeDelegate.notifySubscribers(SettingTopic.VALUE);
- }
-
- makeSnapshotGetter(topic: T): () => SettingTopicPayloads[T] {
const snapshotGetter = (): any => {
switch (topic) {
case SettingTopic.VALUE:
@@ -325,10 +398,12 @@ export class SettingManager<
return this._isValueValid;
case SettingTopic.AVAILABLE_VALUES:
return this._availableValues;
- case SettingTopic.OVERRIDDEN_VALUE:
- return this._overriddenValue;
- case SettingTopic.OVERRIDDEN_VALUE_PROVIDER:
- return this._overriddenValueProviderType;
+ case SettingTopic.IS_EXTERNALLY_CONTROLLED:
+ return this._externalController !== null;
+ case SettingTopic.EXTERNAL_CONTROLLER_PROVIDER:
+ return this._externalController?.getParentItem() instanceof Group
+ ? OverriddenValueProviderType.GROUP
+ : OverriddenValueProviderType.SHARED_SETTING;
case SettingTopic.IS_LOADING:
return this.isLoading();
case SettingTopic.IS_PERSISTED:
@@ -350,7 +425,10 @@ export class SettingManager<
}
getAvailableValues(): AvailableValuesType | null {
- return this._availableValues;
+ if (this._externalController) {
+ return this._externalController.getSetting().getAvailableValues();
+ }
+ return this._availableValues as AvailableValuesType | null;
}
maybeResetPersistedValue(): boolean {
@@ -372,7 +450,7 @@ export class SettingManager<
if (customIsValueValidFunction) {
isPersistedValueValid = customIsValueValidFunction(
this._currentValueFromPersistence,
- this._availableValues,
+ this._availableValues as any,
);
} else {
isPersistedValueValid = settingCategoryIsValueValidMap[this._category](
@@ -393,22 +471,38 @@ export class SettingManager<
return false;
}
- setAvailableValues(availableValues: MakeAvailableValuesTypeBasedOnCategory): void {
- if (isEqual(this._availableValues, availableValues) && this._initialized) {
- return;
- }
-
- this._availableValues = availableValues;
+ private applyAvailableValues() {
let valueChanged = false;
- if ((!this.checkIfValueIsValid(this.getValue()) && this.maybeFixupValue()) || this.maybeResetPersistedValue()) {
+ const valueFixedUp = !this.checkIfValueIsValid(this.getValue()) && this.maybeFixupValue();
+ const persistedValueReset = this.maybeResetPersistedValue();
+ if (valueFixedUp || persistedValueReset) {
valueChanged = true;
}
const prevIsValid = this._isValueValid;
this.setValueValid(this.checkIfValueIsValid(this.getValue()));
this.initialize();
- if (valueChanged || this._isValueValid !== prevIsValid) {
+ this.setLoading(false);
+ if (valueChanged || this._isValueValid !== prevIsValid || this._value === null) {
this._publishSubscribeDelegate.notifySubscribers(SettingTopic.VALUE);
}
+ }
+
+ setAvailableValues(availableValues: AvailableValuesType | null): void {
+ if (this._externalController) {
+ this._availableValues = availableValues;
+ this.initialize();
+ this._externalController.setAvailableValues(this.getId(), availableValues);
+ return;
+ }
+
+ if (isEqual(this._availableValues, availableValues) && this._initialized) {
+ this.setLoading(false);
+ return;
+ }
+
+ this._availableValues = availableValues;
+
+ this.applyAvailableValues();
this._publishSubscribeDelegate.notifySubscribers(SettingTopic.AVAILABLE_VALUES);
}
@@ -431,7 +525,7 @@ export class SettingManager<
let candidate: TValue;
if (this._customSettingImplementation.fixupValue) {
- candidate = this._customSettingImplementation.fixupValue(this._value, this._availableValues);
+ candidate = this._customSettingImplementation.fixupValue(this._value, this._availableValues as any);
} else {
candidate = settingCategoryFixupMap[this._category](
this._value as any,
@@ -454,7 +548,7 @@ export class SettingManager<
return false;
}
if (this._customSettingImplementation.isValueValid) {
- return this._customSettingImplementation.isValueValid(value, this._availableValues);
+ return this._customSettingImplementation.isValueValid(value, this._availableValues as any);
} else {
return settingCategoryIsValueValidMap[this._category](value as any, this._availableValues as any);
}
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManagerComponent.tsx b/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManagerComponent.tsx
index d54c14179..79abd9dea 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManagerComponent.tsx
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/SettingManager/SettingManagerComponent.tsx
@@ -5,7 +5,6 @@ import { Link, Warning } from "@mui/icons-material";
import { PendingWrapper } from "@lib/components/PendingWrapper";
import { resolveClassNames } from "@lib/utils/resolveClassNames";
-
import { usePublishSubscribeTopicValue } from "../../../utils/PublishSubscribeDelegate";
import type { SettingComponentProps as SettingComponentPropsInterface } from "../../interfacesAndTypes/customSettingImplementation";
import type { Setting, SettingCategories, SettingTypes } from "../../settings/settingsDefinitions";
@@ -24,7 +23,7 @@ export type SettingComponentProps<
sharedSetting: boolean;
};
-export function SettingComponent<
+export function SettingManagerComponent<
TSetting extends Setting,
TValue extends SettingTypes[TSetting] = SettingTypes[TSetting],
TCategory extends SettingCategories[TSetting] = SettingCategories[TSetting],
@@ -37,10 +36,10 @@ export function SettingComponent<
const isValid = usePublishSubscribeTopicValue(props.setting, SettingTopic.IS_VALID);
const isPersisted = usePublishSubscribeTopicValue(props.setting, SettingTopic.IS_PERSISTED);
const availableValues = usePublishSubscribeTopicValue(props.setting, SettingTopic.AVAILABLE_VALUES);
- const overriddenValue = usePublishSubscribeTopicValue(props.setting, SettingTopic.OVERRIDDEN_VALUE);
- const overriddenValueProvider = usePublishSubscribeTopicValue(
+ const isExternallyControlled = usePublishSubscribeTopicValue(props.setting, SettingTopic.IS_EXTERNALLY_CONTROLLED);
+ const externalControllerProvider = usePublishSubscribeTopicValue(
props.setting,
- SettingTopic.OVERRIDDEN_VALUE_PROVIDER,
+ SettingTopic.EXTERNAL_CONTROLLER_PROVIDER,
);
const isLoading = usePublishSubscribeTopicValue(props.setting, SettingTopic.IS_LOADING);
const isInitialized = usePublishSubscribeTopicValue(props.setting, SettingTopic.IS_INITIALIZED);
@@ -59,7 +58,7 @@ export function SettingComponent<
return null;
}
- if (props.sharedSetting && isInitialized && availableValues === null) {
+ if (props.sharedSetting && isInitialized && availableValues === null && !props.setting.isStatic()) {
return (
{props.setting.getLabel()}
@@ -68,12 +67,12 @@ export function SettingComponent<
);
}
- if (overriddenValue !== undefined) {
- if (overriddenValueProvider !== OverriddenValueProviderType.SHARED_SETTING) {
+ if (isExternallyControlled) {
+ if (externalControllerProvider !== OverriddenValueProviderType.SHARED_SETTING) {
return null;
}
const valueAsString = props.setting.valueToRepresentation(
- overriddenValue,
+ value,
props.manager.getWorkbenchSession(),
props.manager.getWorkbenchSettings(),
);
@@ -109,8 +108,8 @@ export function SettingComponent<
onValueChange={handleValueChanged}
value={value}
isValueValid={isValid}
- isOverridden={overriddenValue !== undefined}
- overriddenValue={overriddenValue ?? null}
+ isOverridden={isExternallyControlled}
+ overriddenValue={value}
availableValues={availableValues}
globalSettings={globalSettings}
workbenchSession={props.manager.getWorkbenchSession()}
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/SettingsGroup/SettingsGroup.ts b/frontend/src/modules/_shared/DataProviderFramework/framework/SettingsGroup/SettingsGroup.ts
index 3921c9443..9e1c760c8 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/SettingsGroup/SettingsGroup.ts
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/SettingsGroup/SettingsGroup.ts
@@ -53,4 +53,8 @@ export class SettingsGroup implements ItemGroup {
this._itemDelegate.deserializeState(serialized);
this._groupDelegate.deserializeChildren(serialized.children);
}
+
+ beforeDestroy?(): void {
+ this._groupDelegate.beforeDestroy();
+ }
}
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSetting.ts b/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSetting.ts
index fde3fc23a..8e28b567d 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSetting.ts
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSetting.ts
@@ -7,7 +7,7 @@ import type { SerializedSharedSetting } from "../../interfacesAndTypes/serializa
import { SerializedType } from "../../interfacesAndTypes/serialization";
import { SettingRegistry } from "../../settings/SettingRegistry";
import type { Setting, SettingTypes } from "../../settings/settingsDefinitions";
-import { type DataProviderManager, DataProviderManagerTopic } from "../DataProviderManager/DataProviderManager";
+import { type DataProviderManager } from "../DataProviderManager/DataProviderManager";
import type { SettingManager } from "../SettingManager/SettingManager";
export function isSharedSetting(obj: any): obj is SharedSetting {
@@ -51,13 +51,6 @@ export class SharedSetting implements Item, SharedSett
return this._sharedSettingsDelegate;
}
- publishValueChange(): void {
- const dataProviderManager = this._itemDelegate.getDataProviderManager();
- if (dataProviderManager) {
- dataProviderManager.publishTopic(DataProviderManagerTopic.SHARED_SETTINGS_CHANGED);
- }
- }
-
getWrappedSetting(): SettingManager {
return Object.values(this._sharedSettingsDelegate.getWrappedSettings())[0] as SettingManager;
}
@@ -77,6 +70,7 @@ export class SharedSetting implements Item, SharedSett
}
beforeDestroy(): void {
+ this._sharedSettingsDelegate.beforeDestroy();
this._sharedSettingsDelegate.unsubscribeAll();
}
}
diff --git a/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSettingComponent.tsx b/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSettingComponent.tsx
index f8817db1b..ea78a60db 100644
--- a/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSettingComponent.tsx
+++ b/frontend/src/modules/_shared/DataProviderFramework/framework/SharedSetting/SharedSettingComponent.tsx
@@ -9,7 +9,7 @@ import { resolveClassNames } from "@lib/utils/resolveClassNames";
import { usePublishSubscribeTopicValue } from "../../../utils/PublishSubscribeDelegate";
import { ItemDelegateTopic } from "../../delegates/ItemDelegate";
-import { SettingComponent } from "../SettingManager/SettingManagerComponent";
+import { SettingManagerComponent } from "../SettingManager/SettingManagerComponent";
import type { SharedSetting } from "./SharedSetting";
@@ -57,7 +57,11 @@ export function SharedSettingComponent(props: SharedSettingComponentProps): Reac
hidden: !isExpanded,
})}
>
-
+