@equinor/echo-cli 1.0.3-beta-0 → 1.0.3

package/lib/echo-dev-host/package.json

@@ -0,0 +1,80 @@
+{
+    "name": "@equinor/echo-dev-host",
+    "version": "0.0.1",
+    "description": "",
+    "main": "index.js",
+    "scripts": {
+        "start": "webpack serve --mode development --env development --open --hot",
+        "build-client": "webpack --env development --env=cli=true",
+        "build": "webpack --mode development",
+        "echo-update": "echo-update",
+        "echo-update-version": "echo-update -v",
+        "echo-update-next": "echo-update -c",
+        "echo-update-all": "echo-update -a",
+        "echo-test": "jest",
+        "lint": "eslint --ext .js,.jsx,.ts,.tsx src --color",
+        "test-wo-install": "jest --watchAll",
+        "test": "npm ci & jest --watchAll",
+        "test-coverage": "npm ci & jest --coverage --watchAll",
+        "unlink-echo-search": "node unlink-echo-search.js"
+    },
+    "author": "",
+    "license": "MIT",
+    "dependencies": {
+        "@equinor/echo-base": "1.3.0",
+        "@equinor/echo-components": "1.3.0",
+        "@equinor/echo-core": "1.3.0",
+        "@equinor/echo-framework": "1.3.0",
+        "@equinor/echo-scripts": "0.1.5",
+        "@equinor/echo-search": "1.3.0",
+        "@equinor/echo-utils": "1.3.0",
+        "@equinor/eds-core-react": "0.43.0",
+        "@equinor/eds-icons": "0.22.0",
+        "@equinor/eds-utils": "0.8.7",
+        "@microsoft/signalr": "9.0.6",
+        "@svgr/webpack": "8.1.0",
+        "@tanstack/react-query": "5.90.2",
+        "classnames": "2.5.1",
+        "fs-extra": "11.3.0",
+        "history": "5.3.0",
+        "immer": "10.1.3",
+        "lodash": "4.17.21",
+        "react": "18.3.1",
+        "react-dom": "18.3.1",
+        "react-router-dom": "5.3.4",
+        "react-sortablejs": "6.1.4",
+        "sortablejs": "1.15.6",
+        "styled-components": "6.1.19",
+        "zustand": "4.5.7"
+    },
+    "devDependencies": {
+        "@babel/core": "7.28.4",
+        "@babel/plugin-transform-runtime": "7.27.1",
+        "@babel/polyfill": "7.12.1",
+        "@babel/preset-env": "7.27.2",
+        "@babel/preset-react": "7.27.1",
+        "@babel/preset-typescript": "7.27.1",
+        "@equinor/echo-update": "1.3.3",
+        "@types/jest": "30.0.0",
+        "@types/node": "24.3.0",
+        "@types/react": "18.3.12",
+        "@types/react-dom": "18.3.1",
+        "@types/react-router-dom": "5.3.3",
+        "@types/webpack-env": "1.18.8",
+        "babel-loader": "10.0.0",
+        "copy-webpack-plugin": "13.0.0",
+        "css-loader": "7.1.2",
+        "dotenv-webpack": "8.1.0",
+        "file-loader": "6.2.0",
+        "html-webpack-plugin": "5.6.3",
+        "jest": "30.2.0",
+        "style-loader": "4.0.0",
+        "ts-jest": "29.4.5",
+        "ts-loader": "9.5.2",
+        "typescript": "5.9.3",
+        "webpack": "5.102.1",
+        "webpack-cli": "6.0.1",
+        "webpack-dev-server": "5.2.1",
+        "webpackbar": "7.0.0"
+    }
+}

package/lib/echo-dev-host/public/env-config.js

@@ -0,0 +1,17 @@
+window._env_ = {
+  HTTPS: "true",
+  GENERATE_SOURCEMAP: "true",
+  INLINE_RUNTIME_CHUNK: "false",
+  WEBSITE_HOSTNAME: "localhost:3000;",
+  REACT_APP_DEFAULT_CACHE_LOCATION: "localstorage",
+  REACT_APP_API_URL: "https://dt-echopedia-api-dev.azurewebsites.net",
+  REACT_APP_WEB_URL: "https://dt-echopedia-web-dev.azurewebsites.net",
+  REACT_APP_WEB_PROD_URL: "https://echo.equinor.com",
+  REACT_APP_AZURE_AD_TENNANT: "StatoilSRM.onmicrosoft.com",
+  REACT_APP_AZURE_AD_TENNANT_ID: "3aa4a235-b6e2-48d5-9195-7fcf05b459b0",
+  REACT_APP_AZURE_AD_CLIENT_ID: "751d2504-0b66-4b78-9807-4b60525a14c6",
+  REACT_APP_API_CLIENT_ID: "aef35d97-53d4-4fd0-adaf-c5a514b38436",
+  REACT_APP_APPINSIGHTS_CONNECTION_STRING: "InstrumentationKey=e5299075-a00d-4012-96f9-42861e8d8a9e;IngestionEndpoint=https://northeurope-3.in.applicationinsights.azure.com/;LiveEndpoint=https://northeurope.livediagnostics.monitor.azure.com/;ApplicationId=a9b64222-d4a9-42e6-a615-7428fe1a26af",
+  REACT_APP_AZURE_BUILD_NUMBER: "0.8.dev.9",
+  REACT_APP_LOGGER_ACTIVE: "false",
+}

