@lowcodeunit/applications-flow-common 1.33.178-lets-get-social-ish → 1.33.181-lets-get-social-ish

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -40,6 +40,7 @@ import * as i6$1 from '@angular/material/checkbox';
40
40
  import * as i1$3 from '@angular/cdk/layout';
41
41
  import * as i3 from 'skeleton-elements/angular';
42
42
  import { SkeletonElementsModule } from 'skeleton-elements/angular';
43
+ import moment from 'moment';
43
44
  import { EaCApplicationAsCode } from '@semanticjs/common';
44
45
  import * as i1$4 from '@angular/material/dialog';
45
46
  import { MAT_DIALOG_DATA } from '@angular/material/dialog';
@@ -446,21 +447,20 @@ class ProjectService {
446
447
  GetActiveEnterprise(state) {
447
448
  return __awaiter(this, void 0, void 0, function* () {
448
449
  return new Promise((resolve, reject) => {
449
- state.Loading = true;
450
+ state.LoadingActiveEnterprise = true;
450
451
  this.appsFlowSvc.GetActiveEnterprise().subscribe((response) => __awaiter(this, void 0, void 0, function* () {
451
452
  var _a;
453
+ state.LoadingActiveEnterprise = false;
452
454
  if (response.Status.Code === 0) {
453
455
  state.ActiveEnterpriseLookup = (_a = response.Model) === null || _a === void 0 ? void 0 : _a.Lookup;
454
- state.Loading = false;
455
456
  resolve();
456
457
  }
457
458
  else {
458
- state.Loading = false;
459
459
  reject(response.Status);
460
460
  console.log(response);
461
461
  }
462
462
  }), (err) => {
463
- state.Loading = false;
463
+ state.LoadingActiveEnterprise = false;
464
464
  reject(err);
465
465
  console.log(err);
466
466
  });
@@ -487,9 +487,9 @@ class ProjectService {
487
487
  ListEnterprises(state) {
488
488
  return __awaiter(this, void 0, void 0, function* () {
489
489
  return new Promise((resolve, reject) => {
490
- state.Loading = true;
490
+ state.LoadingEnterprises = true;
491
491
  this.appsFlowSvc.ListEnterprises().subscribe((response) => __awaiter(this, void 0, void 0, function* () {
492
- state.Loading = false;
492
+ state.LoadingEnterprises = false;
493
493
  if (response.Status.Code === 0) {
494
494
  state.Enterprises = response.Model;
495
495
  resolve(response.Model);
@@ -499,7 +499,7 @@ class ProjectService {
499
499
  console.log(response);
500
500
  }
501
501
  }), (err) => {
502
- state.Loading = false;
502
+ state.LoadingEnterprises = false;
503
503
  reject(err);
504
504
  console.log(err);
505
505
  });
@@ -3701,10 +3701,10 @@ class ProjectInfoCardComponent {
3701
3701
  }
3702
3702
  }
3703
3703
  ProjectInfoCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: ProjectInfoCardComponent, deps: [{ token: EaCService }], target: i0.ɵɵFactoryTarget.Component });
3704
- ProjectInfoCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: ProjectInfoCardComponent, selector: "lcu-project-info-card", inputs: { Description: ["description", "Description"], Image: ["image", "Image"], IsEditable: ["is-editable", "IsEditable"], IsShareable: ["is-shareable", "IsShareable"], Name: ["name", "Name"], Subtext: ["subtext", "Subtext"] }, outputs: { LeftClickEvent: "left-click-event", RightClickEvent: "right-click-event" }, ngImport: i0, template: "<mat-card class=\"project-info-card\">\n\n <!-- SKELETON CONTENT -->\n <ng-container *ngIf=\"State?.Loading\">\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <skeleton-avatar class=\"round-project-img\" [effect]=\"SkeletonEffect\" [size]=\"75\" ></skeleton-avatar >\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"project-card-name\" \n >\n Name of card\n </mat-card-title>\n\n <mat-card-subtitle \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"project-card-description\" \n >\n Description Text\n </mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <div \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"host-anchor\" \n >\n https://www.fathym.com\n </div>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div skeleton-block [effect]=\"SkeletonEffect\" class=\"stats-container\">\n </div>\n\n <div \n class=\"promo-container-skeleton\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n >\n \n <div \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"skeleton-item\"\n >\n Access exclusive tools & insights\n </div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">emoji_events</mat-icon>\n\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" >\n Upgrade to premium now\n </div>\n </div>\n </div>\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container-skeleton\" fxLayoutAlign=\"center center\">\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" action mat-button >\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">outbox</mat-icon>\n Unpack\n </div>\n \n </mat-card-actions>\n </ng-container>\n <!-- END SKELETON CONTENT -->\n\n <!-- ACTUAL CONTENT -->\n\n<ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <div class=\"round-project-img\" fxLayoutAlign=\"center center\">\n <mat-icon *ngIf=\"!Image\" class=\"temp-icon\">flutter_dash</mat-icon>\n <img *ngIf=\"Image\" [src]=\"Image\" [alt]=\"Name\" style=\"width:75px; height:75px\">\n </div>\n </div>\n\n <div class=\"icon-btn-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" >\n <button *ngIf=\"IsEditable\" mat-icon-button id=\"left-icon\" (click)=\"LeftIconClicked()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button *ngIf=\"IsShareable\" mat-icon-button id=\"right-icon\" (click)=\"RightIconClicked()\">\n <mat-icon>share</mat-icon>\n </button>\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title class=\"project-card-name\" *ngIf=\"Name\">{{Name}}</mat-card-title>\n\n <mat-card-subtitle class=\"project-card-description\" *ngIf=\"Description\">{{Description}}</mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <a class=\"host-anchor\" *ngIf=\"Subtext\" [href]=\"'https://'+Subtext\" target=\"_blank\">{{Subtext}}</a>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div class=\"stats-container\">\n <ng-content select=\"[stats]\"></ng-content>\n </div>\n\n <!-- <div class=\"promo-container\"> -->\n <!-- <ng-content select=\"[promo]\"></ng-content> -->\n <div class=\"promo-container\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n \n >\n \n <div>Access exclusive tools & insights</div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon class=\"gold-icon\">emoji_events</mat-icon>\n\n <div class=\"upgrade-text\" (click)=\"UpgradeClicked()\">\n Upgrade to premium now\n </div>\n </div>\n </div>\n <!-- </div> -->\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container\">\n <ng-content select=\"[action]\"></ng-content>\n \n </mat-card-actions>\n </ng-container>\n </mat-card>\n \n", styles: [".project-info-card{margin:32px 20px;padding:0}.round-project-img{background-color:#dfeff2;width:75px;height:75px;border-radius:40px;text-align:center;margin-top:20px;border:2px solid white}.temp-icon{height:50px;width:50px;font-size:50px}.icon-btn-container{margin:5px}.project-card-header{text-align:center;margin-top:50px}.host-anchor{text-decoration:none;color:#4a918e}.header-img-container{background-color:#a4bab3;height:60px;border-radius:2px 2px 0 0;margin-top:-.5px!important;margin-right:-.5px;justify-content:center}.project-card-name{font-size:17px;font-weight:600}.card-content-container{margin-bottom:0!important}.stats-container{border-top:1px solid #d3d3d3}.gold-icon{color:#d4af37}.upgrade-text{font-weight:700;margin-left:10px;cursor:pointer}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.promo-container-skeleton{margin:5px}.actions-container{padding:0!important}.actions-container-skeleton{padding:0!important;border-top:1px solid #d3d3d3}.info-card-btn{width:100%;border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3}.skeleton-item{margin:5px}\n"], components: [{ type: i2$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i3.SkeletonAvatarComponent, selector: "skeleton-avatar", inputs: ["size", "color", "showIcon", "iconColor", "borderRadius", "effect"] }, { type: i2$1.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }, { type: i2$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { type: i2$1.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i2$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }] });
3704
+ ProjectInfoCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: ProjectInfoCardComponent, selector: "lcu-project-info-card", inputs: { Description: ["description", "Description"], Image: ["image", "Image"], IsEditable: ["is-editable", "IsEditable"], IsShareable: ["is-shareable", "IsShareable"], Name: ["name", "Name"], Subtext: ["subtext", "Subtext"] }, outputs: { LeftClickEvent: "left-click-event", RightClickEvent: "right-click-event" }, ngImport: i0, template: "<mat-card class=\"project-info-card\">\n\n <!-- SKELETON CONTENT -->\n <ng-container *ngIf=\"State?.Loading\">\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <skeleton-avatar class=\"round-project-img\" [effect]=\"SkeletonEffect\" [size]=\"75\" ></skeleton-avatar >\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"project-card-name\" \n >\n Name of card\n </mat-card-title>\n\n <mat-card-subtitle \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"project-card-description\" \n >\n Description Text\n </mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <div \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"host-anchor\" \n >\n https://www.fathym.com\n </div>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div skeleton-block [effect]=\"SkeletonEffect\" class=\"stats-container\">\n </div>\n\n <div \n class=\"promo-container-skeleton\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n >\n \n <div \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"skeleton-item\"\n >\n Access exclusive tools & insights\n </div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">emoji_events</mat-icon>\n\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" >\n Upgrade to premium now\n </div>\n </div>\n </div>\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container-skeleton\" fxLayoutAlign=\"center center\">\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" action mat-button >\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">outbox</mat-icon>\n Unpack\n </div>\n \n </mat-card-actions>\n </ng-container>\n <!-- END SKELETON CONTENT -->\n\n <!-- ACTUAL CONTENT -->\n\n<ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <div class=\"round-project-img\" fxLayoutAlign=\"center center\">\n <mat-icon *ngIf=\"!Image\" class=\"temp-icon\">flutter_dash</mat-icon>\n <img *ngIf=\"Image\" [src]=\"Image\" [alt]=\"Name\" style=\"width:75px; height:75px\">\n </div>\n </div>\n\n <div class=\"icon-btn-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" >\n <button *ngIf=\"IsEditable\" mat-icon-button id=\"left-icon\" (click)=\"LeftIconClicked()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button *ngIf=\"IsShareable\" mat-icon-button id=\"right-icon\" (click)=\"RightIconClicked()\">\n <mat-icon>share</mat-icon>\n </button>\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title class=\"project-card-name\" *ngIf=\"Name\">{{Name}}</mat-card-title>\n\n <mat-card-subtitle class=\"project-card-description\" *ngIf=\"Description\">{{Description}}</mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <a class=\"host-anchor\" *ngIf=\"Subtext\" [href]=\"'https://'+Subtext\" target=\"_blank\">{{Subtext}}</a>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div class=\"stats-container\">\n <ng-content select=\"[stats]\"></ng-content>\n </div>\n\n <!-- <div class=\"promo-container\"> -->\n <!-- <ng-content select=\"[promo]\"></ng-content> -->\n <div class=\"promo-container\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n \n >\n \n <div>Access exclusive tools & insights</div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon class=\"gold-icon\">emoji_events</mat-icon>\n\n <div class=\"upgrade-text\" (click)=\"UpgradeClicked()\">\n Upgrade to premium now\n </div>\n </div>\n </div>\n <!-- </div> -->\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container\">\n <ng-content select=\"[action]\"></ng-content>\n \n </mat-card-actions>\n </ng-container>\n </mat-card>\n \n", styles: [".project-info-card{margin:.5em;padding:0}.round-project-img{background-color:#dfeff2;width:75px;height:75px;border-radius:40px;text-align:center;margin-top:20px;border:2px solid white}.temp-icon{height:50px;width:50px;font-size:50px}.icon-btn-container{margin:5px}.project-card-header{text-align:center;margin-top:50px}.host-anchor{text-decoration:none;color:#4a918e}.header-img-container{background-color:#a4bab3;height:60px;border-radius:2px 2px 0 0;margin-top:-.5px!important;margin-right:-.5px;justify-content:center}.project-card-name{font-size:17px;font-weight:600}.card-content-container{margin-bottom:0!important}.stats-container{border-top:1px solid #d3d3d3}.gold-icon{color:#d4af37}.upgrade-text{font-weight:700;margin-left:10px;cursor:pointer}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.promo-container-skeleton{margin:5px}.actions-container{padding:0!important}.actions-container-skeleton{padding:0!important;border-top:1px solid #d3d3d3}.info-card-btn{width:100%;border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3}.skeleton-item{margin:5px}\n"], components: [{ type: i2$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i3.SkeletonAvatarComponent, selector: "skeleton-avatar", inputs: ["size", "color", "showIcon", "iconColor", "borderRadius", "effect"] }, { type: i2$1.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i5$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }, { type: i2$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }, { type: i2$1.MatCardContent, selector: "mat-card-content, [mat-card-content], [matCardContent]" }, { type: i2$1.MatCardActions, selector: "mat-card-actions", inputs: ["align"], exportAs: ["matCardActions"] }] });
3705
3705
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: ProjectInfoCardComponent, decorators: [{
3706
3706
  type: Component,
3707
- args: [{ selector: 'lcu-project-info-card', template: "<mat-card class=\"project-info-card\">\n\n <!-- SKELETON CONTENT -->\n <ng-container *ngIf=\"State?.Loading\">\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <skeleton-avatar class=\"round-project-img\" [effect]=\"SkeletonEffect\" [size]=\"75\" ></skeleton-avatar >\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"project-card-name\" \n >\n Name of card\n </mat-card-title>\n\n <mat-card-subtitle \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"project-card-description\" \n >\n Description Text\n </mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <div \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"host-anchor\" \n >\n https://www.fathym.com\n </div>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div skeleton-block [effect]=\"SkeletonEffect\" class=\"stats-container\">\n </div>\n\n <div \n class=\"promo-container-skeleton\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n >\n \n <div \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"skeleton-item\"\n >\n Access exclusive tools & insights\n </div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">emoji_events</mat-icon>\n\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" >\n Upgrade to premium now\n </div>\n </div>\n </div>\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container-skeleton\" fxLayoutAlign=\"center center\">\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" action mat-button >\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">outbox</mat-icon>\n Unpack\n </div>\n \n </mat-card-actions>\n </ng-container>\n <!-- END SKELETON CONTENT -->\n\n <!-- ACTUAL CONTENT -->\n\n<ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <div class=\"round-project-img\" fxLayoutAlign=\"center center\">\n <mat-icon *ngIf=\"!Image\" class=\"temp-icon\">flutter_dash</mat-icon>\n <img *ngIf=\"Image\" [src]=\"Image\" [alt]=\"Name\" style=\"width:75px; height:75px\">\n </div>\n </div>\n\n <div class=\"icon-btn-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" >\n <button *ngIf=\"IsEditable\" mat-icon-button id=\"left-icon\" (click)=\"LeftIconClicked()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button *ngIf=\"IsShareable\" mat-icon-button id=\"right-icon\" (click)=\"RightIconClicked()\">\n <mat-icon>share</mat-icon>\n </button>\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title class=\"project-card-name\" *ngIf=\"Name\">{{Name}}</mat-card-title>\n\n <mat-card-subtitle class=\"project-card-description\" *ngIf=\"Description\">{{Description}}</mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <a class=\"host-anchor\" *ngIf=\"Subtext\" [href]=\"'https://'+Subtext\" target=\"_blank\">{{Subtext}}</a>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div class=\"stats-container\">\n <ng-content select=\"[stats]\"></ng-content>\n </div>\n\n <!-- <div class=\"promo-container\"> -->\n <!-- <ng-content select=\"[promo]\"></ng-content> -->\n <div class=\"promo-container\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n \n >\n \n <div>Access exclusive tools & insights</div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon class=\"gold-icon\">emoji_events</mat-icon>\n\n <div class=\"upgrade-text\" (click)=\"UpgradeClicked()\">\n Upgrade to premium now\n </div>\n </div>\n </div>\n <!-- </div> -->\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container\">\n <ng-content select=\"[action]\"></ng-content>\n \n </mat-card-actions>\n </ng-container>\n </mat-card>\n \n", styles: [".project-info-card{margin:32px 20px;padding:0}.round-project-img{background-color:#dfeff2;width:75px;height:75px;border-radius:40px;text-align:center;margin-top:20px;border:2px solid white}.temp-icon{height:50px;width:50px;font-size:50px}.icon-btn-container{margin:5px}.project-card-header{text-align:center;margin-top:50px}.host-anchor{text-decoration:none;color:#4a918e}.header-img-container{background-color:#a4bab3;height:60px;border-radius:2px 2px 0 0;margin-top:-.5px!important;margin-right:-.5px;justify-content:center}.project-card-name{font-size:17px;font-weight:600}.card-content-container{margin-bottom:0!important}.stats-container{border-top:1px solid #d3d3d3}.gold-icon{color:#d4af37}.upgrade-text{font-weight:700;margin-left:10px;cursor:pointer}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.promo-container-skeleton{margin:5px}.actions-container{padding:0!important}.actions-container-skeleton{padding:0!important;border-top:1px solid #d3d3d3}.info-card-btn{width:100%;border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3}.skeleton-item{margin:5px}\n"] }]
3707
+ args: [{ selector: 'lcu-project-info-card', template: "<mat-card class=\"project-info-card\">\n\n <!-- SKELETON CONTENT -->\n <ng-container *ngIf=\"State?.Loading\">\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <skeleton-avatar class=\"round-project-img\" [effect]=\"SkeletonEffect\" [size]=\"75\" ></skeleton-avatar >\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"project-card-name\" \n >\n Name of card\n </mat-card-title>\n\n <mat-card-subtitle \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"project-card-description\" \n >\n Description Text\n </mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <div \n skeleton-text \n [effect]=\"SkeletonEffect\" \n class=\"host-anchor\" \n >\n https://www.fathym.com\n </div>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div skeleton-block [effect]=\"SkeletonEffect\" class=\"stats-container\">\n </div>\n\n <div \n class=\"promo-container-skeleton\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n >\n \n <div \n skeleton-text \n [effect]=\"SkeletonEffect\"\n class=\"skeleton-item\"\n >\n Access exclusive tools & insights\n </div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">emoji_events</mat-icon>\n\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" >\n Upgrade to premium now\n </div>\n </div>\n </div>\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container-skeleton\" fxLayoutAlign=\"center center\">\n <div skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\" action mat-button >\n <mat-icon skeleton-text [effect]=\"SkeletonEffect\" class=\"skeleton-item\">outbox</mat-icon>\n Unpack\n </div>\n \n </mat-card-actions>\n </ng-container>\n <!-- END SKELETON CONTENT -->\n\n <!-- ACTUAL CONTENT -->\n\n<ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"header-img-container\" fxLayout=\"row\" >\n <div class=\"round-project-img\" fxLayoutAlign=\"center center\">\n <mat-icon *ngIf=\"!Image\" class=\"temp-icon\">flutter_dash</mat-icon>\n <img *ngIf=\"Image\" [src]=\"Image\" [alt]=\"Name\" style=\"width:75px; height:75px\">\n </div>\n </div>\n\n <div class=\"icon-btn-container\" fxLayout=\"row\" fxLayoutAlign=\"space-between center\" >\n <button *ngIf=\"IsEditable\" mat-icon-button id=\"left-icon\" (click)=\"LeftIconClicked()\">\n <mat-icon>edit</mat-icon>\n </button>\n <button *ngIf=\"IsShareable\" mat-icon-button id=\"right-icon\" (click)=\"RightIconClicked()\">\n <mat-icon>share</mat-icon>\n </button>\n </div>\n\n <mat-card-header class=\"project-card-header\" fxLayoutAlign=\"center center\">\n\n <mat-card-title class=\"project-card-name\" *ngIf=\"Name\">{{Name}}</mat-card-title>\n\n <mat-card-subtitle class=\"project-card-description\" *ngIf=\"Description\">{{Description}}</mat-card-subtitle>\n\n <mat-card-subtitle class=\"project-card-host\">\n <a class=\"host-anchor\" *ngIf=\"Subtext\" [href]=\"'https://'+Subtext\" target=\"_blank\">{{Subtext}}</a>\n </mat-card-subtitle>\n\n </mat-card-header>\n <mat-card-content class=\"card-content-container\">\n <div class=\"stats-container\">\n <ng-content select=\"[stats]\"></ng-content>\n </div>\n\n <!-- <div class=\"promo-container\"> -->\n <!-- <ng-content select=\"[promo]\"></ng-content> -->\n <div class=\"promo-container\" \n fxLayout=\"column\" \n fxLayoutAlign=\"center center\" \n \n >\n \n <div>Access exclusive tools & insights</div>\n\n <div fxLayout=\"row\" fxLayoutAlign=\"start center\">\n <mat-icon class=\"gold-icon\">emoji_events</mat-icon>\n\n <div class=\"upgrade-text\" (click)=\"UpgradeClicked()\">\n Upgrade to premium now\n </div>\n </div>\n </div>\n <!-- </div> -->\n\n </mat-card-content>\n <mat-card-actions class=\"actions-container\">\n <ng-content select=\"[action]\"></ng-content>\n \n </mat-card-actions>\n </ng-container>\n </mat-card>\n \n", styles: [".project-info-card{margin:.5em;padding:0}.round-project-img{background-color:#dfeff2;width:75px;height:75px;border-radius:40px;text-align:center;margin-top:20px;border:2px solid white}.temp-icon{height:50px;width:50px;font-size:50px}.icon-btn-container{margin:5px}.project-card-header{text-align:center;margin-top:50px}.host-anchor{text-decoration:none;color:#4a918e}.header-img-container{background-color:#a4bab3;height:60px;border-radius:2px 2px 0 0;margin-top:-.5px!important;margin-right:-.5px;justify-content:center}.project-card-name{font-size:17px;font-weight:600}.card-content-container{margin-bottom:0!important}.stats-container{border-top:1px solid #d3d3d3}.gold-icon{color:#d4af37}.upgrade-text{font-weight:700;margin-left:10px;cursor:pointer}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.promo-container-skeleton{margin:5px}.actions-container{padding:0!important}.actions-container-skeleton{padding:0!important;border-top:1px solid #d3d3d3}.info-card-btn{width:100%;border-radius:0 0 2px 2px;border-top:1px solid #d3d3d3}.skeleton-item{margin:5px}\n"] }]
3708
3708
  }], ctorParameters: function () { return [{ type: EaCService }]; }, propDecorators: { Description: [{
3709
3709
  type: Input,
3710
3710
  args: ['description']
@@ -3861,15 +3861,19 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImpor
3861
3861
  class MainFeedCardComponent {
3862
3862
  constructor() { }
3863
3863
  ngOnInit() { }
3864
+ // API Methods
3865
+ CalculateTimelapse(timestamp) {
3866
+ return moment(timestamp).fromNow();
3867
+ }
3864
3868
  HandleAction(action) {
3865
3869
  console.log('Action clicked');
3866
3870
  }
3867
3871
  }
3868
3872
  MainFeedCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: MainFeedCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
3869
- MainFeedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: MainFeedCardComponent, selector: "lcu-main-feed-card", inputs: { FeedItem: ["feed-item", "FeedItem"] }, ngImport: i0, template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ FeedItem.Timestamp }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"], components: [{ type: i2$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i2$1.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i2$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }] });
3873
+ MainFeedCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: MainFeedCardComponent, selector: "lcu-main-feed-card", inputs: { FeedItem: ["feed-item", "FeedItem"] }, ngImport: i0, template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ CalculateTimelapse(FeedItem.Timestamp) }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"], components: [{ type: i2$1.MatCard, selector: "mat-card", exportAs: ["matCard"] }, { type: i2$1.MatCardHeader, selector: "mat-card-header" }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], directives: [{ type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i2$1.MatCardAvatar, selector: "[mat-card-avatar], [matCardAvatar]" }, { type: i2$1.MatCardTitle, selector: "mat-card-title, [mat-card-title], [matCardTitle]" }, { type: i2$1.MatCardSubtitle, selector: "mat-card-subtitle, [mat-card-subtitle], [matCardSubtitle]" }] });
3870
3874
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: MainFeedCardComponent, decorators: [{
3871
3875
  type: Component,
3872
- args: [{ selector: 'lcu-main-feed-card', template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ FeedItem.Timestamp }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"] }]
3876
+ args: [{ selector: 'lcu-main-feed-card', template: "<mat-card class=\"social-card\">\n <mat-card-header>\n <img\n mat-card-avatar\n class=\"example-header-image\"\n [src]=\"FeedItem.Avatar\"\n *ngIf=\"FeedItem.Avatar\"\n />\n\n <mat-card-title *ngIf=\"FeedItem.Title\">{{ FeedItem.Title }}</mat-card-title>\n\n <mat-card-subtitle>\n <div *ngIf=\"FeedItem.Subtitle\">{{ FeedItem.Subtitle }}</div>\n <div *ngIf=\"FeedItem.Status\">\n <mat-icon *ngIf=\"Icon\" [style.color]=\"IconColor\">{{ Icon }}</mat-icon>\n\n <div *ngIf=\"FeedItem.Timestamp\">{{ CalculateTimelapse(FeedItem.Timestamp) }}</div>\n </div>\n </mat-card-subtitle>\n </mat-card-header>\n\n <div *ngIf=\"!FeedItem.IsShortForm\">\n <!-- <div class=\"feed-card-container\">\n <div class=\"feed-card-main-content\">\n The tab content (only 1 'tab' for now)... So really we don't need to worry about tabs until a future iteration\n\n The tabs property will contain a data structure that will vary by the FeedItem.Type... That structure can be used to render the content\n </div>\n </div> -->\n </div>\n\n <!-- <mat-card-actions fxLayout=\"row\" fxLayoutAlign=\"space-around center\">\n Actions will be provided\n </mat-card-actions> -->\n</mat-card>\n", styles: [".social-card{margin:20px;padding:15px 5px}mat-card-actions{margin-bottom:-1px!important;margin-left:0!important;margin-right:-.5px!important}.main-slot-container{padding:10px}.slot-header{align-items:center}.slot-content{width:100%}.slot-name{font-size:13px;font-weight:600}.slot-description{font-size:12px;margin-right:10px}.slot-action-anchor{font-size:10px;text-decoration:none;color:#000}.action-icon{height:25px;width:25px;font-size:25px;cursor:pointer}.example-header-image{background-size:cover}\n"] }]
3873
3877
  }], ctorParameters: function () { return []; }, propDecorators: { FeedItem: [{
3874
3878
  type: Input,
3875
3879
  args: ['feed-item']
@@ -5152,6 +5156,10 @@ class BreadcrumbComponent {
5152
5156
  get CurrentRouteApplicationLookups() {
5153
5157
  return Object.keys(this.RoutedApplications[this.SelectedRoute] || {});
5154
5158
  }
5159
+ get Loading() {
5160
+ var _a, _b;
5161
+ return ((_a = this.State) === null || _a === void 0 ? void 0 : _a.LoadingActiveEnterprise) || ((_b = this.State) === null || _b === void 0 ? void 0 : _b.LoadingEnterprises);
5162
+ }
5155
5163
  get Projects() {
5156
5164
  var _a, _b;
5157
5165
  return ((_b = (_a = this.State) === null || _a === void 0 ? void 0 : _a.EaC) === null || _b === void 0 ? void 0 : _b.Projects) || {};
@@ -5227,10 +5235,10 @@ class BreadcrumbComponent {
5227
5235
  }
5228
5236
  }
5229
5237
  BreadcrumbComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: EaCService }], target: i0.ɵɵFactoryTarget.Component });
5230
- BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: BreadcrumbComponent, selector: "lcu-breadcrumb", inputs: { ApplicationLookup: ["application-lookup", "ApplicationLookup"], ProjectLookup: ["project-lookup", "ProjectLookup"], SelectedRoute: ["selected-route", "SelectedRoute"] }, ngImport: i0, template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Enterprise Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading && Enterprise\">\n <div class=\"crumb-name\" [routerLink]=\"['/enterprises']\">{{Enterprise?.Name}}</div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"enterpriseMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #enterpriseMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n [routerLink]=\"['/enterprises']\"\n (click)=\"SetActiveEnterprise(ent.Lookup)\"\n *ngFor=\"let ent of State.Enterprises\"\n >\n <span>{{ ent.Name }}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"ProjectLookup && SelectedProject\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Project Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/projects', ProjectLookup]\"\n >\n {{SelectedProject?.Project?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"projectMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n \n \n <mat-menu #projectMenu=\"matMenu\" xPosition=\"before\">\n <button \n mat-menu-item \n *ngFor=\"let projectLookup of ProjectLookups\" \n [routerLink]=\"['/projects', projectLookup]\"\n >\n <span *ngIf=\"Projects[projectLookup]; let pro;\">{{pro.Project?.Name}}</span>\n </button>\n </mat-menu>\n\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Route Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\"\n >\n {{SelectedRoute}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #routeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appRoute of Routes\" [routerLink]=\"['/routes', appRoute, ProjectLookup]\">\n <span *ngIf=\"appRoute\">{{appRoute}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedApplication && ApplicationLookup\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Application Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"crumb-name\" \n [routerLink]=\"['/applications', ApplicationLookup, SelectedRoute, ProjectLookup]\"\n >\n {{SelectedApplication?.Application?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"applicationMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #applicationMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appLookup of CurrentRouteApplicationLookups\"\n [routerLink]=\"['/applications', appLookup, SelectedRoute, ProjectLookup]\">\n <span *ngIf=\"RoutedApplications[SelectedRoute][appLookup];\n let app\">{{app.Application?.Name}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n\n</div>", styles: [".breadcrumb-container{background-color:#ebecf0;margin:10px 30px}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}\n"], components: [{ type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i5$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }, { type: i8$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i4$4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
5238
+ BreadcrumbComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.2.2", type: BreadcrumbComponent, selector: "lcu-breadcrumb", inputs: { ApplicationLookup: ["application-lookup", "ApplicationLookup"], ProjectLookup: ["project-lookup", "ProjectLookup"], SelectedRoute: ["selected-route", "SelectedRoute"] }, ngImport: i0, template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n <ng-container *ngIf=\"Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Enterprise Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!Loading && Enterprise\">\n <div class=\"crumb-name\" [routerLink]=\"['/enterprises']\">\n {{ Enterprise?.Name }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"enterpriseMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #enterpriseMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n [routerLink]=\"['/enterprises']\"\n (click)=\"SetActiveEnterprise(ent.Lookup)\"\n *ngFor=\"let ent of State.Enterprises\"\n >\n <span>{{ ent.Name }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n\n <div\n *ngIf=\"ProjectLookup && SelectedProject\"\n fxLayout=\"row\"\n fxLayoutAlign=\"center center\"\n >\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Project Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div class=\"crumb-name\" [routerLink]=\"['/projects', ProjectLookup]\">\n {{ SelectedProject?.Project?.Name }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"projectMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #projectMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n *ngFor=\"let projectLookup of ProjectLookups\"\n [routerLink]=\"['/projects', projectLookup]\"\n >\n <span *ngIf=\"Projects[projectLookup]; let pro\">{{\n pro.Project?.Name\n }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n\n <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Route Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div\n class=\"crumb-name\"\n [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\"\n >\n {{ SelectedRoute }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #routeMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n *ngFor=\"let appRoute of Routes\"\n [routerLink]=\"['/routes', appRoute, ProjectLookup]\"\n >\n <span *ngIf=\"appRoute\">{{ appRoute }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n\n <div\n *ngIf=\"SelectedApplication && ApplicationLookup\"\n fxLayout=\"row\"\n fxLayoutAlign=\"center center\"\n >\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Application Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div\n class=\"crumb-name\"\n [routerLink]=\"[\n '/applications',\n ApplicationLookup,\n SelectedRoute,\n ProjectLookup\n ]\"\n >\n {{ SelectedApplication?.Application?.Name }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"applicationMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #applicationMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n *ngFor=\"let appLookup of CurrentRouteApplicationLookups\"\n [routerLink]=\"[\n '/applications',\n appLookup,\n SelectedRoute,\n ProjectLookup\n ]\"\n >\n <span *ngIf=\"RoutedApplications[SelectedRoute][appLookup]; let app\">{{\n app.Application?.Name\n }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n</div>\n", styles: [".breadcrumb-container{background-color:#ebecf0;margin:.5em}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}\n"], components: [{ type: i2$2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { type: i5.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { type: i4$4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { type: i4$4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }], directives: [{ type: i5$1.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { type: i5$1.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.SkeletonTextDirective, selector: "[skeleton-text]", inputs: ["effect"] }, { type: i8$1.RouterLink, selector: ":not(a):not(area)[routerLink]", inputs: ["queryParams", "fragment", "queryParamsHandling", "preserveFragment", "skipLocationChange", "replaceUrl", "state", "relativeTo", "routerLink"] }, { type: i4$4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }] });
5231
5239
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.2.2", ngImport: i0, type: BreadcrumbComponent, decorators: [{
5232
5240
  type: Component,
5233
- args: [{ selector: 'lcu-breadcrumb', template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Enterprise Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading && Enterprise\">\n <div class=\"crumb-name\" [routerLink]=\"['/enterprises']\">{{Enterprise?.Name}}</div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"enterpriseMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #enterpriseMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n [routerLink]=\"['/enterprises']\"\n (click)=\"SetActiveEnterprise(ent.Lookup)\"\n *ngFor=\"let ent of State.Enterprises\"\n >\n <span>{{ ent.Name }}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"ProjectLookup && SelectedProject\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Project Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/projects', ProjectLookup]\"\n >\n {{SelectedProject?.Project?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"projectMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n \n \n <mat-menu #projectMenu=\"matMenu\" xPosition=\"before\">\n <button \n mat-menu-item \n *ngFor=\"let projectLookup of ProjectLookups\" \n [routerLink]=\"['/projects', projectLookup]\"\n >\n <span *ngIf=\"Projects[projectLookup]; let pro;\">{{pro.Project?.Name}}</span>\n </button>\n </mat-menu>\n\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Route Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div \n class=\"crumb-name\" \n [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\"\n >\n {{SelectedRoute}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #routeMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appRoute of Routes\" [routerLink]=\"['/routes', appRoute, ProjectLookup]\">\n <span *ngIf=\"appRoute\">{{appRoute}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n <div *ngIf=\"SelectedApplication && ApplicationLookup\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Application Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n\n <div class=\"crumb-name\" \n [routerLink]=\"['/applications', ApplicationLookup, SelectedRoute, ProjectLookup]\"\n >\n {{SelectedApplication?.Application?.Name}}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"applicationMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n \n <mat-menu #applicationMenu=\"matMenu\" xPosition=\"before\">\n <button mat-menu-item *ngFor=\"let appLookup of CurrentRouteApplicationLookups\"\n [routerLink]=\"['/applications', appLookup, SelectedRoute, ProjectLookup]\">\n <span *ngIf=\"RoutedApplications[SelectedRoute][appLookup];\n let app\">{{app.Application?.Name}}</span>\n </button>\n </mat-menu>\n </ng-container>\n\n </div>\n\n\n</div>", styles: [".breadcrumb-container{background-color:#ebecf0;margin:10px 30px}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}\n"] }]
5241
+ args: [{ selector: 'lcu-breadcrumb', template: "<div class=\"breadcrumb-container\" fxLayout=\"row wrap\">\n <div fxLayout=\"row\" fxLayoutAlign=\"center center\">\n <ng-container *ngIf=\"Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Enterprise Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!Loading && Enterprise\">\n <div class=\"crumb-name\" [routerLink]=\"['/enterprises']\">\n {{ Enterprise?.Name }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"enterpriseMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #enterpriseMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n [routerLink]=\"['/enterprises']\"\n (click)=\"SetActiveEnterprise(ent.Lookup)\"\n *ngFor=\"let ent of State.Enterprises\"\n >\n <span>{{ ent.Name }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n\n <div\n *ngIf=\"ProjectLookup && SelectedProject\"\n fxLayout=\"row\"\n fxLayoutAlign=\"center center\"\n >\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Project Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div class=\"crumb-name\" [routerLink]=\"['/projects', ProjectLookup]\">\n {{ SelectedProject?.Project?.Name }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"projectMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #projectMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n *ngFor=\"let projectLookup of ProjectLookups\"\n [routerLink]=\"['/projects', projectLookup]\"\n >\n <span *ngIf=\"Projects[projectLookup]; let pro\">{{\n pro.Project?.Name\n }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n\n <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Route Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div\n class=\"crumb-name\"\n [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\"\n >\n {{ SelectedRoute }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #routeMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n *ngFor=\"let appRoute of Routes\"\n [routerLink]=\"['/routes', appRoute, ProjectLookup]\"\n >\n <span *ngIf=\"appRoute\">{{ appRoute }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n\n <div\n *ngIf=\"SelectedApplication && ApplicationLookup\"\n fxLayout=\"row\"\n fxLayoutAlign=\"center center\"\n >\n <span class=\"seperator\">/</span>\n\n <ng-container *ngIf=\"State?.Loading\">\n <div skeleton-text [effect]=\"SkeletonEffect\">Application Name</div>\n </ng-container>\n\n <ng-container *ngIf=\"!State?.Loading\">\n <div\n class=\"crumb-name\"\n [routerLink]=\"[\n '/applications',\n ApplicationLookup,\n SelectedRoute,\n ProjectLookup\n ]\"\n >\n {{ SelectedApplication?.Application?.Name }}\n </div>\n\n <button mat-icon-button [matMenuTriggerFor]=\"applicationMenu\">\n <mat-icon>expand_more</mat-icon>\n </button>\n\n <mat-menu #applicationMenu=\"matMenu\" xPosition=\"before\">\n <button\n mat-menu-item\n *ngFor=\"let appLookup of CurrentRouteApplicationLookups\"\n [routerLink]=\"[\n '/applications',\n appLookup,\n SelectedRoute,\n ProjectLookup\n ]\"\n >\n <span *ngIf=\"RoutedApplications[SelectedRoute][appLookup]; let app\">{{\n app.Application?.Name\n }}</span>\n </button>\n </mat-menu>\n </ng-container>\n </div>\n</div>\n", styles: [".breadcrumb-container{background-color:#ebecf0;margin:.5em}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}\n"] }]
5234
5242
  }], ctorParameters: function () { return [{ type: EaCService }]; }, propDecorators: { ApplicationLookup: [{
5235
5243
  type: Input,
5236
5244
  args: ['application-lookup']