@equinor/fusion-framework-module-app 2.5.0 → 2.7.1

package/dist/types/app/App.d.ts

@@ -5,7 +5,7 @@ import { OperatorFunction } from 'rxjs';
 import { EventModule } from '@equinor/fusion-framework-module-event';
 import { AnyModule, ModuleType } from '@equinor/fusion-framework-module';
 import { AppBundleStateInitial } from './types';
-import '../events';
+import './events';
 export declare function filterEmpty<T>(): OperatorFunction<T | null | undefined, T>;
 export declare class App<TEnv = any, TModules extends Array<AnyModule> | unknown = unknown> {
     #private;
@@ -21,7 +21,11 @@ export declare class App<TEnv = any, TModules extends Array<AnyModule> | unknown
         provider: AppModuleProvider;
         event?: ModuleType<EventModule>;
     });
-    initialize(): Observable<[AppManifest, AppScriptModule, AppConfig]>;
+    initialize(): Observable<{
+        manifest: AppManifest;
+        script: AppScriptModule;
+        config: AppConfig;
+    }>;
     loadConfig(): void;
     loadManifest(): void;
     loadAppModule(allow_cache?: boolean): Promise<void>;

package/dist/types/app/actions.d.ts

@@ -19,6 +19,10 @@ declare const createActions: () => {
         failure: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[error: unknown], unknown, "import_app::failure", never, never>;
     };
     setInstance: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[instance: AppModulesInstance<unknown>], AppModulesInstance<unknown>, "set_instance", never, never>;
+    initialize: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[], null, "initialize_app::request", never, never> & {
+        success: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[], null, "initialize_app::success", never, never>;
+        failure: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[error: unknown], unknown, "initialize_app::failure", never, never>;
+    };
 };
 export declare const actions: {
     setManifest: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[manifest: AppManifest], AppManifest, "set_manifest", never, {
@@ -39,6 +43,10 @@ export declare const actions: {
         failure: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[error: unknown], unknown, "import_app::failure", never, never>;
     };
     setInstance: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[instance: AppModulesInstance<unknown>], AppModulesInstance<unknown>, "set_instance", never, never>;
+    initialize: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[], null, "initialize_app::request", never, never> & {
+        success: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[], null, "initialize_app::success", never, never>;
+        failure: import("@equinor/fusion-observable/dist/types/create-action").ActionCreatorWithPreparedPayload<[error: unknown], unknown, "initialize_app::failure", never, never>;
+    };
 };
 export type ActionBuilder = ReturnType<typeof createActions>;
 export type ActionMap = ActionInstanceMap<ActionBuilder>;

package/dist/types/app/events.d.ts

@@ -0,0 +1,28 @@
+import type { FrameworkEvent, FrameworkEventInit } from '@equinor/fusion-framework-module-event';
+import type { App } from './App';
+import type { AppConfig, AppManifest, AppModulesInstance } from '../types';
+export type AppEventEventInit<TDetail extends Record<string, unknown> | unknown = unknown> = FrameworkEventInit<TDetail & {
+    appKey: string;
+}, App>;
+declare module '@equinor/fusion-framework-module-event' {
+    interface FrameworkEventMap {
+        onAppModulesLoaded: FrameworkEvent<AppEventEventInit<{
+            modules: AppModulesInstance;
+        }>>;
+        onAppManifestLoaded: FrameworkEvent<AppEventEventInit<{
+            manifest: AppManifest;
+        }>>;
+        onAppConfigLoaded: FrameworkEvent<AppEventEventInit<{
+            config: AppConfig;
+        }>>;
+        onAppScriptLoaded: FrameworkEvent<AppEventEventInit<{
+            manifest: AppManifest;
+        }>>;
+        onAppInitialize: FrameworkEvent<AppEventEventInit>;
+        onAppInitialized: FrameworkEvent<AppEventEventInit>;
+        onAppInitializeFailed: FrameworkEvent<AppEventEventInit<{
+            error: unknown;
+        }>>;
+        onAppDispose: FrameworkEvent<AppEventEventInit>;
+    }
+}

package/dist/types/enable-app-module.d.ts

@@ -0,0 +1,3 @@
+import type { IModulesConfigurator } from '@equinor/fusion-framework-module';
+import type { AppConfigBuilderCallback } from './AppConfigBuilder';
+export declare const enableAppModule: (configurator: IModulesConfigurator<any, any>, builder?: AppConfigBuilderCallback) => void;

package/dist/types/events.d.ts

@@ -1,22 +1,11 @@
-import { AnyModule } from '@equinor/fusion-framework-module';
 import { FrameworkEvent, FrameworkEventInit } from '@equinor/fusion-framework-module-event';
 import { App } from './app/App';
-import AppModuleProvider from './AppModuleProvider';
-import { AppModulesInstance } from './types';
-type AppModulesLoadedEventInit<TModules extends Array<AnyModule> | unknown = unknown> = FrameworkEventInit<{
-    appKey: string;
-    modules: AppModulesInstance<TModules>;
-}>;
-export declare class AppModulesLoadedEvent<TModules extends Array<AnyModule> | unknown = unknown> extends FrameworkEvent<AppModulesLoadedEventInit<TModules>> {
-    constructor(appKey: string, modules: AppModulesInstance<TModules>, init?: Omit<AppModulesLoadedEventInit<TModules>, 'detail'>);
-}
+import './app/events';
 declare module '@equinor/fusion-framework-module-event' {
     interface FrameworkEventMap {
-        onAppModulesLoaded: AppModulesLoadedEvent;
         onCurrentAppChanged: FrameworkEvent<FrameworkEventInit<{
             next?: App;
             previous?: App;
-        }, AppModuleProvider>>;
+        }>>;
     }
 }