package/lib/echo-dev-host/public/index.css

@@ -0,0 +1,60 @@
+body {
+    overflow: hidden;
+    margin: 0;
+}
+
+.highlightedText {
+    background: yellow;
+    color: black;
+    padding: 0;
+}
+
+#rootloading {
+    display: flex;
+    flex-direction: column;
+    color: #ff1243;
+    justify-content: center;
+    align-items: center;
+    text-align: center;
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
+
+.loaderContainer {
+    margin: 8px auto;
+    display: flex;
+    flex-direction: column;
+    padding-top: 0;
+}
+
+.productLogo {
+    flex: 1;
+    margin-bottom: 4rem;
+    text-align: left;
+}
+
+.productLogoImg {
+    display: inline-block;
+    vertical-align: baseline;
+    width: 122px;
+    animation: fadeIn 0.5s;
+}
+
+.equinorLogo {
+    margin: 0 auto;
+    display: inline-block;
+    vertical-align: baseline;
+    width: 64px;
+    height: 64px;
+    animation: fadeIn 0.5s;
+}
+
+@keyframes fadeIn {
+    0% {
+        opacity: 0;
+    }
+    100% {
+        opacity: 1;
+    }
+}

package/lib/echo-dev-host/public/index.html

@@ -0,0 +1,21 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <script type="application/javascript" src="./env-config.js"></script>
+        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+        <meta
+            name="viewport"
+            content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover"
+        />
+        <link href="./index.css" rel="stylesheet" />
+        <link rel="stylesheet" href="https://cdn.eds.equinor.com/font/equinor-font.css" />
+        <link rel="preconnect" href="https://login.microsoftonline.com" />
+        <link rel="preconnect" href="https://dc.services.visualstudio.com" />
+        <link rel="preconnect" href="https://cdn.eds.equinor.com" />
+        <title>Echo | Development</title>
+    </head>
+    <body>
+        <div id="root"></div>
+    </body>
+</html>

package/lib/echo-dev-host/src/api/api-plants.ts

@@ -0,0 +1,23 @@
+import { EchoEnv, Plant, request, setPlantsData } from '@equinor/echo-core';
+
+async function getPlantsFromApi(): Promise<Plant[] | undefined> {
+    const url = `${EchoEnv.env().REACT_APP_API_URL}/plants`;
+    return request<Plant[]>({
+        url,
+        cache: {
+            timeInSeconds: 4 * 60 * 60 // 4 hours
+        }
+    });
+}
+
+export async function getCorePlants(): Promise<void> {
+    try {
+        const apiPlants = (await getPlantsFromApi()) ?? [];
+
+        if (apiPlants && apiPlants.length > 0) {
+            setPlantsData({ plants: apiPlants });
+        }
+    } catch (ex) {
+        console.error(ex);
+    }
+}

package/lib/echo-dev-host/src/app.css

@@ -0,0 +1,12 @@
+/* Applied in echo application by bootstrap so it should exist here to */
+*,
+:after,
+:before {
+    box-sizing: border-box;
+}
+
+#root {
+    height: 100%;
+    overflow: hidden;
+    width: 100%;
+}

package/lib/echo-dev-host/src/app.tsx

