@lowcodeunit/applications-flow-common 1.33.114-lets-get-social-ish → 1.33.118-lets-get-social-ish

package/bundles/lowcodeunit-applications-flow-common.umd.js

@@ -598,10 +598,8 @@
                 headers: this.loadHeaders(),
             });
         };
-        ApplicationsFlowService.prototype.UserFeed = function () {
-            return this.http.post(this.apiRoot + "/api/lowcodeunit/userfeed", {}, {
-                headers: this.loadHeaders(),
-            });
+        ApplicationsFlowService.prototype.UserFeed = function (page, pageSize) {
+            return this.http.get(this.apiRoot + "/api/lowcodeunit/userfeed?page=" + page + "&pageSize=" + pageSize, {});
         };
         //  Helpers
         ApplicationsFlowService.prototype.loadHeaders = function () {
@@ -1786,7 +1784,6 @@
         HostingDetailsFormGroupComponent.prototype.ngOnChanges = function () { };
         HostingDetailsFormGroupComponent.prototype.ngOnInit = function () {
             var _a, _b, _c;
-            console.log("made it to hosting details");
             this.BuildPipeline =
                 this.BuildPipeline || ((_a = this.Details) === null || _a === void 0 ? void 0 : _a.HostingOptions)
                     ? (_c = (_b = this.Details) === null || _b === void 0 ? void 0 : _b.HostingOptions[0]) === null || _c === void 0 ? void 0 : _c.Lookup : '';
@@ -5112,7 +5109,7 @@
             this.formBldr = formBldr;
             this.eacSvc = eacSvc;
             this.redirectTooltip = '';
-            this.SaveFormEvent = new i0.EventEmitter;
+            this.SaveFormEvent = new i0.EventEmitter();
         }
         Object.defineProperty(ProcessorDetailsFormComponent.prototype, "APIRootFormControl", {
             get: function () {
@@ -5301,7 +5298,7 @@
             this.setupProcessorDetailsForm();
         };
         ProcessorDetailsFormComponent.prototype.SubmitProcessorDetails = function () {
-            console.log("submitting proc details: ", this.ProcessorDetailsFormGroup.value);
+            console.log('submitting proc details: ', this.ProcessorDetailsFormGroup.value);
             this.SaveFormEvent.emit(this.ProcessorDetailsFormGroup.value);
         };
         ProcessorDetailsFormComponent.prototype.ProcessorTypeChanged = function (event) {
@@ -5356,6 +5353,9 @@
                     case 'GitHubOAuth':
                         this.setupLCUGitHubOAuthForm();
                         break;
+                    case 'WordPress':
+                        this.setupLCUWordPressForm();
+                        break;
                     // case 'NPM':
                     //   this.setupLCUNPMForm();
                     //   break;
@@ -5371,10 +5371,10 @@
         ProcessorDetailsFormComponent.prototype.setupProcessorDetailsForm = function () {
             var _a, _b;
             this.ProcessorType = ((_b = (_a = this.EditingApplication) === null || _a === void 0 ? void 0 : _a.Processor) === null || _b === void 0 ? void 0 : _b.Type) || '';
-            console.log("EDITING APP = ", this.EditingApplication);
+            console.log('EDITING APP = ', this.EditingApplication);
             if (this.EditingApplication != null) {
                 this.ProcessorDetailsFormGroup = this.formBldr.group({
-                    procType: [this.ProcessorType, [forms.Validators.required]]
+                    procType: [this.ProcessorType, [forms.Validators.required]],
                 });
                 this.setupDfsForm();
                 this.setupLcuTypeSubForm();
@@ -5419,6 +5419,10 @@
             this.ProcessorDetailsFormGroup.addControl('clientId', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.ClientID) || '', [forms.Validators.required]));
             this.ProcessorDetailsFormGroup.addControl('clientSecret', this.formBldr.control(((_b = this.EditingApplication.LowCodeUnit) === null || _b === void 0 ? void 0 : _b.ClientSecret) || '', [forms.Validators.required]));
         };
+        ProcessorDetailsFormComponent.prototype.setupLCUWordPressForm = function () {
+            var _a;
+            this.ProcessorDetailsFormGroup.addControl('apiRoot', this.formBldr.control(((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.APIRoot) || '', [forms.Validators.required]));
+        };
         ProcessorDetailsFormComponent.prototype.setupProxyForm = function () {
             var _a, _b;
             this.LCUType = ((_a = this.EditingApplication.LowCodeUnit) === null || _a === void 0 ? void 0 : _a.Type) || '';
@@ -5477,7 +5481,7 @@
     ProcessorDetailsFormComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lcu-processor-details-form',
-                    template: "<form class=\"processor-details-form\" [formGroup]=\"ProcessorDetailsFormGroup\" (ngSubmit)=\"SubmitProcessorDetails()\">\n<mat-card class=\"spread flow-card\">\n    <mat-card-header>\n      <mat-card-title> Processor Details </mat-card-title>\n    </mat-card-header>\n\n    <mat-card-content>\n      <mat-form-field class=\"mat-full-width\">\n        <mat-select\n          placeholder=\"Type\"\n          formControlName=\"procType\"\n          (selectionChange)=\"ProcessorTypeChanged($event)\"\n          required\n        >\n          <mat-option value=\"DFS\">View Package</mat-option>\n\n          <mat-option value=\"Redirect\">Redirect</mat-option>\n\n          <mat-option value=\"Proxy\">Proxy</mat-option>\n\n          <mat-option value=\"OAuth\">OAuth</mat-option>\n        </mat-select>\n      </mat-form-field>\n\n      <div [ngSwitch]=\"ProcessorType\">\n        <div *ngSwitchCase=\"'DFS'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Default File\"\n              formControlName=\"defaultFile\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"NPM\">NPM</mat-option>\n\n              <mat-option value=\"GitHub\">GitHub</mat-option>\n\n              <!-- <mat-option value=\"Zip\">Zip</mat-option> -->\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'GitHub'\">\n              <lcu-source-control-form-controls\n                [build-path]=\"EditingApplication?.LowCodeUnit?.Path\"\n                [form-group]=\"ProcessorDetailsFormGroup\"\n                [source-control]=\"DefaultSourceControl\"\n                [use-branches]=\"false\"\n                [use-build-path]=\"true\"\n              ></lcu-source-control-form-controls>\n\n              <mat-form-field\n                class=\"mat-full-width\"\n                *ngIf=\"\n                  SourceControlFormControls?.RepositoryFormControl?.valid\n                \"\n              >\n                <input\n                  matInput\n                  placeholder=\"Build\"\n                  formControlName=\"build\"\n                  required\n                />\n\n                <mat-hint>\n                  Current Build:\n                  {{ EditingApplication?.LowCodeUnit?.CurrentBuild }}\n                </mat-hint>\n              </mat-form-field>\n            </div>\n\n            <div *ngSwitchCase=\"'NPM'\">\n              <lcu-npm-package-select\n                [npm-package]=\"EditingApplication?.LowCodeUnit?.Package\"\n                [npm-package-version]=\"\n                  EditingApplication?.LowCodeUnit?.Version\n                \"\n                [form-group]=\"ProcessorDetailsFormGroup\"\n              ></lcu-npm-package-select>\n\n              <mat-hint>\n                Current Version:\n                {{ EditingApplication?.LowCodeUnit?.CurrentVersion }}\n              </mat-hint>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'OAuth'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Scopes (space separated)\"\n              formControlName=\"scopes\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Token Lookup\"\n              formControlName=\"tokenLookup\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"GitHubOAuth\">GitHub</mat-option>\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'GitHubOAuth'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Client ID\"\n                  formControlName=\"clientId\"\n                  required\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Client Secret\"\n                  formControlName=\"clientSecret\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'Proxy'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Inbound Path\"\n              formControlName=\"inboundPath\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"API\">API</mat-option>\n\n              <mat-option value=\"SPA\">Single Page Application</mat-option>\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'API'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"API Root\"\n                  formControlName=\"apiRoot\"\n                  required\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Allowed Methods (separate with spaces)\"\n                  formControlName=\"methods\"\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Security ({header}~{value})\"\n                  formControlName=\"security\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n\n            <div *ngSwitchCase=\"'SPA'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"SPA Root\"\n                  formControlName=\"spaRoot\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'Redirect'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Redirect URL\"\n              formControlName=\"redirect\"\n              required\n            />\n          </mat-form-field>\n\n          <div>\n            <mat-slide-toggle \n              class=\"spread\" \n              formControlName=\"permanent\">\n              Is Permanent?\n            </mat-slide-toggle>\n\n            <mat-slide-toggle\n              class=\"spread\"\n              formControlName=\"preserveMethod\"\n            >\n              Preserve Method?\n            </mat-slide-toggle>\n\n            <mat-icon\n              class=\"spread\"\n              matSuffix\n              (mouseenter)=\"DetermineTooltipText()\"\n              matTooltip={{redirectTooltip}}\n            >\n              info_outline\n            </mat-icon>\n\n            <!-- <mat-icon\n            *ngIf=\"!IsPermanent && !IsPreserve\"\n\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"302 \u2013 Not Permanent and Not Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            <!-- <mat-icon\n            *ngIf=\"!IsPermanent && IsPreserve\"\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"307 \u2013 Not Permanent and Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            <!-- <mat-icon\n            *ngIf=\"IsPermanent && IsPreserve\"\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"308 \u2013 Permanent and Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            \n\n            <!-- <mat-icon\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"Values used to control the redirect type.  Permanent and Not Preserve = 301; Not Permanent and Not Preserve = 302; Permanent and Preserve = 308; Not Permanent and Not Preserve = 307;\"\n            >\n              info_outline\n            </mat-icon> -->\n          </div>\n          \n          <div>\n            <mat-slide-toggle \n              class=\"spread\" \n              formControlName=\"includeRequest\">\n              Include Path and Query?\n            </mat-slide-toggle>\n\n            <mat-icon\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"Should the redirect include the path and query?\"\n            >\n              info_outline\n            </mat-icon>\n          </div>\n        </div>\n      </div>\n    </mat-card-content>\n    <mat-card-actions fxLayoutAlign=\"center center\">\n\n        <button \n          mat-raised-button \n          type=\"submit\" \n          fxFlex=\"100%\" \n          color=\"primary\" \n          [disabled]=\"!ProcessorDetailsFormGroup.valid || !ProcessorDetailsFormGroup.dirty\">\n          <mat-icon>save</mat-icon>\n          Save Processor Details\n        </button>\n\n    </mat-card-actions>\n</mat-card>\n</form>\n  \n",
+                    template: "<form class=\"processor-details-form\" [formGroup]=\"ProcessorDetailsFormGroup\" (ngSubmit)=\"SubmitProcessorDetails()\">\n<mat-card class=\"spread flow-card\">\n    <mat-card-header>\n      <mat-card-title> Processor Details </mat-card-title>\n    </mat-card-header>\n\n    <mat-card-content>\n      <mat-form-field class=\"mat-full-width\">\n        <mat-select\n          placeholder=\"Type\"\n          formControlName=\"procType\"\n          (selectionChange)=\"ProcessorTypeChanged($event)\"\n          required\n        >\n          <mat-option value=\"DFS\">View Package</mat-option>\n\n          <mat-option value=\"Redirect\">Redirect</mat-option>\n\n          <mat-option value=\"Proxy\">Proxy</mat-option>\n\n          <mat-option value=\"OAuth\">OAuth</mat-option>\n        </mat-select>\n      </mat-form-field>\n\n      <div [ngSwitch]=\"ProcessorType\">\n        <div *ngSwitchCase=\"'DFS'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Default File\"\n              formControlName=\"defaultFile\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"NPM\">NPM</mat-option>\n\n              <mat-option value=\"GitHub\">GitHub</mat-option>\n\n              <mat-option value=\"WordPress\">WordPress</mat-option>\n\n              <!-- <mat-option value=\"Zip\">Zip</mat-option> -->\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'GitHub'\">\n              <lcu-source-control-form-controls\n                [build-path]=\"EditingApplication?.LowCodeUnit?.Path\"\n                [form-group]=\"ProcessorDetailsFormGroup\"\n                [source-control]=\"DefaultSourceControl\"\n                [use-branches]=\"false\"\n                [use-build-path]=\"true\"\n              ></lcu-source-control-form-controls>\n\n              <mat-form-field\n                class=\"mat-full-width\"\n                *ngIf=\"\n                  SourceControlFormControls?.RepositoryFormControl?.valid\n                \"\n              >\n                <input\n                  matInput\n                  placeholder=\"Build\"\n                  formControlName=\"build\"\n                  required\n                />\n\n                <mat-hint>\n                  Current Build:\n                  {{ EditingApplication?.LowCodeUnit?.CurrentBuild }}\n                </mat-hint>\n              </mat-form-field>\n            </div>\n\n            <div *ngSwitchCase=\"'NPM'\">\n              <lcu-npm-package-select\n                [npm-package]=\"EditingApplication?.LowCodeUnit?.Package\"\n                [npm-package-version]=\"\n                  EditingApplication?.LowCodeUnit?.Version\n                \"\n                [form-group]=\"ProcessorDetailsFormGroup\"\n              ></lcu-npm-package-select>\n\n              <mat-hint>\n                Current Version:\n                {{ EditingApplication?.LowCodeUnit?.CurrentVersion }}\n              </mat-hint>\n            </div>\n\n            <div *ngSwitchCase=\"'WordPress'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"API Root\"\n                  formControlName=\"apiRoot\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'OAuth'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Scopes (space separated)\"\n              formControlName=\"scopes\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Token Lookup\"\n              formControlName=\"tokenLookup\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"GitHubOAuth\">GitHub</mat-option>\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'GitHubOAuth'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Client ID\"\n                  formControlName=\"clientId\"\n                  required\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Client Secret\"\n                  formControlName=\"clientSecret\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'Proxy'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Inbound Path\"\n              formControlName=\"inboundPath\"\n              required\n            />\n          </mat-form-field>\n\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              placeholder=\"Type\"\n              formControlName=\"lcuType\"\n              (selectionChange)=\"LCUTypeChanged($event)\"\n              required\n            >\n              <mat-option value=\"API\">API</mat-option>\n\n              <mat-option value=\"SPA\">Single Page Application</mat-option>\n            </mat-select>\n          </mat-form-field>\n\n          <div [ngSwitch]=\"LCUType\">\n            <div *ngSwitchCase=\"'API'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"API Root\"\n                  formControlName=\"apiRoot\"\n                  required\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Allowed Methods (separate with spaces)\"\n                  formControlName=\"methods\"\n                />\n              </mat-form-field>\n\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"Security ({header}~{value})\"\n                  formControlName=\"security\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n\n            <div *ngSwitchCase=\"'SPA'\">\n              <mat-form-field class=\"mat-full-width\">\n                <input\n                  matInput\n                  placeholder=\"SPA Root\"\n                  formControlName=\"spaRoot\"\n                  required\n                />\n              </mat-form-field>\n            </div>\n          </div>\n        </div>\n\n        <div *ngSwitchCase=\"'Redirect'\">\n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              placeholder=\"Redirect URL\"\n              formControlName=\"redirect\"\n              required\n            />\n          </mat-form-field>\n\n          <div>\n            <mat-slide-toggle \n              class=\"spread\" \n              formControlName=\"permanent\">\n              Is Permanent?\n            </mat-slide-toggle>\n\n            <mat-slide-toggle\n              class=\"spread\"\n              formControlName=\"preserveMethod\"\n            >\n              Preserve Method?\n            </mat-slide-toggle>\n\n            <mat-icon\n              class=\"spread\"\n              matSuffix\n              (mouseenter)=\"DetermineTooltipText()\"\n              matTooltip={{redirectTooltip}}\n            >\n              info_outline\n            </mat-icon>\n\n            <!-- <mat-icon\n            *ngIf=\"!IsPermanent && !IsPreserve\"\n\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"302 \u2013 Not Permanent and Not Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            <!-- <mat-icon\n            *ngIf=\"!IsPermanent && IsPreserve\"\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"307 \u2013 Not Permanent and Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            <!-- <mat-icon\n            *ngIf=\"IsPermanent && IsPreserve\"\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"308 \u2013 Permanent and Preserve\"\n            >\n              info_outline\n            </mat-icon> -->\n\n            \n\n            <!-- <mat-icon\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"Values used to control the redirect type.  Permanent and Not Preserve = 301; Not Permanent and Not Preserve = 302; Permanent and Preserve = 308; Not Permanent and Not Preserve = 307;\"\n            >\n              info_outline\n            </mat-icon> -->\n          </div>\n          \n          <div>\n            <mat-slide-toggle \n              class=\"spread\" \n              formControlName=\"includeRequest\">\n              Include Path and Query?\n            </mat-slide-toggle>\n\n            <mat-icon\n              class=\"spread\"\n              matSuffix\n              matTooltip=\"Should the redirect include the path and query?\"\n            >\n              info_outline\n            </mat-icon>\n          </div>\n        </div>\n      </div>\n    </mat-card-content>\n    <mat-card-actions fxLayoutAlign=\"center center\">\n\n        <button \n          mat-raised-button \n          type=\"submit\" \n          fxFlex=\"100%\" \n          color=\"primary\" \n          [disabled]=\"!ProcessorDetailsFormGroup.valid || !ProcessorDetailsFormGroup.dirty\">\n          <mat-icon>save</mat-icon>\n          Save Processor Details\n        </button>\n\n    </mat-card-actions>\n</mat-card>\n</form>\n  \n",
                     styles: [""]
                 },] }
     ];
@@ -5577,12 +5581,6 @@
             this.HostingDetails = new ProjectHostingDetails();
         }
         Object.defineProperty(BuildPipelineFormComponent.prototype, "Artifact", {
-            // @Input('main-branch')
-            // public MainBranch: string;
-            // @Input('organization')
-            // public Organization: string;
-            // @Input('repository')
-            // public Repository: string;
             get: function () {
                 var _a, _b;
                 // console.log("ARTIFACT: ", this.Environment?.Artifacts[this.ArtifactLookup]);
@@ -5605,7 +5603,7 @@
         Object.defineProperty(BuildPipelineFormComponent.prototype, "BuildPipelineFormControl", {
             get: function () {
                 var _a;
-                return (_a = this.BuildPipelineFormGroup) === null || _a === void 0 ? void 0 : _a.controls.buildPipeline;
+                return (_a = this.BuildPipelineFormGroup) === null || _a === void 0 ? void 0 : _a.get('buildPipeline');
             },
             enumerable: false,
             configurable: true
@@ -5678,24 +5676,30 @@
             configurable: true
         });
         BuildPipelineFormComponent.prototype.ngOnInit = function () {
-            this.BuildPipelineFormGroup = this.formBuilder.group({});
-            if (this.BuildPipelineFormGroup != null) {
-                this.BuildPipelineFormGroup.removeControl('hostingDetails');
-            }
-            this.BuildPipelineFormGroup.addControl('hostingDetails', this.formBuilder.group({
+            // console.log('BuildPipeline = ', this.BuildPipeline)
+            // this.BuildPipelineFormGroup = this.formBuilder.group({});
+            // if (this.BuildPipelineFormGroup != null) {
+            //   this.BuildPipelineFormGroup.removeControl('hostingDetails');
+            // }
+            // this.BuildPipelineFormGroup.addControl(
+            //   'hostingDetails',
+            this.BuildPipelineFormGroup = this.formBuilder.group({
                 buildPipeline: [this.BuildPipeline, [forms.Validators.required]],
-            }));
+            });
+            // );
             this.loadProjectHostingDetails();
+            // this.setupControlsForForm();
         };
         //API METHODS
         BuildPipelineFormComponent.prototype.BuildPipelineChanged = function () {
-            var _a, _b;
-            console.log("build pipeline value: ", (_a = this.BuildPipelineFormControl) === null || _a === void 0 ? void 0 : _a.value);
-            this.BuildPipeline = (_b = this.BuildPipelineFormControl) === null || _b === void 0 ? void 0 : _b.value;
+            var _a;
+            //for some reason this value is coming back undefined
+            // console.log("build pipeline value: ", this.BuildPipelineFormControl?.value)
+            this.BuildPipeline = (_a = this.BuildPipelineFormControl) === null || _a === void 0 ? void 0 : _a.value;
             this.setupControlsForForm();
         };
         BuildPipelineFormComponent.prototype.SubmitBuildPipeline = function () {
-            console.log("submitting build pipeline: ", this.BuildPipelineFormGroup.value);
+            // console.log("submitting build pipeline: ", this.BuildPipelineFormGroup.value);
             this.SaveEnvironment();
         };
         BuildPipelineFormComponent.prototype.SaveEnvironment = function () {
@@ -5741,37 +5745,27 @@
                 var doa = Object.assign(Object.assign({}, this.DevOpsAction), { Name: this.DevOpsActionNameFormControl.value });
                 saveEnvReq.Environment.DevOpsActions[devOpsActionLookup] = doa;
             }
-            // let source: EaCSourceControl = {
-            //   ...this.EditingSourceControl,
-            //   Branches: this.EditingSourceControl.SelectedBranches,
-            //   MainBranch: this.EditingSourceControl.MainBranchFormControl.value,
-            // };
-            // source = {
-            //   ...source,
-            //   Type: 'GitHub',
-            //   Name: this.EditingSourceControlLookup,
-            //   DevOpsActionTriggerLookups: [devOpsActionLookup],
-            //   Organization:
-            //     this.EditingSourceControl.OrganizationFormControl.value,
-            //   Repository: this.EditingSourceControl.RepositoryFormControl.value,
-            // };
-            // const scLookup = `github://${source.Organization}/${source.Repository}`;
-            // saveEnvReq.Environment.Sources[scLookup] = source;
             this.eacSvc.SaveEnvironmentAsCode(saveEnvReq);
         };
         //  Helpers
         BuildPipelineFormComponent.prototype.setupControlsForForm = function () {
             var _this = this;
+            // this.BuildPipeline =
+            //         this.BuildPipeline || this.HostingDetails?.HostingOptions
+            //           ? this.HostingDetails?.HostingOptions[0]?.Lookup
+            //           : '';
             var _a, _b, _c, _d, _e, _f;
+            // console.log("hosting details: ", this.HostingDetails)
             for (var ctrlName in this.BuildPipelineFormGroup.controls) {
                 //devOpsAction doesn't exist
                 //removes hosting details
                 if (ctrlName !== 'buildPipeline' && ctrlName !== 'devOpsAction') {
-                    console.log("removing control: ", ctrlName);
+                    // console.log("removing control: ", ctrlName)
                     this.BuildPipelineFormGroup.removeControl(ctrlName);
                 }
             }
             this.BuildPipelineFormGroup.addControl('devOpsActionName', this.formBuilder.control(((_a = this.DevOpsAction) === null || _a === void 0 ? void 0 : _a.Name) || ((_b = this.SelectedHostingOption) === null || _b === void 0 ? void 0 : _b.Name) || '', [forms.Validators.required]));
+            // console.log("selected hosting options: ", this.SelectedHostingOption.Inputs);
             (_d = (_c = this.SelectedHostingOption) === null || _c === void 0 ? void 0 : _c.Inputs) === null || _d === void 0 ? void 0 : _d.forEach(function (input) {
                 var validators = input.Required ? [forms.Validators.required] : [];
                 _this.BuildPipelineFormGroup.addControl(input.Lookup, _this.formBuilder.control(_this.Artifact[input.Lookup] || input.DefaultValue || '', validators));
@@ -5796,22 +5790,16 @@
         BuildPipelineFormComponent.prototype.loadProjectHostingDetails = function () {
             var _this = this;
             this.HostingDetails.Loading = true;
-            // this.Organization,
-            // this.Repository,
-            // this.MainBranch
-            // "powhound4",
-            // "RedwoodCrystals",
-            // "master"
             this.appsFlowSvc
                 .NewLoadProjectHostingDetails()
                 .subscribe(function (response) {
-                var _a, _b, _c;
+                var _a, _b;
                 _this.HostingDetails = response.Model;
-                console.log("response: ", response);
+                // console.log("response: ", response);
                 _this.HostingDetails.Loading = false;
-                _this.BuildPipeline =
-                    ((_a = _this.HostingDetails) === null || _a === void 0 ? void 0 : _a.HostingOptions) ? (_c = (_b = _this.HostingDetails) === null || _b === void 0 ? void 0 : _b.HostingOptions[0]) === null || _c === void 0 ? void 0 : _c.Lookup : '';
-                console.log("Build Pipeline HERE= ", _this.BuildPipeline);
+                var hostOption = (_b = (_a = _this.HostingDetails) === null || _a === void 0 ? void 0 : _a.HostingOptions) === null || _b === void 0 ? void 0 : _b.find(function (ho) { return ho.Path === _this.DevOpsAction.Path; });
+                _this.BuildPipeline = hostOption.Lookup;
+                // console.log("Build Pipeline HERE= ", this.BuildPipeline);
                 _this.setupControlsForForm();
             }, function (err) {
                 console.log("ERR: ", err);
@@ -5824,7 +5812,7 @@
     BuildPipelineFormComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lcu-build-pipeline-form',
-                    template: "<form class=\"form-card\" [formGroup]=\"BuildPipelineFormGroup\" (ngSubmit)=\"SubmitBuildPipeline()\">\n    <mat-card\n      class=\"spread\"  \n    >\n      <mat-card-header>\n        <mat-card-title> Build Pipeline </mat-card-title>\n\n        <mat-hint>\n          Changes made here are reflected for all sources using this\n          DevOpsAction\n        </mat-hint>\n      </mat-card-header>\n\n      <mat-card-content>\n\n        <ng-container>\n\n        <div  *ngIf=\"!HostingDetails?.Loading\">\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              formControlName=\"buildPipeline\"\n              placeholder=\"Build Pipeline\"\n              [disabled]=\"Disabled\"\n              (selectionChange)=\"BuildPipelineChanged()\"\n              required\n            >\n              <ng-container\n                *ngFor=\"let hostOption of HostingDetails?.HostingOptions; let i = index\"\n              >\n                <mat-option [value]=\"hostOption?.Lookup\">\n                  {{ hostOption.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n        \n            <mat-hint>\n              <ng-container *ngFor=\"let hostOption of HostingDetails?.HostingOptions\">\n                <span *ngIf=\"BuildPipeline == hostOption?.Lookup\">\n                  {{ hostOption.Description }}\n                </span>\n              </ng-container>\n            </mat-hint>\n          </mat-form-field>\n        \n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              formControlName=\"devOpsActionName\"\n              placeholder=\"Name of DevOps Action\"\n              required=\"true\"\n            />\n          </mat-form-field>\n        \n          <ng-container *ngFor=\"let input of SelectedHostingOption?.Inputs\">\n            <mat-form-field class=\"mat-full-width\">\n              <input\n                matInput\n                [formControlName]=\"input.Lookup\"\n                [placeholder]=\"input.Placeholder\"\n                [required]=\"input.Required\"\n              />\n        \n              <mat-hint>{{ input.Hint }}</mat-hint>\n            </mat-form-field>\n          </ng-container>\n        \n          <div *ngIf=\"BuildPipeline == 'npm-release'\">\n            <mat-form-field class=\"mat-full-width with-hint padding-bottom-4\">\n              <mat-icon matPrefix>security</mat-icon>\n        \n              <input\n                id=\"npm-token\"\n                matInput\n                type=\"text\"\n                formControlName=\"npmToken\"\n                placeholder=\"NPM token\"\n                [required]=\"!Disabled\"\n                style=\"-webkit-text-security: disc;\"\n              />\n              <mat-hint>\n                Securely publish to NPM, provide an NPM Personal Access Token (PAT) with publish access to the organization used for your NPM packages.              \n                Learn how to create and view access tokens \n                <a\n                  href=\"https://docs.npmjs.com/creating-and-viewing-access-tokens\"\n                  target=\"_blank\"\n                >\n                  here.\n                </a>\n              </mat-hint>\n            </mat-form-field>\n          </div>\n        </div>\n        \n        <div *ngIf=\"HostingDetails?.Loading\">\n          <div class=\"spread\">\n            <lcu-loader style=\"margin: auto\" [loading]=\"true\"></lcu-loader>\n        \n            <div class=\"margin-3\">\n              <h4 class=\"mat-title\">Loading hosting details</h4>\n            </div>\n          </div>\n        </div>\n        </ng-container>\n      </mat-card-content>\n      <mat-card-actions fxLayoutAlign=\"center center\">\n\n        <button \n          mat-raised-button \n          type=\"submit\" \n          fxFlex=\"100%\" \n          color=\"primary\" \n          [disabled]=\"!BuildPipelineFormGroup.valid || !BuildPipelineFormGroup.dirty\">\n          <mat-icon>save</mat-icon>\n          Save Build Pipeline\n        </button>\n        \n    </mat-card-actions>\n    </mat-card>\n</form>\n",
+                    template: "<form class=\"form-card\" [formGroup]=\"BuildPipelineFormGroup\" (ngSubmit)=\"SubmitBuildPipeline()\">\n    <mat-card\n      class=\"spread\"  \n    >\n      <mat-card-header>\n        <mat-card-title> Build Pipeline </mat-card-title>\n\n        <mat-hint>\n          Changes made here are reflected for all sources using this\n          DevOpsAction\n        </mat-hint>\n      </mat-card-header>\n\n      <mat-card-content>\n\n\n        <div  *ngIf=\"!HostingDetails?.Loading\">\n          <mat-form-field class=\"mat-full-width\">\n            <mat-select\n              formControlName=\"buildPipeline\"\n              placeholder=\"Build Pipeline\"\n              [disabled]=\"Disabled\"\n              (selectionChange)=\"BuildPipelineChanged()\"\n              required\n            >\n              <ng-container\n                *ngFor=\"let hostOption of HostingDetails?.HostingOptions; let i = index\"\n              >\n                <mat-option [value]=\"hostOption.Lookup\">\n                  {{ hostOption.Name }}\n                </mat-option>\n              </ng-container>\n            </mat-select>\n        \n            <mat-hint>\n              <ng-container *ngFor=\"let hostOption of HostingDetails?.HostingOptions\">\n                <span *ngIf=\"BuildPipeline == hostOption?.Lookup\">\n                  {{ hostOption.Description }}\n                </span>\n              </ng-container>\n            </mat-hint>\n          </mat-form-field>\n        \n          <mat-form-field class=\"mat-full-width\">\n            <input\n              matInput\n              formControlName=\"devOpsActionName\"\n              placeholder=\"Name of DevOps Action\"\n              required=\"true\"\n            />\n          </mat-form-field>\n        \n          <ng-container *ngFor=\"let input of SelectedHostingOption?.Inputs\">\n            <mat-form-field class=\"mat-full-width\">\n              <input\n                matInput\n                [formControlName]=\"input.Lookup\"\n                [placeholder]=\"input.Placeholder\"\n                [required]=\"input.Required\"\n              />\n        \n              <mat-hint>{{ input.Hint }}</mat-hint>\n            </mat-form-field>\n          </ng-container>\n        \n          <div *ngIf=\"BuildPipeline == 'npm-release'\">\n            <mat-form-field class=\"mat-full-width with-hint padding-bottom-4\">\n              <mat-icon matPrefix>security</mat-icon>\n        \n              <input\n                id=\"npm-token\"\n                matInput\n                type=\"text\"\n                formControlName=\"npmToken\"\n                placeholder=\"NPM token\"\n                [required]=\"!Disabled\"\n                style=\"-webkit-text-security: disc;\"\n              />\n              <mat-hint>\n                Securely publish to NPM, provide an NPM Personal Access Token (PAT) with publish access to the organization used for your NPM packages.              \n                Learn how to create and view access tokens \n                <a\n                  href=\"https://docs.npmjs.com/creating-and-viewing-access-tokens\"\n                  target=\"_blank\"\n                >\n                  here.\n                </a>\n              </mat-hint>\n            </mat-form-field>\n          </div>\n        </div>\n        \n        <div *ngIf=\"HostingDetails?.Loading\">\n          <div class=\"spread\">\n            <lcu-loader style=\"margin: auto\" [loading]=\"true\"></lcu-loader>\n        \n            <div class=\"margin-3\">\n              <h4 class=\"mat-title\">Loading hosting details</h4>\n            </div>\n          </div>\n        </div>\n      </mat-card-content>\n      <mat-card-actions fxLayoutAlign=\"center center\">\n\n        <button \n          mat-raised-button \n          type=\"submit\" \n          fxFlex=\"100%\" \n          color=\"primary\" \n          [disabled]=\"!BuildPipelineFormGroup.valid || !BuildPipelineFormGroup.dirty\">\n          <mat-icon>save</mat-icon>\n          Save Build Pipeline\n        </button>\n        \n    </mat-card-actions>\n    </mat-card>\n</form>\n",
                     styles: [""]
                 },] }
     ];
@@ -5834,11 +5822,11 @@
         { type: ApplicationsFlowService }
     ]; };
     BuildPipelineFormComponent.propDecorators = {
-        BuildPipeline: [{ type: i0.Input, args: ['build-pipeline',] }],
         DevOpsActionLookup: [{ type: i0.Input, args: ['devops-action-lookup',] }],
         Disabled: [{ type: i0.Input, args: ['disabled',] }],
         Environment: [{ type: i0.Input, args: ['environment',] }],
-        EnvironmentLookup: [{ type: i0.Input, args: ['environment-lookup',] }]
+        EnvironmentLookup: [{ type: i0.Input, args: ['environment-lookup',] }],
+        HostingDetails: [{ type: i0.Input, args: ['hosting-details',] }]
     };
 
     var DevopsSourceControlFormComponent = /** @class */ (function () {
@@ -6351,7 +6339,7 @@
     BuildPipelineDialogComponent.decorators = [
         { type: i0.Component, args: [{
                     selector: 'lcu-build-pipeline-dialog',
-                    template: "<div class=\"dialog-header\" fxLayoutAlign=\"end center\">\n    <button mat-icon-button (click)=\"CloseDialog()\">\n            <mat-icon>cancel</mat-icon>\n    </button>\n</div>\n\n<lcu-build-pipeline-form \n    [build-pipeline]=\"data.buildPipeline\" \n    [devops-action-lookup]=\"data.devopsActionLookup\"\n    [environment]=\"data.environment\" \n    [environment-lookup]=\"data.environmentLookup\">\n\n</lcu-build-pipeline-form>",
+                    template: "<div class=\"dialog-header\" fxLayoutAlign=\"end center\">\n    <button mat-icon-button (click)=\"CloseDialog()\">\n            <mat-icon>cancel</mat-icon>\n    </button>\n</div>\n\n<lcu-build-pipeline-form \n    [devops-action-lookup]=\"data.devopsActionLookup\"\n    [environment]=\"data.environment\" \n    [environment-lookup]=\"data.environmentLookup\"\n    >\n\n</lcu-build-pipeline-form>",
                     styles: [".dialog-header{width:100%}"]
                 },] }
     ];
@@ -6431,6 +6419,169 @@
         SaveFormEvent: [{ type: i0.Output, args: ['save-form-event',] }]
     };
 
+    var BreadcrumbComponent = /** @class */ (function () {
+        function BreadcrumbComponent(eacSvc) {
+            this.eacSvc = eacSvc;
+        }
+        Object.defineProperty(BreadcrumbComponent.prototype, "ApplicationsBank", {
+            get: function () {
+                var _a, _b;
+                return ((_b = (_a = this.State) === null || _a === void 0 ? void 0 : _a.EaC) === null || _b === void 0 ? void 0 : _b.Applications) || {};
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "Applications", {
+            get: function () {
+                var _this = this;
+                var _a;
+                var apps = {};
+                (_a = this.SelectedProject) === null || _a === void 0 ? void 0 : _a.ApplicationLookups.forEach(function (appLookup) {
+                    apps[appLookup] = _this.ApplicationsBank[appLookup];
+                });
+                return apps;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "SelectedApplication", {
+            get: function () {
+                var _a, _b;
+                return ((_b = (_a = this.State) === null || _a === void 0 ? void 0 : _a.EaC) === null || _b === void 0 ? void 0 : _b.Applications[this.ApplicationLookup]) || {};
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "CurrentRouteApplicationLookups", {
+            get: function () {
+                return Object.keys(this.RoutedApplications[this.SelectedRoute] || {});
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "Projects", {
+            get: function () {
+                var _a, _b;
+                return ((_b = (_a = this.State) === null || _a === void 0 ? void 0 : _a.EaC) === null || _b === void 0 ? void 0 : _b.Projects) || {};
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "ProjectLookups", {
+            get: function () {
+                var _a, _b;
+                return Object.keys(((_b = (_a = this.State) === null || _a === void 0 ? void 0 : _a.EaC) === null || _b === void 0 ? void 0 : _b.Projects) || {});
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "Routes", {
+            get: function () {
+                return Object.keys(this.RoutedApplications || {});
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "RoutedApplications", {
+            get: function () {
+                var _this = this;
+                var appLookups = Object.keys(this.Applications);
+                var apps = appLookups.map(function (appLookup) { return _this.Applications[appLookup]; });
+                var appRoutes = apps.map(function (app) {
+                    var _a;
+                    return (_a = app.LookupConfig) === null || _a === void 0 ? void 0 : _a.PathRegex.replace('.*', '');
+                }) || [];
+                appRoutes = appRoutes.filter(function (ar) { return ar != null; });
+                var routeBases = [];
+                appRoutes.forEach(function (appRoute) {
+                    var appRouteParts = appRoute.split('/');
+                    var appRouteBase = "/" + appRouteParts[1];
+                    if (routeBases.indexOf(appRouteBase) < 0) {
+                        routeBases.push(appRouteBase);
+                    }
+                });
+                var workingAppLookups = __spread((appLookups || []));
+                routeBases = routeBases.sort(function (a, b) { return b.localeCompare(a); });
+                var routeSet = routeBases.reduce(function (prevRouteMap, currentRouteBase) {
+                    var routeMap = Object.assign({}, prevRouteMap);
+                    var filteredAppLookups = workingAppLookups.filter(function (wal) {
+                        var _a;
+                        var wa = _this.Applications[wal];
+                        return (_a = wa.LookupConfig) === null || _a === void 0 ? void 0 : _a.PathRegex.startsWith(currentRouteBase);
+                    });
+                    routeMap[currentRouteBase] =
+                        filteredAppLookups.reduce(function (prevAppMap, appLookup) {
+                            var appMap = Object.assign({}, prevAppMap);
+                            appMap[appLookup] = _this.Applications[appLookup];
+                            return appMap;
+                        }, {}) || {};
+                    workingAppLookups = workingAppLookups.filter(function (wa) {
+                        return filteredAppLookups.indexOf(wa) < 0;
+                    });
+                    return routeMap;
+                }, {}) || {};
+                var routeSetKeys = Object.keys(routeSet);
+                routeSetKeys = routeSetKeys.sort(function (a, b) { return a.localeCompare(b); });
+                var routeSetResult = {};
+                routeSetKeys.forEach(function (rsk) { return (routeSetResult[rsk] = routeSet[rsk]); });
+                return routeSetResult;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "SelectedProject", {
+            get: function () {
+                var _a, _b;
+                return ((_b = (_a = this.State) === null || _a === void 0 ? void 0 : _a.EaC) === null || _b === void 0 ? void 0 : _b.Projects[this.ProjectLookup]) || {};
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(BreadcrumbComponent.prototype, "State", {
+            get: function () {
+                return this.eacSvc.State;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        BreadcrumbComponent.prototype.ngOnInit = function () {
+            this.handleStateChange().then(function (eac) { });
+            console.log("Selected project: ", this.SelectedProject.Project);
+            console.log("SelectedRoute:", this.SelectedRoute);
+        };
+        BreadcrumbComponent.prototype.handleStateChange = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_c) {
+                    switch (_c.label) {
+                        case 0:
+                            this.State.Loading = true;
+                            return [4 /*yield*/, this.eacSvc.EnsureUserEnterprise()];
+                        case 1:
+                            _c.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        return BreadcrumbComponent;
+    }());
+    BreadcrumbComponent.decorators = [
+        { type: i0.Component, args: [{
+                    selector: 'lcu-breadcrumb',
+                    template: "<div class=\"breadcrumb-container\" fxLayout=\"row\">\n\n    <div *ngIf=\"Enterprise\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\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 mat-menu-item [routerLink]=\"['/enterprises']\">\n            <span>{{Enterprise.Name}}</span>\n            </button>\n        </mat-menu>\n\n    </div>\n\n    <div *ngIf=\"ProjectLookup && SelectedProject\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n        <span class=\"seperator\">/</span>\n\n        <div class=\"crumb-name\" [routerLink]=\"['/projects', projectLookup]\">{{SelectedProject.Project.Name}}</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 mat-menu-item *ngFor=\"let projectLookup of ProjectLookups\" [routerLink]=\"['/projects', projectLookup]\">\n                        <span *ngIf=\"Projects[projectLookup]; let pro;\">{{pro.Project.Name}}</span>\n                    </button>\n            </mat-menu>\n\n    </div>\n\n    <div *ngIf=\"SelectedRoute\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n        <span class=\"seperator\">/</span>\n\n        <div class=\"crumb-name\" [routerLink]=\"['/routes', SelectedRoute, ProjectLookup]\">{{SelectedRoute}}</div>\n\n        <button mat-icon-button [matMenuTriggerFor]=\"routeMenu\">\n            <mat-icon>expand_more</mat-icon>\n        </button>\n        \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\n    </div>\n\n    <div *ngIf=\"SelectedApplication && ApplicationLookup\" fxLayout=\"row\" fxLayoutAlign=\"center center\">\n\n        <span class=\"seperator\">/</span>\n\n        <div class=\"crumb-name\" \n            [routerLink]=\"['/applications', ApplicationLookup, SelectedRoute, ProjectLookup]\">\n            {{SelectedApplication.Application.Name}}</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\n    </div>\n\n\n</div>\n",
+                    styles: [".breadcrumb-container{background-color:#ebecf0;margin:10px 30px}.seperator{font-size:25px;padding:10px}.crumb-name{cursor:pointer}"]
+                },] }
+    ];
+    BreadcrumbComponent.ctorParameters = function () { return [
+        { type: EaCService }
+    ]; };
+    BreadcrumbComponent.propDecorators = {
+        Enterprise: [{ type: i0.Input, args: ['enterprise',] }],
+        ApplicationLookup: [{ type: i0.Input, args: ['application-lookup',] }],
+        ProjectLookup: [{ type: i0.Input, args: ['project-lookup',] }],
+        SelectedRoute: [{ type: i0.Input, args: ['selected-route',] }]
+    };
+
     var ApplicationsFlowModule = /** @class */ (function () {
         function ApplicationsFlowModule() {
         }
@@ -6491,7 +6642,8 @@
                         DevopsSourceControlFormComponent,
                         SourceControlDialogComponent,
                         BuildPipelineDialogComponent,
-                        EditApplicationFormComponent
+                        EditApplicationFormComponent,
+                        BreadcrumbComponent
                     ],
                     imports: [
                         i2.FathymSharedModule,
@@ -6544,7 +6696,8 @@
                         DevopsSourceControlFormComponent,
                         SourceControlDialogComponent,
                         BuildPipelineDialogComponent,
-                        EditApplicationFormComponent
+                        EditApplicationFormComponent,
+                        BreadcrumbComponent
                     ],
                     entryComponents: [
                         ApplicationsFlowProjectsElementComponent,
@@ -6584,7 +6737,8 @@
                         DevopsSourceControlFormComponent,
                         SourceControlDialogComponent,
                         BuildPipelineDialogComponent,
-                        EditApplicationFormComponent
+                        EditApplicationFormComponent,
+                        BreadcrumbComponent
                     ],
                 },] }
     ];
@@ -6681,6 +6835,7 @@
     exports.ɵbd = SourceControlDialogComponent;
     exports.ɵbe = BuildPipelineDialogComponent;
     exports.ɵbf = EditApplicationFormComponent;
+    exports.ɵbg = BreadcrumbComponent;
     exports.ɵc = ProjectTabsComponent;
     exports.ɵd = GeneralComponent;
     exports.ɵe = DomainsComponent;