@equinor/echo-cli 1.0.0-beta-9 → 1.0.0-beta-11

package/echo-dev-host/package.json

@@ -48,7 +48,7 @@
         "zustand": "4.5.5"
     },
     "devDependencies": {
-        "@babel/core": "7.27.1",
+        "@babel/core": "7.28.0",
         "@babel/plugin-transform-runtime": "7.27.1",
         "@babel/polyfill": "7.12.1",
         "@babel/preset-env": "7.27.2",

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

@@ -1,60 +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;
-    }
-}
+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/echo-dev-host/src/api/api-plants.ts

@@ -1,22 +1,22 @@
-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);
-    }
-}
+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/echo-dev-host/src/app.css

@@ -1,12 +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%;
-}
+/* 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/echo-dev-host/src/app.tsx

@@ -1,43 +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 });
-        }
-    });
-}
+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/echo-dev-host/src/components/Home/Home.tsx

@@ -1,23 +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>
-    );
-};
+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/echo-dev-host/src/components/Home/home.module.css

@@ -1,38 +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;
-}
-
+.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/echo-dev-host/src/components/legend.tsx

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

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

@@ -1,90 +1,90 @@
-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, searchPanel } 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';
-
-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: [searchPanel],
-        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 />);
-}
+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, searchPanel } 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';
+
+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: [searchPanel],
+        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/echo-dev-host/src/setupTests.ts

@@ -1,25 +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'
-                };
-            })
-        }
-    };
-});
+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'
+                };
+            })
+        }
+    };
+});