-export {};

package/dist/types/index.d.ts

@@ -3,4 +3,5 @@ export { AppModuleProvider } from './AppModuleProvider';
 export { App } from './app/App';
 export * from './events';
 export * from './types';
-export { default, AppModule, module, moduleKey, enableAppModule } from './module';
+export { enableAppModule } from './enable-app-module';
+export { default, AppModule, module, moduleKey } from './module';

package/dist/types/module.d.ts

@@ -1,11 +1,10 @@
-import { IModulesConfigurator, Module } from '@equinor/fusion-framework-module';
+import { Module } from '@equinor/fusion-framework-module';
 import { ModuleDeps } from './types';
 import { IAppConfigurator } from './AppConfigurator';
 import { AppModuleProvider } from './AppModuleProvider';
 export declare const moduleKey = "app";
 export type AppModule = Module<typeof moduleKey, AppModuleProvider, IAppConfigurator, ModuleDeps>;
 export declare const module: AppModule;
-export declare const enableAppModule: (configurator: IModulesConfigurator<any, any>) => void;
 export default module;
 declare module '@equinor/fusion-framework-module' {
     interface Modules {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@equinor/fusion-framework-module-app",
-    "version": "2.5.0",
+    "version": "2.7.1",
     "description": "",
     "main": "dist/esm/index.js",
     "exports": {
@@ -45,5 +45,5 @@
         "@equinor/fusion-framework-module-service-discovery": "^4.0.8",
         "typescript": "^4.9.3"
     },
-    "gitHead": "e5668331df89b0ef6ef6175ea1908d4aeb772544"
+    "gitHead": "056c03a474079c018082339051755ab150db113d"
 }

package/src/app/App.ts

@@ -18,7 +18,7 @@ import { createState } from './create-state';
 import { actions, Actions } from './actions';
 import { AppBundleState, AppBundleStateInitial } from './types';
 
-import '../events';
+import './events';
 
 // TODO - move globally
 export function filterEmpty<T>(): OperatorFunction<T | null | undefined, T> {
@@ -87,12 +87,17 @@ export class App<TEnv = any, TModules extends Array<AnyModule> | unknown = unkno
         this.#state = createState(value, args.provider);
 
         const { appKey } = value;
+        const { event } = args;
 
-        const subscriptions = new Subscription();
+        event && this.#registerEvents(event);
 
-        if (args.event) {
+        const subscriptions = new Subscription();
+        if (event) {
+            subscriptions.add(() => {
+                event.dispatchEvent('onAppDispose', { detail: { appKey } });
+            });
             subscriptions.add(
-                args.event.addEventListener('onAppModulesLoaded', (e) => {
+                event.addEventListener('onAppModulesLoaded', (e) => {
                     if (e.detail.appKey === appKey) {
                         this.#state.next(actions.setInstance(e.detail.modules));
                     }
@@ -101,16 +106,104 @@ export class App<TEnv = any, TModules extends Array<AnyModule> | unknown = unkno
         }
 
         this.dispose = () => {
+            subscriptions?.unsubscribe();
             if (this.#state.value.instance) {
+                /** tear down modules of application */
                 this.#state.value.instance.dispose();
             }
-            subscriptions.unsubscribe();
             this.#state.complete();
         };
     }
 
-    public initialize(): Observable<[AppManifest, AppScriptModule, AppConfig]> {
-        return combineLatest([this.getManifest(), this.getAppModule(), this.getConfig()]);
+    #registerEvents(event: ModuleType<EventModule>): void {
+        const { appKey } = this;
+
+        this.#state.addEffect(actions.fetchManifest.success.type, (action) => {
+            event.dispatchEvent('onAppManifestLoaded', {
+                detail: { appKey, manifest: action.payload },
+                source: this,
+            });
+        });
+
+        this.#state.addEffect(actions.fetchConfig.success.type, (action) => {
+            event.dispatchEvent('onAppConfigLoaded', {
+                detail: { appKey, manifest: action.payload },
+                source: this,
+            });
+        });
+
+        this.#state.addEffect(actions.importApp.success.type, (action) => {
+            event.dispatchEvent('onAppScriptLoaded', {
+                detail: { appKey, manifest: action.payload },
+                source: this,
+            });
+        });
+
+        this.#state.addEffect(actions.initialize.type, () => {
+            event.dispatchEvent('onAppInitialize', {
+                detail: { appKey },
+                source: this,
+            });
+        });
+
+        this.#state.addEffect(actions.initialize.success.type, () => {
+            event.dispatchEvent('onAppInitialized', {
+                detail: { appKey },
+                source: this,
+            });
+        });
+
+        this.#state.addEffect(actions.initialize.failure.type, ({ payload }) => {
+            event.dispatchEvent('onAppInitializeFailed', {
+                detail: { appKey, error: payload },
+                source: this,
+            });
+        });
+    }
+
+    /**
+     * The initializing request won`t trigger until subscribing to the returned observable
+     *
+     * @example
+     * ```ts
+     * app.initialize().subscribe({
+     *  next: (value) => {
+     *      value.script.render(el, ...);
+     *  },
+     *  error: (err) => console.error('failed to load application', err),
+     *  complete: () => setInitializingApp(false)
+     * })
+     * ```
+     */
+    public initialize(): Observable<{
+        manifest: AppManifest;
+        script: AppScriptModule;
+        config: AppConfig;
+    }> {
+        return new Observable((observer) => {
+            this.#state.next(actions.initialize());
+            observer.add(
+                combineLatest([
+                    this.getManifest(),
+                    this.getAppModule(),
+                    this.getConfig(),
+                ]).subscribe({
+                    next: ([manifest, script, config]) =>
+                        observer.next({
+                            manifest,
+                            script,
+                            config,
+                        }),
+                    error: (err) => {
+                        observer.error(err), this.#state.next(actions.initialize.failure(err));
+                    },
+                    complete: () => {
+                        this.#state.next(actions.initialize.success());
+                        observer.complete();
+                    },
+                })
+            );
+        });
     }
 
     public loadConfig() {

package/src/app/actions.ts

@@ -40,6 +40,13 @@ const createActions = () => ({
     setInstance: createAction('set_instance', (instance: AppModulesInstance) => ({
         payload: instance,
     })),
+
+    initialize: createAsyncAction(
+        'initialize_app',
+        () => ({ payload: null }),
+        () => ({ payload: null }),
+        (error: unknown) => ({ payload: error })
+    ),
 });
 
 export const actions = createActions();

package/src/app/events.ts

@@ -0,0 +1,67 @@
+import type { FrameworkEvent, FrameworkEventInit } from '@equinor/fusion-framework-module-event';
+
+import type { App } from './App';
+
+import type { AppConfig, AppManifest, AppModulesInstance } from '../types';
+
+/** base event type for applications */
+export type AppEventEventInit<TDetail extends Record<string, unknown> | unknown = unknown> =
+    FrameworkEventInit<
+        /** additional event details and key of target event */
+        TDetail & { appKey: string },
+        /** source of the event */
+        App
+    >;
+
+declare module '@equinor/fusion-framework-module-event' {
+    interface FrameworkEventMap {
+        /** fired when the application has initiated its modules */
+        onAppModulesLoaded: FrameworkEvent<
+            AppEventEventInit<{
+                /** initiated modules for application */
+                modules: AppModulesInstance;
+            }>
+        >;
+
+        /** fired when the application has loaded corresponding manifest */
+        onAppManifestLoaded: FrameworkEvent<
+            AppEventEventInit<{
+                manifest: AppManifest;
+            }>
+        >;
+
+        /** fired when the application has loaded corresponding config */
+        onAppConfigLoaded: FrameworkEvent<
+            AppEventEventInit<{
+                config: AppConfig;
+            }>
+        >;
+
+        /** fired when the application has loaded corresponding javascript module */
+        onAppScriptLoaded: FrameworkEvent<
+            AppEventEventInit<{
+                manifest: AppManifest;
+            }>
+        >;
+
+        /** fired before application loads manifest, config and script */
+        onAppInitialize: FrameworkEvent<AppEventEventInit>;
+
+        /**
+         * fired after application has loaded manifest, config and script
+         *
+         * __note:__ not fired until all loaders has settled (last emit)
+         */
+        onAppInitialized: FrameworkEvent<AppEventEventInit>;
+
+        /** fired when application fails to load either manifest, config and script */
+        onAppInitializeFailed: FrameworkEvent<
+            AppEventEventInit<{
+                error: unknown;
+            }>
+        >;
+
+        /** fired when the application is disposed (unmounts) */
+        onAppDispose: FrameworkEvent<AppEventEventInit>;
+    }
+}

package/src/enable-app-module.ts

@@ -0,0 +1,21 @@
+import type { IModulesConfigurator } from '@equinor/fusion-framework-module';
+import type { AppConfigBuilderCallback } from './AppConfigBuilder';
+
+import { module } from './module';
+
+/**
+ * Method for enabling the Service module
+ * @param configurator - configuration object
+ */
+export const enableAppModule = (
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    configurator: IModulesConfigurator<any, any>,
+    builder?: AppConfigBuilderCallback
+): void => {
+    configurator.addConfig({
+        module,
+        configure: (appConfigurator) => {
+            builder && appConfigurator.addConfigBuilder(builder);
+        },
+    });
+};

package/src/events.ts

@@ -1,34 +1,18 @@
-import { AnyModule } from '@equinor/fusion-framework-module';
-
 import { FrameworkEvent, FrameworkEventInit } from '@equinor/fusion-framework-module-event';
 import { App } from './app/App';
-import AppModuleProvider from './AppModuleProvider';
-
-import { AppModulesInstance } from './types';
-
-type AppModulesLoadedEventInit<TModules extends Array<AnyModule> | unknown = unknown> =
-    FrameworkEventInit<{
-        appKey: string;
-        modules: AppModulesInstance<TModules>;
-    }>;
 
-export class AppModulesLoadedEvent<
-    TModules extends Array<AnyModule> | unknown = unknown
-> extends FrameworkEvent<AppModulesLoadedEventInit<TModules>> {
-    constructor(
-        appKey: string,
-        modules: AppModulesInstance<TModules>,
-        init?: Omit<AppModulesLoadedEventInit<TModules>, 'detail'>
-    ) {
-        super('onAppModulesLoaded', { ...init, detail: { appKey, modules } });
-    }
-}
+import './app/events';
 
 declare module '@equinor/fusion-framework-module-event' {
     interface FrameworkEventMap {
-        onAppModulesLoaded: AppModulesLoadedEvent;
+        /** fired when the current selected application changes */
         onCurrentAppChanged: FrameworkEvent<
-            FrameworkEventInit<{ next?: App; previous?: App }, AppModuleProvider>
+            FrameworkEventInit<{
+                /** current application  */
+                next?: App;
+                /** previous application */
+                previous?: App;
+            }>
         >;
     }
 }

package/src/index.ts

@@ -11,4 +11,6 @@ export { App } from './app/App';
 export * from './events';
 export * from './types';
 
-export { default, AppModule, module, moduleKey, enableAppModule } from './module';
+export { enableAppModule } from './enable-app-module';
+
+export { default, AppModule, module, moduleKey } from './module';

package/src/module.ts

@@ -1,4 +1,4 @@
-import { IModulesConfigurator, Module } from '@equinor/fusion-framework-module';
+import { Module } from '@equinor/fusion-framework-module';
 import { ModuleDeps } from './types';
 
 import { IAppConfigurator, AppConfigurator } from './AppConfigurator';
@@ -21,11 +21,6 @@ export const module: AppModule = {
     },
 };
 
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export const enableAppModule = (configurator: IModulesConfigurator<any, any>) => {
-    configurator.addConfig({ module });
-};
-
 export default module;
 
 declare module '@equinor/fusion-framework-module' {