@@ -0,0 +1,43 @@
+import { EchoEnv, useInitial } from '@equinor/echo-core';
+import { displayToast, EchoContent, EchoEventHandler, EchoRoutes, Toasters } from '@equinor/echo-framework';
+import { Syncer } from '@equinor/echo-search';
+import React from 'react';
+import { Redirect as TypedRedirect, Route as TypedRoute, Switch as TypedSwitch } from 'react-router-dom';
+import { getCorePlants } from './api/api-plants';
+import './app.css';
+import { Home } from './components/Home/Home';
+import { Legend } from './components/legend';
+
+export const EchoApp: React.FC = () => {
+    useInitial(async () => {
+        await Syncer.configuration.setApiBaseUrl(EchoEnv.env().REACT_APP_API_URL);
+        fireAndForget(getCorePlants, {
+            userFriendlyErrorMessage: '[echo-dev-host][app.tsx] Failed to load plants data',
+            displayToast: true
+        });
+    });
+
+    return (
+        <EchoEventHandler>
+            <EchoContent Legend={Legend} isOnboardingCompleted={true}>
+                <TypedSwitch>
+                    <EchoRoutes homeComponent={Home} />
+                    <TypedRoute render={(): JSX.Element => <TypedRedirect to="/" />} />
+                </TypedSwitch>
+                <Toasters />
+            </EchoContent>
+        </EchoEventHandler>
+    );
+};
+
+function fireAndForget(
+    asyncFunc: () => Promise<void>,
+    options: { userFriendlyErrorMessage: string; displayToast?: boolean }
+): void {
+    asyncFunc().catch((error) => {
+        console.error(error, options.userFriendlyErrorMessage);
+        if (options.displayToast) {
+            displayToast({ message: options.userFriendlyErrorMessage });
+        }
+    });
+}

package/lib/echo-dev-host/src/components/Home/Home.tsx

@@ -0,0 +1,23 @@
+import { AppLinks, EchoLogo, Footer, PlantSelector } from '@equinor/echo-framework';
+import React from 'react';
+import placeholderHomeImage from '../../images/frontpage-brand-placeholder.jpg';
+import style from './home.module.css';
+
+export const Home: React.FC = () => {
+    return (
+        <main className={style.home}>
+            <div className={style.plantSelector}>
+                <div>
+                    <EchoLogo />
+                </div>
+
+                <PlantSelector />
+            </div>
+            <AppLinks />
+            <div className={style.brandSliderContainer}>
+                <img src={placeholderHomeImage} alt="Application Echo on tablet" />
+            </div>
+            <Footer />
+        </main>
+    );
+};

package/lib/echo-dev-host/src/components/Home/home.module.css

@@ -0,0 +1,38 @@
+.home {
+    display: grid;
+    grid-template-rows: 30% 100px auto 56px;
+    gap: 1rem;
+    height: 100%;
+    width: 100%;
+}
+
+.plantSelector {
+    display: flex;
+    justify-content: center;
+    align-items: baseline;
+    align-self: center;
+    flex-flow: wrap;
+}
+
+.heading {
+    padding-left: 18px;
+}
+
+.brandSliderContainer {
+    display: flex;
+    flex: 1 1;
+    flex-flow: column-reverse;
+    margin: 0;
+    width: 100%;
+    overflow: hidden;
+    object-fit: cover;
+}
+
+.appBar {
+    margin: 0 auto 48px;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
+    align-items: flex-start;
+}
+

package/lib/echo-dev-host/src/components/dummySearchPanel/DummySearchPanel.tsx

@@ -0,0 +1,28 @@
+import { ECHO_CORE_SEARCH, Panel, PanelType } from '@equinor/echo-core';
+import React from 'react';
+import style from './dummySearchPanel.module.css';
+
+const DummySearchMenu: React.FC = () => {
+    return (
+        <div className={style.wrapper}>
+            <div className={style.panel}>
+                <h3>SearchMenu</h3>
+                <p>
+                    You're running your echo app in <b>echo-dev-host</b>, a host application for echo apps / modules.
+                </p>
+                <p>
+                    <b>echo-dev-host</b> is a bare-bones version of the original app, echopediaWeb. The purpose of it is
+                    to help echo teams to develop their app independently from echopediaWeb itself.
+                </p>
+            </div>
+        </div>
+    );
+};
+
+export const dummySearchPanel: Panel = {
+    component: DummySearchMenu,
+    panelType: PanelType.left,
+    key: ECHO_CORE_SEARCH,
+    icon: 'search',
+    label: 'Search'
+};

package/lib/echo-dev-host/src/components/dummySearchPanel/dummySearchPanel.module.css

@@ -0,0 +1,13 @@
+.panel {
+    padding: var(--small);
+}
+
+.wrapper {
+    display: flex;
+    flex-direction: column;
+    margin: 10px;
+}
+
+.close {
+    align-self: end;
+}

package/lib/echo-dev-host/src/components/legend.tsx

@@ -0,0 +1,3 @@
+export const Legend: React.FC = () => {
+    return null;
+};

package/lib/echo-dev-host/src/index.tsx

