@webviz/subsurface-viewer 0.0.1-alpha.1

package/src/components/StatusIndicator.test.tsx

@@ -0,0 +1,14 @@
+import { render } from "@testing-library/react";
+import "jest-styled-components";
+import "@testing-library/jest-dom";
+import React from "react";
+import StatusIndicator from "./StatusIndicator";
+
+describe("Test Status Indicator", () => {
+    it("snapshot test with no props", () => {
+        const { container } = render(
+            <StatusIndicator layers={[]} isLoaded={true} />
+        );
+        expect(container.firstChild).toMatchSnapshot();
+    });
+});

package/src/components/StatusIndicator.tsx

@@ -0,0 +1,38 @@
+import React from "react";
+import { CircularProgress } from "@equinor/eds-core-react";
+import { Layer, LayersList } from "@deck.gl/core/typed";
+
+interface StatusIndicatorProps {
+    layers: LayersList;
+    isLoaded: boolean;
+}
+
+function getLoadProgress(layers: LayersList) {
+    const loaded = layers?.filter((layer) => (layer as Layer)?.isLoaded);
+    const count = loaded?.length;
+    const progress = count / layers?.length;
+    return progress * 100;
+}
+
+const StatusIndicator: React.FC<StatusIndicatorProps> = ({
+    layers,
+    isLoaded,
+}: StatusIndicatorProps) => {
+    if (isLoaded) {
+        return <div />;
+    }
+    const progress = getLoadProgress(layers);
+    return (
+        <div>
+            <CircularProgress
+                size={48}
+                value={progress}
+                variant={"determinate"}
+            />
+            <br />
+            Loading assets...
+        </div>
+    );
+};
+
+export default StatusIndicator;

package/src/components/ViewAnnotation.tsx

@@ -0,0 +1,16 @@
+import React from "react";
+import PropTypes from "prop-types";
+
+interface ViewAnnotationProps {
+    id: string;
+    children?: React.ReactNode;
+}
+
+export const ViewAnnotation: React.FC<ViewAnnotationProps> = ({ children }) => {
+    return <> {children} </>;
+};
+
+ViewAnnotation.propTypes = {
+    id: PropTypes.string.isRequired,
+    children: PropTypes.any,
+};

package/src/components/ViewFooter.test.tsx

@@ -0,0 +1,12 @@
+import { render } from "@testing-library/react";
+import "jest-styled-components";
+import "@testing-library/jest-dom";
+import React from "react";
+import { ViewFooter } from "./ViewFooter";
+
+describe("Test View Footer", () => {
+    it("snapshot test with no props", () => {
+        const { container } = render(<ViewFooter />);
+        expect(container.firstChild).toMatchSnapshot();
+    });
+});

package/src/components/ViewFooter.tsx

@@ -0,0 +1,30 @@
+import React from "react";
+import PropTypes from "prop-types";
+import { styled } from "@mui/system";
+
+const StyledViewFooter = styled("div")(({ theme }) => ({
+    position: "absolute",
+    bottom: theme.spacing(0),
+    right: theme.spacing(2),
+    zIndex: 999999,
+
+    float: "right",
+    backgroundColor: "#ffffffcc",
+    color: "#000000ff",
+    paddingLeft: "3px",
+    display: "tableRow",
+}));
+
+interface ViewFooterProps {
+    children?: React.ReactNode;
+}
+
+export const ViewFooter: React.FC<ViewFooterProps> = ({
+    children,
+}: ViewFooterProps) => {
+    return <StyledViewFooter>{children}</StyledViewFooter>;
+};
+
+ViewFooter.propTypes = {
+    children: PropTypes.any,
+};

package/src/components/__snapshots__/ColorLegends.test.tsx.snap

@@ -0,0 +1,15 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Test Color Legend snapshot test 1`] = `
+<div
+  style="position: absolute; display: flex; z-index: 999;"
+/>
+`;
+
+exports[`Test Color Legend snapshot test if layers=0 1`] = `null`;
+
+exports[`Test Color Legend snapshot test with props 1`] = `
+<div
+  style="position: absolute; display: flex; z-index: 999;"
+/>
+`;

package/src/components/__snapshots__/DistanceScale.test.tsx.snap

@@ -0,0 +1,33 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Test Color Legend snapshot test with default props 1`] = `
+<div
+  style="position: absolute;"
+>
+  <label>
+    800
+    m
+  </label>
+  <div
+    style="width: 100px; height: 4px; border: 2px solid; display: inline-block; margin-left: 3px;"
+  />
+</div>
+`;
+
+exports[`Test Color Legend snapshot test with higher zoom 1`] = `
+<div
+  style="position: absolute; top: 10px; left: 10px;"
+>
+  <label
+    style="top: 10px; left: 10px;"
+  >
+    50
+    m
+  </label>
+  <div
+    style="width: 100px; height: 4px; border: 2px solid; display: inline-block; margin-left: 3px;"
+  />
+</div>
+`;
+
+exports[`Test Color Legend snapshot test with invalid props 1`] = `null`;