@c8y/ngx-components 1023.14.60 → 1023.14.68

package/fesm2022/c8y-ngx-components-context-dashboard.mjs

@@ -8,7 +8,7 @@ import { of, Subject, from, combineLatest, map as map$1, BehaviorSubject, tap as
 import { gettext } from '@c8y/ngx-components/gettext';
 import { __decorate, __metadata } from 'tslib';
 import * as i3 from '@angular/common';
-import { NgIf, NgTemplateOutlet, CommonModule, NgClass, AsyncPipe, NgForOf, NgFor } from '@angular/common';
+import { NgTemplateOutlet, CommonModule, NgClass, AsyncPipe, NgIf, NgForOf, NgFor } from '@angular/common';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import * as i6 from '@c8y/ngx-components/context-dashboard-state';
 import * as i2$1 from '@ngx-translate/core';
@@ -640,6 +640,9 @@ class ContextDashboardService {
         this.navigator.add(node);
     }
     getContextForGS(mo) {
+        if (!mo) {
+            return null;
+        }
         if (this.groupService.isDevice(mo)) {
             return PRODUCT_EXPERIENCE.DASHBOARD.CONTEXT.DEVICE;
         }
@@ -1254,7 +1257,8 @@ class DashboardDetailComponent {
         };
     }
     async cancel() {
-        if (!this.isEdit && !this.isReport) {
+        const isUnsavedDefaultDashboard = this.isNamedDashboard && !this.mo.id;
+        if (!this.isEdit && !this.isReport && !isUnsavedDefaultDashboard) {
             // dashboard creation in it's own tab- confirm and cleanup triggered in canDeactivate during routing
             this.tabsService.items$.pipe(first()).subscribe((tabs) => {
                 const tab = tabs.find(t => t.featureId !== newDashboardTab.featureId);
@@ -1344,11 +1348,17 @@ class DashboardDetailComponent {
         }
     }
     async createNewDashboard() {
+        const isUnsavedDefaultDashboard = this.isNamedDashboard && !this.mo.id;
         const mo = await this.contextDashboardService.create(this.dashboard, this.currentContext, this.isNamedDashboard ? this.dashboard.name : undefined);
         await this.onCreateGSEvent(mo);
         await this.clearNamedOutletPath();
         this.cleanupAfterDetailsClose();
-        await this.contextDashboardService.navigateToDashboard(mo, true);
+        if (!isUnsavedDefaultDashboard) {
+            await this.contextDashboardService.navigateToDashboard(mo, true);
+        }
+        else {
+            this.dashboardSaved.emit(mo);
+        }
     }
     async onCreateGSEvent(mo) {
         const parentName = await this.convertStringToHash(this.context?.name);
@@ -1524,7 +1534,7 @@ class DashboardDetailComponent {
         this.tabs = this.dashboardDetailService.getTabs();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DashboardDetailComponent, deps: [{ token: ContextDashboardService }, { token: i2$1.TranslateService }, { token: i2.ContextRouteService }, { token: i1.ActivatedRoute }, { token: i2.TabsService }, { token: i1.Router }, { token: i1$1.InventoryService }, { token: i1.ActivatedRoute }, { token: DashboardDetailService }, { token: i2.AppStateService }, { token: i2.GroupService }, { token: i2.ModalService }, { token: i2.GainsightService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.16", type: DashboardDetailComponent, isStandalone: true, selector: "c8y-dashboard-detail", inputs: { isReport: "isReport", deviceType: "deviceType", context: "context", mo: "mo", dashboard: "dashboard", isNamedDashboard: "isNamedDashboard", hideAvailability: "hideAvailability" }, outputs: { dashboardSaved: "dashboardSaved", previewChanged: "previewChanged" }, providers: [DashboardDetailService], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  <div\n    class=\"d-flex\"\n    *ngIf=\"!isCollapsed\"\n  >\n    <c8y-tabs-outlet\n      class=\"c8y-top-drawer--tabs\"\n      [tabs]=\"tabs\"\n      [outletName]=\"TABS_OUTLET_NAME\"\n      [orientation]=\"'vertical'\"\n      [openFirstTab]=\"true\"\n    ></c8y-tabs-outlet>\n\n    <div\n      class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n    >\n      <router-outlet name=\"dashboard-details\"></router-outlet>\n    </div>\n  </div>\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) || dashboardDetailService.saveButtonDisabled\"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TabsOutletComponent, selector: "c8y-tabs-outlet,c8y-ui-tabs", inputs: ["tabs", "orientation", "navigatorOpen", "outletName", "context", "openFirstTab", "hasHeader"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.16", type: DashboardDetailComponent, isStandalone: true, selector: "c8y-dashboard-detail", inputs: { isReport: "isReport", deviceType: "deviceType", context: "context", mo: "mo", dashboard: "dashboard", isNamedDashboard: "isNamedDashboard", hideAvailability: "hideAvailability" }, outputs: { dashboardSaved: "dashboardSaved", previewChanged: "previewChanged" }, providers: [DashboardDetailService], usesOnChanges: true, ngImport: i0, template: "<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  @if (!isCollapsed) {\n    <div class=\"d-flex\">\n      <c8y-tabs-outlet\n        class=\"c8y-top-drawer--tabs\"\n        [tabs]=\"tabs\"\n        [outletName]=\"TABS_OUTLET_NAME\"\n        [orientation]=\"'vertical'\"\n        [openFirstTab]=\"true\"\n      ></c8y-tabs-outlet>\n\n      <div\n        class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n      >\n        <router-outlet name=\"dashboard-details\"></router-outlet>\n      </div>\n    </div>\n  }\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"\n        ((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) ||\n        dashboardDetailService.saveButtonDisabled\n      \"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n", dependencies: [{ kind: "directive", type: CollapseDirective, selector: "[collapse]", inputs: ["display", "isAnimated", "collapse"], outputs: ["collapsed", "collapses", "expanded", "expands"], exportAs: ["bs-collapse"] }, { kind: "component", type: TabsOutletComponent, selector: "c8y-tabs-outlet,c8y-ui-tabs", inputs: ["tabs", "orientation", "navigatorOpen", "outletName", "context", "openFirstTab", "hasHeader"] }, { kind: "directive", type: RouterOutlet, selector: "router-outlet", inputs: ["name", "routerOutletData"], outputs: ["activate", "deactivate", "attach", "detach"], exportAs: ["outlet"] }, { kind: "pipe", type: C8yTranslatePipe, name: "translate" }] }); }
 }
 __decorate([
     memoize(),
@@ -1534,7 +1544,7 @@ __decorate([
 ], DashboardDetailComponent.prototype, "convertStringToHash", null);
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.16", ngImport: i0, type: DashboardDetailComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'c8y-dashboard-detail', providers: [DashboardDetailService], imports: [CollapseDirective, NgIf, TabsOutletComponent, RouterOutlet, C8yTranslatePipe], template: "<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  <div\n    class=\"d-flex\"\n    *ngIf=\"!isCollapsed\"\n  >\n    <c8y-tabs-outlet\n      class=\"c8y-top-drawer--tabs\"\n      [tabs]=\"tabs\"\n      [outletName]=\"TABS_OUTLET_NAME\"\n      [orientation]=\"'vertical'\"\n      [openFirstTab]=\"true\"\n    ></c8y-tabs-outlet>\n\n    <div\n      class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n    >\n      <router-outlet name=\"dashboard-details\"></router-outlet>\n    </div>\n  </div>\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) || dashboardDetailService.saveButtonDisabled\"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n" }]
+            args: [{ selector: 'c8y-dashboard-detail', providers: [DashboardDetailService], imports: [CollapseDirective, TabsOutletComponent, RouterOutlet, C8yTranslatePipe], template: "<div\n  class=\"collapse c8y-top-drawer\"\n  [collapse]=\"isCollapsed\"\n  [isAnimated]=\"true\"\n>\n  <div class=\"p-t-16 p-b-16 p-l-24 p-r-24 separator-bottom\">\n    <span class=\"h4\">{{ 'Dashboard settings' | translate }}</span>\n  </div>\n\n  @if (!isCollapsed) {\n    <div class=\"d-flex\">\n      <c8y-tabs-outlet\n        class=\"c8y-top-drawer--tabs\"\n        [tabs]=\"tabs\"\n        [outletName]=\"TABS_OUTLET_NAME\"\n        [orientation]=\"'vertical'\"\n        [openFirstTab]=\"true\"\n      ></c8y-tabs-outlet>\n\n      <div\n        class=\"inner-scroll c8y-top-drawer__tabs-container flex-grow p-l-24 p-r-lg-32 p-r-xs-24 p-r-sm-24\"\n      >\n        <router-outlet name=\"dashboard-details\"></router-outlet>\n      </div>\n    </div>\n  }\n\n  <div class=\"c8y-top-drawer--footer\">\n    <button\n      class=\"btn btn-default\"\n      title=\"{{ 'Cancel' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--cancel-dashboard\"\n      (click)=\"cancel()\"\n    >\n      {{ 'Cancel' | translate }}\n    </button>\n    <button\n      class=\"btn btn-primary\"\n      title=\"{{ 'Save' | translate }}\"\n      type=\"button\"\n      data-cy=\"dashboard-detail--save-dashboard\"\n      (click)=\"save()\"\n      [disabled]=\"\n        ((dashboardDetailsForm?.invalid || dashboardDetailsForm?.pristine) && this.isEdit) ||\n        dashboardDetailService.saveButtonDisabled\n      \"\n    >\n      {{ 'Save' | translate }}\n    </button>\n  </div>\n</div>\n" }]
         }], ctorParameters: () => [{ type: ContextDashboardService }, { type: i2$1.TranslateService }, { type: i2.ContextRouteService }, { type: i1.ActivatedRoute }, { type: i2.TabsService }, { type: i1.Router }, { type: i1$1.InventoryService }, { type: i1.ActivatedRoute }, { type: DashboardDetailService }, { type: i2.AppStateService }, { type: i2.GroupService }, { type: i2.ModalService }, { type: i2.GainsightService }], propDecorators: { isReport: [{
                 type: Input
             }], deviceType: [{