@@ -0,0 +1,91 @@
+import { LoadingModuleOptions } from '@equinor/echo-base';
+import '@equinor/echo-components/style-reset.css';
+import EchoCore, { createEchoAppModuleApi, EventHubProvider, queryClient } from '@equinor/echo-core';
+import { mainMenu, Mediator } from '@equinor/echo-framework';
+import { Icon } from '@equinor/eds-core-react';
+import * as Icons from '@equinor/eds-icons';
+import React from 'react';
+import { initForE2ETests } from './utils/setupSkipAuth';
+
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { createRoot } from 'react-dom/client';
+import { BrowserRouter } from 'react-router-dom';
+import { EchoApp } from './app';
+import { dummySearchPanel } from './components/dummySearchPanel/DummySearchPanel';
+
+const useEdsIcon = (): void => {
+    Icon.add({
+        ...Icons
+    });
+};
+
+const Echo: React.FC = (): JSX.Element => {
+    /* Needed to skip authentication when running e2e tests*/
+    initForE2ETests();
+
+    const isAuthenticated = EchoCore.useEchoSetup({
+        leftPanels: [dummySearchPanel],
+        rightPanel: mainMenu
+    });
+    useEdsIcon();
+    const moduleOptions: LoadingModuleOptions = {
+        createApi: createEchoAppModuleApi(),
+        dependencies: {
+            react: require('react'),
+            'react-dom': require('react-dom'),
+            'react-router-dom': require('react-router-dom'),
+            '@equinor/echo-core': require('@equinor/echo-core'),
+            '@equinor/echo-framework': require('@equinor/echo-framework'),
+            '@equinor/echo-utils': require('@equinor/echo-utils'),
+            '@equinor/echo-components': require('@equinor/echo-components'),
+            '@equinor/echo-base': require('@equinor/echo-base'),
+            '@equinor/echo-search': require('@equinor/echo-search'),
+            '@equinor/eds-core-react': require('@equinor/eds-core-react'),
+            '@equinor/eds-icons': require('@equinor/eds-icons'),
+            'styled-components': require('styled-components'),
+            classnames: require('classnames'),
+            lodash: require('lodash'),
+            zustand: require('zustand')
+        },
+        fetchModules: () => {
+            return new Promise((resolve) => {
+                fetch('/echoModuleManifest.json').then((response) => {
+                    response.json().then((manifests) => {
+                        manifests.forEach((manifest) => {
+                            manifest.fileUri = `/index.js`;
+                        });
+                        resolve(manifests);
+                    });
+                });
+            });
+        }
+    };
+    return (
+        <>
+            {isAuthenticated && (
+                <EchoCore.AuthProviderComponent>
+                    {/*
+                        Need to cast queryClient to QueryClient because of the following error:
+                        TS2352: Conversion of type 'import("Equinor\\EchopediaWeb\\node_modules\\@tanstack\\query-core\\build\\modern\\hydration-CwYEwyQI").b' to type 'import("Equinor\\EchopediaWeb\\node_modules\\@tanstack\\query-core\\build\\modern\\hydration-BlEK5ylC").b' may be a mistake because neither type sufficiently overlaps with the other. If this was intentional, convert the expression to 'unknown' first. 
+                        Property '#private' in type 'QueryClient' refers to a different member that cannot be accessed from within type 'QueryClient'.
+                        Based on my research we used the same version of react-query in echopediaWeb and echo-client.
+                    */}
+                    <QueryClientProvider client={queryClient as unknown as QueryClient}>
+                        <EventHubProvider>
+                            <Mediator options={moduleOptions} />
+                            <BrowserRouter>
+                                <EchoApp />
+                            </BrowserRouter>
+                        </EventHubProvider>
+                    </QueryClientProvider>
+                </EchoCore.AuthProviderComponent>
+            )}
+        </>
+    );
+};
+
+if (!(window !== window.parent && !window.opener)) {
+    const container = document.getElementById('root') as HTMLElement;
+    const root = createRoot(container);
+    root.render(<Echo />);
+}

package/lib/echo-dev-host/src/setupTests.ts

@@ -0,0 +1,25 @@
+export {};
+// Should remove this error: BrowserAuthError: crypto_nonexistent: The crypto object or function is not available. Detail:Browser crypto or msCrypto object not available.
+const mGetRandomValues = jest.fn().mockReturnValueOnce(new Uint32Array(10));
+Object.defineProperty(window, 'crypto', {
+    value: { getRandomValues: mGetRandomValues }
+});
+
+jest.mock('@equinor/echo-core', () => {
+    return {
+        __esModule: true,
+        ...jest.requireActual('@equinor/echo-core'),
+        storage: {
+            getItem: jest.fn(),
+            setItem: jest.fn()
+        },
+        EchoEnv: {
+            env: jest.fn().mockImplementation(() => {
+                return {
+                    REACT_APP_AZURE_AD_CLIENT_ID: '',
+                    REACT_APP_API_URL: 'non-mono-base-api-url'
+                };
+            })
+        }
+    };
+});

