@c8y/ngx-components 1017.0.4 → 1017.0.5

package/fesm2020/c8y-ngx-components.mjs

@@ -642,7 +642,7 @@ class AppStateService extends StateService {
         this.currentUser = new BehaviorSubject(null);
         this.currentTenant = new BehaviorSubject(null);
         this.currentApplication = new BehaviorSubject(null);
-        this.currentApplicationConfig = this.currentApplication.pipe(map(app => app?.config || null));
+        this.currentApplicationConfig = this.currentApplication.pipe(filter(app => !!app), map(app => app?.config || null));
         this.apiService.calls
             .pipe(filter(({ url }) => !/notification\/realtime/.test(url)), map(({ phase }) => (phase === 'start' ? 1 : -1)), scan((count, item) => count + item, 0), map(count => count > 0), distinctUntilChanged())
             .subscribe(isLoading => (this.state.isLoading = isLoading));
@@ -686,6 +686,7 @@ class AppStateService extends StateService {
             await this.loadDefaultOptions();
         }
         catch (ex) {
+            this.currentApplication.next({});
             throw ex;
         }
     }
@@ -9292,11 +9293,13 @@ class DynamicComponentService extends StateService {
          */
         this.factories = [];
         this.injectors = [this.rootInjector];
+        this.remotePluginsLoaded$ = new BehaviorSubject(false);
+        const remotesLoaded$ = this.remotePluginsLoaded$.pipe(filter(loaded => !!loaded), take(1));
         this.items$ = fromTriggerOnce(router, this.refreshTrigger, [
             getInjectedHooks(HOOK_COMPONENTS, this.injectors),
             () => this.factories,
             stateToFactory(this.state$)
-        ]).pipe(distinctUntilChanged(), takeUntil(timer(waitTimeout || this.DEFAULT_WAIT_TIMEOUT)), shareReplay(1));
+        ]).pipe(distinctUntilChanged(), takeUntil(combineLatest([timer(waitTimeout || this.DEFAULT_WAIT_TIMEOUT), remotesLoaded$])), shareReplay(1));
     }
     refresh() {
         this.refreshTrigger.next(1);
@@ -9333,6 +9336,9 @@ class DynamicComponentService extends StateService {
         const dynamicDef = await Promise.all(componentIdAndConfig.map(({ componentId }) => this.getById(componentId)));
         return this.dynamicResolver.serialize(componentIdAndConfig, dynamicDef);
     }
+    markPluginsAsLoaded() {
+        this.remotePluginsLoaded$.next(true);
+    }
 }
 DynamicComponentService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DynamicComponentService, deps: [{ token: i0.Injector }, { token: i1.Router }, { token: RESOLVING_COMPONENT_WAIT_TIME, optional: true }, { token: DynamicResolverService }], target: i0.ɵɵFactoryTarget.Injectable });
 DynamicComponentService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: DynamicComponentService, providedIn: 'root' });
