wip

rubenthoms · Jun 5, 2024 · d65a8c3 · d65a8c3
1 parent 71c5581
commit d65a8c3
Showing 28 changed files with 565 additions and 228 deletions.
diff --git a/backend_py/primary/primary/routers/well/schemas.py b/backend_py/primary/primary/routers/well/schemas.py
@@ -22,13 +22,17 @@ class StratigraphicUnit(BaseModel):
     colorB: int
     lithologyType: int | float | str = "unknown"
 
+
 class WellboreHeader(BaseModel):
     wellbore_uuid: str
     unique_wellbore_identifier: str
     well_uuid: str
     unique_well_identifier: str
     well_easting: float
     well_northing: float
+    depth_reference_point: str
+    depth_reference_elevation: float
+
 
 class WellboreTrajectory(BaseModel):
     wellbore_uuid: str
@@ -38,6 +42,7 @@ class WellboreTrajectory(BaseModel):
     easting_arr: List[float]
     northing_arr: List[float]
 
+
 class WellborePick(BaseModel):
     """
     Wellbore pick from SMDA

diff --git a/backend_py/primary/primary/services/smda_access/queries/get_wellbore_headers.py b/backend_py/primary/primary/services/smda_access/queries/get_wellbore_headers.py
@@ -18,6 +18,8 @@ async def get_wellbore_headers(
         "unique_well_identifier",
         "well_easting",
         "well_northing",
+        "depth_reference_point",
+        "depth_reference_elevation",
     ]
     params = {
         "_projection": ",".join(projection),

diff --git a/backend_py/primary/primary/services/smda_access/types.py b/backend_py/primary/primary/services/smda_access/types.py
@@ -39,6 +39,8 @@ class WellboreHeader(BaseModel):
     unique_well_identifier: str
     well_easting: float
     well_northing: float
+    depth_reference_point: str
+    depth_reference_elevation: float
 
 
 class StratigraphicUnit(BaseModel):

diff --git a/frontend/src/api/models/WellboreHeader.ts b/frontend/src/api/models/WellboreHeader.ts
@@ -9,5 +9,7 @@ export type WellboreHeader = {
     unique_well_identifier: string;
     well_easting: number;
     well_northing: number;
+    depth_reference_point: string;
+    depth_reference_elevation: number;
 };
 
diff --git a/frontend/src/lib/components/Dropdown/dropdown.tsx b/frontend/src/lib/components/Dropdown/dropdown.tsx
@@ -3,6 +3,7 @@ import React from "react";
 import { useElementBoundingRect } from "@lib/hooks/useElementBoundingRect";
 import { createPortal } from "@lib/utils/createPortal";
 import { resolveClassNames } from "@lib/utils/resolveClassNames";
+import { convertRemToPixels } from "@lib/utils/screenUnitConversions";
 import { getTextWidthWithFont } from "@lib/utils/textSize";
 import { ArrowDropDown, ArrowDropUp, ExpandLess, ExpandMore } from "@mui/icons-material";
 
@@ -127,8 +128,10 @@ export const Dropdown = withDefaults<DropdownProps>()(defaultProps, (props) => {
         function updateDropdownRectWidth() {
             let longestOptionWidth = props.options.reduce((prev, current) => {
                 const labelWidth = getTextWidthWithFont(current.label, "Equinor", 1);
-                if (labelWidth > prev) {
-                    return labelWidth;
+                const adornmentWidth = current.adornment ? convertRemToPixels((5 + 2) / 4) : 0;
+                const totalWidth = labelWidth + adornmentWidth;
+                if (totalWidth > prev) {
+                    return totalWidth;
                 }
                 return prev;
             }, 0);
@@ -463,7 +466,11 @@ export const Dropdown = withDefaults<DropdownProps>()(defaultProps, (props) => {
                                         title={option.label}
                                     >
                                         <span className="whitespace-nowrap text-ellipsis overflow-hidden min-w-0 flex gap-2">
-                                            {option.adornment}
+                                            {option.adornment && (
+                                                <span className="max-w-5 max-h-5 overflow-hidden">
+                                                    {option.adornment}
+                                                </span>
+                                            )}
                                             {option.label}
                                         </span>
                                     </div>

diff --git a/...rc/lib/components/HoldPressedIntervalCallbackButton/holdPressedIntervalCallbackButton.tsx b/...rc/lib/components/HoldPressedIntervalCallbackButton/holdPressedIntervalCallbackButton.tsx
@@ -7,18 +7,20 @@ export type HoldPressedIntervalCallbackButtonProps = ButtonProps & {
 };
 
 export function HoldPressedIntervalCallbackButton(props: HoldPressedIntervalCallbackButtonProps): React.ReactNode {
+    const { onHoldPressedIntervalCallback, ...other } = props;
+
     const timeoutRef = React.useRef<ReturnType<typeof setTimeout> | null>(null);
     const intervalRef = React.useRef<ReturnType<typeof setInterval> | null>(null);
 
     function handleClick() {
-        props.onHoldPressedIntervalCallback();
+        onHoldPressedIntervalCallback();
     }
 
     function handlePointerDown(e: React.PointerEvent<HTMLButtonElement>) {
         timeoutRef.current = setTimeout(() => {
             e.preventDefault();
             intervalRef.current = setInterval(() => {
-                props.onHoldPressedIntervalCallback();
+                onHoldPressedIntervalCallback();
             }, 100);
         }, 300);
     }
@@ -36,7 +38,7 @@ export function HoldPressedIntervalCallbackButton(props: HoldPressedIntervalCall
 
     return (
         <Button
-            {...props}
+            {...other}
             onClick={handleClick}
             onPointerDown={handlePointerDown}
             onPointerUp={handlePointerUp}

diff --git a/frontend/src/lib/components/Input/input.tsx b/frontend/src/lib/components/Input/input.tsx
@@ -14,7 +14,7 @@ export type InputProps = InputUnstyledProps & {
 };
 
 export const Input = React.forwardRef((props: InputProps, ref: React.ForwardedRef<HTMLInputElement>) => {
-    const { startAdornment, endAdornment, wrapperStyle, value: propsValue, onChange, ...other } = props;
+    const { startAdornment, endAdornment, wrapperStyle, value: propsValue, onChange, debounceTimeMs, ...other } = props;
 
     const [value, setValue] = React.useState<unknown>(propsValue);
     const [prevValue, setPrevValue] = React.useState<unknown>(propsValue);
@@ -76,9 +76,9 @@ export const Input = React.forwardRef((props: InputProps, ref: React.ForwardedRe
 
             debounceTimerRef.current = setTimeout(() => {
                 onChange(event);
-            }, props.debounceTimeMs ?? 0);
+            }, debounceTimeMs ?? 0);
         },
-        [props.min, props.max, onChange, props.type, props.debounceTimeMs]
+        [props.min, props.max, onChange, props.type, debounceTimeMs]
     );
 
     return (

diff --git a/frontend/src/modules/Grid3D/view/components/ReadoutBox.tsx b/frontend/src/modules/Grid3D/view/components/ReadoutBox.tsx
@@ -28,7 +28,7 @@ function makePositionInfo(layerPickInfo: LayerPickInfo): ReadoutInfo | null {
     };
 }
 
-function makeAdditionalInformation(item: ReadoutInfo): React.ReactNode {
+function makeAdditionalInformation(item: ReadoutInfo, verticalScale: number): React.ReactNode {
     if (!item.properties) {
         return null;
     }
@@ -41,22 +41,26 @@ function makeAdditionalInformation(item: ReadoutInfo): React.ReactNode {
     }
 
     // depth readout from SubsurfaceViewer is not properly working
-    return item.properties
-        .filter((el) => el.name !== "Depth")
-        .map((el, index) => {
-            return (
-                <div className="table-row" key={index}>
-                    <div className="table-cell w-32">{el.name}:</div>
-                    <div className="table-cell">{formatValue(el.value)}</div>
+    return item.properties.map((el, index) => {
+        return (
+            <div className="table-row" key={index}>
+                <div className="table-cell w-32">{el.name}:</div>
+                <div className="table-cell">
+                    {el.name === "Depth"
+                        ? formatValue((typeof el.value === "string" ? parseFloat(el.value) : el.value) / verticalScale)
+                        : formatValue(el.value)}
                 </div>
-            );
-        });
+            </div>
+        );
+    });
 }
 
 export type ReadoutBoxProps = {
     layerPickInfo: LayerPickInfo[];
     maxNumItems?: number;
     visible?: boolean;
+    // Required as long as the SubsurfaceViewer is not providing correct depth readout
+    verticalScale: number;
 };
 
 export function ReadoutBox(props: ReadoutBoxProps): React.ReactNode {
@@ -138,7 +142,7 @@ export function ReadoutBox(props: ReadoutBoxProps): React.ReactNode {
                             <div className="table-row">
                                 <div className="table-cell font-bold">{el.label}</div>
                             </div>
-                            {makeAdditionalInformation(el)}
+                            {makeAdditionalInformation(el, props.verticalScale)}
                         </div>
                     );
                 }

diff --git a/frontend/src/modules/Grid3D/view/components/SubsurfaceViewerWrapper.tsx b/frontend/src/modules/Grid3D/view/components/SubsurfaceViewerWrapper.tsx
@@ -588,7 +588,7 @@ export function SubsurfaceViewerWrapper(props: SubsurfaceViewerWrapperProps): Re
                 height={divSize.height / 2 - 50}
                 position="left"
             />
-            <ReadoutBox layerPickInfo={layerPickingInfo} visible={pointerOver} />
+            <ReadoutBox layerPickInfo={layerPickingInfo} visible={pointerOver} verticalScale={verticalScale} />
             {props.enableIntersectionPolylineEditing && polylineEditingActive && (
                 <PolylineEditingPanel
                     currentlyEditedPolyline={currentlyEditedPolyline}
@@ -618,8 +618,8 @@ export function SubsurfaceViewerWrapper(props: SubsurfaceViewerWrapperProps): Re
                 }}
                 coords={{
                     visible: false,
-                    multiPicking: polylineEditPointsModusActive,
-                    pickDepth: polylineEditPointsModusActive ? 2 : undefined,
+                    multiPicking: true, //polylineEditPointsModusActive,
+                    pickDepth: 2, // polylineEditPointsModusActive ? 2 : undefined,
                 }}
                 colorTables={colorTables}
                 onMouseEvent={handleMouseEvent}

diff --git a/frontend/src/modules/Grid3D/view/view.tsx b/frontend/src/modules/Grid3D/view/view.tsx
@@ -39,11 +39,13 @@ export function View(props: ModuleViewProps<State, SettingsToViewInterface>): Re
     const syncHelper = new SyncSettingsHelper(syncedSettingKeys, props.workbenchServices);
 
     let colorScale = props.viewContext.useSettingsToViewInterfaceValue("colorScale");
+    const defaultColorScale = props.workbenchSettings.useContinuousColorScale({
+        gradientType: ColorScaleGradientType.Sequential,
+    });
     if (!colorScale) {
-        colorScale = props.workbenchSettings.useContinuousColorScale({
-            gradientType: ColorScaleGradientType.Sequential,
-        });
+        colorScale = defaultColorScale;
     }
+
     const useCustomBounds = props.viewContext.useSettingsToViewInterfaceValue("useCustomBounds");
 
     const highlightedWellboreUuid = useAtomValue(selectedHighlightedWellboreUuidAtom);
@@ -66,6 +68,7 @@ export function View(props: ModuleViewProps<State, SettingsToViewInterface>): Re
         const ensemble = ensembleSet.findEnsemble(ensembleIdent);
         ensembleName = ensemble?.getDisplayName() ?? "";
     }
+
     props.viewContext.setInstanceTitle(
         `${ensembleName}, R=${realization} -- ${gridModelName} / ${gridModelParameterName}`
     );

diff --git a/frontend/src/modules/Intersection/settings/components/layers.tsx b/frontend/src/modules/Intersection/settings/components/layers.tsx
@@ -487,23 +487,21 @@ function LayerItem(props: LayerItemProps): React.ReactNode {
     }
 
     return (
-        <>
+        <div ref={divRef} className={resolveClassNames("relative")} data-layer-id={props.layer.getId()}>
+            <div
+                className={resolveClassNames("bg-red-300 z-10 w-full h-full absolute left-0 top-0", {
+                    hidden: !props.isDragging,
+                })}
+            ></div>
             <div
-                ref={divRef}
                 className={resolveClassNames(
                     "flex h-10 py-2 px-1 hover:bg-blue-100 text-sm items-center gap-1 border-b border-b-gray-300 relative",
                     {
                         "bg-red-100": props.layer.getStatus() === LayerStatus.ERROR,
                         "bg-white": props.layer.getStatus() !== LayerStatus.ERROR,
                     }
                 )}
-                data-layer-id={props.layer.getId()}
             >
-                <div
-                    className={resolveClassNames("bg-red-300 z-10 w-full h-full absolute left-0 top-0", {
-                        hidden: !props.isDragging,
-                    })}
-                ></div>
                 {makeLayerElement(dragIndicatorRef)}
             </div>
             {props.isDragging &&
@@ -528,7 +526,7 @@ function LayerItem(props: LayerItemProps): React.ReactNode {
             >
                 {makeSettingsContainer(props.layer)}
             </div>
-        </>
+        </div>
     );
 }
 

diff --git a/frontend/src/modules/Intersection/sharedAtoms/sharedAtoms.ts b/frontend/src/modules/Intersection/sharedAtoms/sharedAtoms.ts
@@ -40,6 +40,8 @@ export const selectedWellboreAtom = atom((get) => {
     return {
         uuid: userSelectedWellboreUuid,
         identifier: userSelectedWellboreHeader.unique_wellbore_identifier,
+        depthReferencePoint: userSelectedWellboreHeader.depth_reference_point,
+        depthReferenceElevation: userSelectedWellboreHeader.depth_reference_elevation,
     };
 });