package/lib/echo-dev-host/src/utils/plants.test.ts

@@ -0,0 +1,33 @@
+import { Plant } from '@equinor/echo-core';
+import { checkIsPlantsListUpdated } from './plants';
+
+describe('checkIsPlantsListUpdated', () => {
+    const originalPlant: Plant = {
+        instCode: 'JSV',
+        hasTr2000: true,
+        description: 'A description',
+        sapPlantId: '',
+        proCoSysPlantId: ''
+    };
+    const updatedPlant: Plant = { ...originalPlant, description: 'A changed description' };
+    it('should return false if lists are identical', () => {
+        // given
+        const apiPlants = [originalPlant];
+        const localStoragePlants = [originalPlant];
+
+        // when
+        const result = checkIsPlantsListUpdated(apiPlants, localStoragePlants);
+
+        expect(result).toBe(false);
+    });
+    it('should return true if lists are not identical', () => {
+        // given
+        const apiPlants = [updatedPlant];
+        const localStoragePlants = [originalPlant];
+
+        // when
+        const result = checkIsPlantsListUpdated(apiPlants, localStoragePlants);
+
+        expect(result).toBe(true);
+    });
+});

package/lib/echo-dev-host/src/utils/plants.ts

@@ -0,0 +1,12 @@
+import { Plant } from '@equinor/echo-core';
+import EchoUtils from '@equinor/echo-utils';
+
+const { arraysIsEqual } = EchoUtils.Utils;
+
+export const checkIsPlantsListUpdated = (apiPlants: Plant[], localStoragePlants: Plant[]): boolean => {
+    if (!localStoragePlants || localStoragePlants.length === 0 || !arraysIsEqual([...localStoragePlants], apiPlants)) {
+        return true;
+    } else {
+        return false;
+    }
+};

package/lib/echo-dev-host/src/utils/setupSkipAuth.ts

@@ -0,0 +1,43 @@
+import EchoCore, { AuthenticationResult } from '@equinor/echo-core';
+import { getDeepLinkParams } from '@equinor/echo-utils';
+
+export function initForE2ETests() {
+    const { skipAuth } = getDeepLinkParams(['skipAuth']);
+    if (skipAuth?.toLowerCase() === 'true') {
+        setupSkipAuth();
+    }
+}
+
+const setAuthentication = () => {
+    EchoCore.EchoAuthProvider.isAuthenticated = true;
+    EchoCore.EchoAuthProvider.userProperties = {
+        account: {
+            homeAccountId: 'homeAccountId',
+            environment: 'testingEnvironment',
+            tenantId: 'tenantId',
+            username: 'tester',
+            localAccountId: 'tester123'
+        }
+    };
+};
+
+export function setupSkipAuth() {
+    EchoCore.EchoAuthProvider.isAuthenticated = true;
+    EchoCore.EchoAuthProvider.handleLogin = async (logRequest?: (...args: unknown[]) => void): Promise<void> => {
+        setAuthentication();
+        return Promise.resolve(undefined);
+    };
+    EchoCore.EchoAuthProvider.ssoSilentOrRedirectToAuthenticate = async () => {
+        setAuthentication();
+        return Promise.resolve(undefined);
+    };
+    EchoCore.EchoAuthProvider.aquireTokenSilentOrRedirectToAuthenticate =
+        async (): Promise<AuthenticationResult | null> => {
+            setAuthentication();
+            return null;
+        };
+    EchoCore.EchoAuthProvider.login = async () => {
+        setAuthentication();
+        return Promise.resolve();
+    };
+}

package/lib/echo-dev-host/tsconfig.json

@@ -0,0 +1,21 @@
+{
+    "compilerOptions": {
+        "strict": true,
+        "jsx": "react-jsx",
+        "lib": ["dom", "dom.iterable", "esnext"],
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "module": "commonjs",
+        "outDir": "./build/",
+        "preserveConstEnums": true,
+        "removeComments": true,
+        "sourceMap": true,
+        "noImplicitAny": false,
+        "allowJs": true,
+        "skipLibCheck": true,
+        "target": "es5",
+        "resolveJsonModule": true,
+        "types": ["@equinor/echo-scripts", "@types/node", "@types/webpack-env", "@types/jest"]
+    },
+    "include": ["src"]
+}