@@ -10164,6 +10170,7 @@ class PluginsResolveService {
             .map(({ name, factory }) => factory[name]);
         this.loadModulesDynamically(remoteNgModules);
         this.refreshHooks();
+        this.markPluginsAsLoaded();
     }
     /**
      * Loads modules and handles hooking correctly.
@@ -10200,6 +10207,9 @@ class PluginsResolveService {
             }
         });
     }
+    markPluginsAsLoaded() {
+        this.dynamicComponent.markPluginsAsLoaded();
+    }
     /**
      * Loads a list of remotes so that a particular application can use them.
      * The request is made to the following address: /apps/<contextPath>/remoteEntry.js
@@ -10216,15 +10226,20 @@ class PluginsResolveService {
             if (remotes.hasOwnProperty(pluginId)) {
                 const moduleNames = remotes[pluginId];
                 const url = `/apps/${pluginId}/remoteEntry.js?nocache=${date.getTime()}`;
+                let atLeastOneModuleLoadedSuccessfully = false;
                 for (const moduleName of moduleNames) {
                     try {
                         remoteModules.push(await this.loadRemoteModule(url, pluginId, moduleName));
+                        atLeastOneModuleLoadedSuccessfully = true;
                     }
                     catch (ex) {
                         console.warn(`Could not load remote module '${moduleName}' from url:`, url);
                     }
                 }
-                await this.loadRemoteTranslations(pluginId);
+                // no need to load translations if we were unable to load a single module..
+                if (atLeastOneModuleLoadedSuccessfully) {
+                    await this.loadRemoteTranslations(pluginId);
+                }
             }
         }
         return remoteModules;
@@ -16361,6 +16376,7 @@ class BootstrapComponent {
     }
     async loadRemotes(remotes) {
         if (!remotes) {
+            this.ensureWeMarkPluginsAsLoaded();
             return;
         }
         const remoteModules = await this.pluginsResolve.loadRemotes(remotes);
@@ -16372,12 +16388,17 @@ class BootstrapComponent {
     }
     subscribeToLoadRemotes() {
         if (this.options.get('noPlugins', false)) {
+            this.ensureWeMarkPluginsAsLoaded();
             return;
         }
         this.ui.currentApplicationConfig
             .pipe(takeUntil(this.destroy$))
             .subscribe((config) => this.loadRemotes(this.getRemotes(config)));
     }
+    ensureWeMarkPluginsAsLoaded() {
+        // ensure we call markPluginsAsLoaded on the DynamicComponentService
+        this.pluginsResolve.markPluginsAsLoaded();
+    }
 }
 BootstrapComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.6", ngImport: i0, type: BootstrapComponent, deps: [{ token: TabsService }, { token: AppStateService }, { token: NavigatorService }, { token: ActionBarService }, { token: HeaderService }, { token: OptionsService }, { token: PluginsResolveService }, { token: SetupService }], target: i0.ɵɵFactoryTarget.Component });
 BootstrapComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.6", type: BootstrapComponent, selector: "c8y-bootstrap", ngImport: i0, template: "<c8y-login *ngIf=\"!noLogin && !(ui.currentUser | async)\"></c8y-login>\n\n<div\n  *ngIf=\"noLogin || ((ui.currentUser | async) && !(setupService.isSetupNeeded$ | async))\"\n  [class.head-open]=\"headerService.headerOpen\"\n>\n  <c8y-header-bar #header></c8y-header-bar>\n  <c8y-navigator-outlet\n    [nodes]=\"navigator.items$ | async\"\n    [open]=\"headerService.navigatorOpen$ | async\"\n    role=\"region\"\n    title=\"{{ 'Navigator menu' | translate }}\"\n  >\n    <header class=\"title navigator-slot-top\">\n      <div class=\"tenant-brand\"></div>\n      <c8y-app-icon\n        [name]=\"(ui.state$ | async).app.name\"\n        [contextPath]=\"(ui.state$ | async).app.contextPath\"\n      ></c8y-app-icon>\n      <span>{{ (ui.state$ | async).app | humanizeAppName | async }}</span>\n    </header>\n    <div class=\"powered-by navigator-slot-bottom\" *ngIf=\"showPoweredBy\">\n      <p translate>powered by Cumulocity</p>\n    </div>\n  </c8y-navigator-outlet>\n\n  <div class=\"alerts\">\n    <c8y-alert-outlet></c8y-alert-outlet>\n  </div>\n  <c8y-tabs-outlet\n    #tabsComponent\n    [tabs]=\"tabs.items$ | async\"\n    [navigatorOpen]=\"headerService.navigatorOpen$ | async\"\n    [orientation]=\"tabs.orientation$ | async\"\n    role=\"navigation\"\n  ></c8y-tabs-outlet>\n  <c8y-action-bar\n    #actionBarComponent\n    [navigatorOpen]=\"headerService.navigatorOpen$ | async\"\n    [hasTabs]=\"tabsComponent.hasTabs\"\n    [isTabsHorizontal]=\"tabsComponent?.isHorizontal\"\n    [items$]=\"actionBar.items$\"\n    role=\"group\"\n  ></c8y-action-bar>\n\n  <div\n    class=\"mcontainer\"\n    [ngClass]=\"{\n      open: headerService.navigatorOpen$ | async,\n      'no-apps-margin': noAppsMargin$ | async,\n      'horizontal-tabs': tabsComponent.isHorizontal,\n      'vertical-tabs': !tabsComponent.isHorizontal,\n      'has-tabs': tabsComponent.hasTabs,\n      'has-action-bar': !actionBarComponent?.hidden\n    }\"\n  >\n    <main id=\"main-content\" class=\"container-fluid\" tabindex=\"-1\">\n      <router-outlet></router-outlet>\n      <ng-content select=\"#c8y-legacy-view\"></ng-content>\n      <!-- legacy ng-view, will not be migrated atm -->\n    </main>\n  </div>\n</div>\n\n<div *ngIf=\"(ui.currentUser | async) && (setupService.isSetupNeeded$ | async)\">\n  <c8y-header-bar [simple]=\"true\"></c8y-header-bar>\n  <div class=\"mcontainer\" role=\"main\">\n    <div class=\"container-fluid\">\n      <c8y-setup></c8y-setup>\n    </div>\n  </div>\n</div>\n\n<c8y-cookie-banner></c8y-cookie-banner>\n", dependencies: [{ kind: "directive", type: C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "directive", type: i1$5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: HeaderBarComponent, selector: "c8y-header-bar", inputs: ["simple"] }, { kind: "component", type: AppIconComponent, selector: "c8y-app-icon", inputs: ["contextPath", "name", "app"] }, { kind: "component", type: LoginComponent, selector: "c8y-login", inputs: ["name"] }, { kind: "directive", type: i1.RouterOutlet, selector: "router-outlet", outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "component", type: TabsOutletComponent, selector: "c8y-tabs-outlet,c8y-ui-tabs", inputs: ["tabs", "orientation", "navigatorOpen"] }, { kind: "component", type: ActionBarComponent, selector: "c8y-action-bar", inputs: ["navigatorOpen", "hasTabs", "isTabsHorizontal", "items$"] }, { kind: "component", type: AlertOutletComponent, selector: "c8y-alert-outlet" }, { kind: "component", type: NavigatorOutletComponent, selector: "c8y-navigator-outlet, c8y-ui-navigator", inputs: ["nodes", "open"] }, { kind: "component", type: SetupComponent, selector: "c8y-setup" }, { kind: "component", type: CookieBannerComponent, selector: "c8y-cookie-banner" }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }, { kind: "pipe", type: i1$5.AsyncPipe, name: "async" }, { kind: "pipe", type: HumanizeAppNamePipe, name: "humanizeAppName" }] });