Skip to content

Commit 1789ceb

Browse files
4manasamashmtumms2021389
authored
Mashup code cleanup changes (#256)
* Mashup code cleanup changes --------- Co-authored-by: mashm <[email protected]> Co-authored-by: Siva Rama Krishna <[email protected]>
1 parent 8f0ac6d commit 1789ceb

27 files changed

+322
-439
lines changed

packages/angular-sdk-components/src/lib/_services/endpoints.ts

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,8 +30,6 @@ export const endpoints = {
3030
// loginExperience: loginBoxType.Main
3131
// },
3232

33-
SP_VERSION: '1.00',
34-
3533
AUTH: '/v1/authenticate',
3634
CASES: '/v1/cases',
3735
CASES_V2: '/application/v2/cases',

projects/angular-test-app/src/app/_samples/embedded/bundle-swatch/bundle-swatch.component.ts

Lines changed: 0 additions & 39 deletions
This file was deleted.
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
<div class="progress-box" *ngIf="isProgress$">
2+
<mat-spinner class="progress-spinner"></mat-spinner>
3+
</div>
4+
5+
<div *ngIf="bLoggedIn$; else loading">
6+
<app-header></app-header>
7+
<app-main-screen *ngIf="bHasPConnect$" [pConn$]="pConn$"></app-main-screen>
8+
</div>
9+
10+
<ng-template #loading>
11+
<div>Loading...</div>
12+
</ng-template>
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
.progress-box {
2+
display: flex;
3+
flex-direction: column;
4+
justify-content: center;
5+
align-items: center;
6+
height: 100%;
7+
width: 100%;
8+
background-color: var(--app-background-color);
9+
position: fixed;
10+
z-index: 99999;
11+
top: 0px;
12+
left: 0px;
13+
opacity: 0.5;
14+
}
15+
16+
.progress-spinner {
17+
text-align: center;
18+
}

projects/angular-test-app/src/app/_samples/full-portal/top-app-mashup/top-app-mashup.component.spec.ts renamed to projects/angular-test-app/src/app/_samples/embedded/embedded.component.spec.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
11
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
22

3-
import { TopAppMashupComponent } from './top-app-mashup.component';
3+
import { EmbeddedComponent } from './embedded.component';
44

5-
describe('TopAppMashupComponent', () => {
6-
let component: TopAppMashupComponent;
7-
let fixture: ComponentFixture<TopAppMashupComponent>;
5+
describe('EmbeddedComponent', () => {
6+
let component: EmbeddedComponent;
7+
let fixture: ComponentFixture<EmbeddedComponent>;
88

99
beforeEach(waitForAsync(() => {
1010
TestBed.configureTestingModule({
11-
declarations: [TopAppMashupComponent]
11+
declarations: [EmbeddedComponent]
1212
}).compileComponents();
1313
}));
1414

1515
beforeEach(() => {
16-
fixture = TestBed.createComponent(TopAppMashupComponent);
16+
fixture = TestBed.createComponent(EmbeddedComponent);
1717
component = fixture.componentInstance;
1818
fixture.detectChanges();
1919
});
Lines changed: 117 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,117 @@
1+
import { Component, OnInit, OnDestroy } from '@angular/core';
2+
import { CommonModule } from '@angular/common';
3+
import { MatButtonModule } from '@angular/material/button';
4+
import { MatIconModule } from '@angular/material/icon';
5+
import { MatToolbarModule } from '@angular/material/toolbar';
6+
import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
7+
import { Subscription } from 'rxjs';
8+
import { getSdkConfig, loginIfNecessary } from '@pega/auth/lib/sdk-auth-manager';
9+
10+
import { ProgressSpinnerService } from 'packages/angular-sdk-components/src/lib/_messages/progress-spinner.service';
11+
import { Utils } from 'packages/angular-sdk-components/src/lib/_helpers/utils';
12+
import { compareSdkPCoreVersions } from 'packages/angular-sdk-components/src/lib/_helpers/versionHelpers';
13+
import { HeaderComponent } from './header/header.component';
14+
import { MainScreenComponent } from './main-screen/main-screen.component';
15+
16+
import { getSdkComponentMap } from 'packages/angular-sdk-components/src/lib/_bridge/helpers/sdk_component_map';
17+
import localSdkComponentMap from 'packages/angular-sdk-components/src/sdk-local-component-map';
18+
import { initializeAuthentication } from './utils';
19+
20+
declare global {
21+
interface Window {
22+
myLoadMashup: Function;
23+
}
24+
}
25+
26+
@Component({
27+
selector: 'app-embedded',
28+
templateUrl: './embedded.component.html',
29+
styleUrls: ['./embedded.component.scss'],
30+
providers: [Utils],
31+
standalone: true,
32+
imports: [CommonModule, MatProgressSpinnerModule, MatToolbarModule, MatIconModule, MatButtonModule, HeaderComponent, MainScreenComponent]
33+
})
34+
export class EmbeddedComponent implements OnInit, OnDestroy {
35+
pConn$: typeof PConnect;
36+
37+
bLoggedIn$ = false;
38+
bHasPConnect$ = false;
39+
isProgress$ = false;
40+
41+
progressSpinnerSubscription: Subscription;
42+
43+
bootstrapShell: any;
44+
45+
constructor(private psservice: ProgressSpinnerService) {}
46+
47+
ngOnInit() {
48+
this.initialize();
49+
50+
// handle showing and hiding the progress spinner
51+
this.progressSpinnerSubscription = this.psservice.getMessage().subscribe(message => {
52+
this.showHideProgress(message.show);
53+
});
54+
}
55+
56+
ngOnDestroy() {
57+
this.progressSpinnerSubscription.unsubscribe();
58+
}
59+
60+
async initialize() {
61+
// Add event listener for when logged in and constellation bootstrap is loaded
62+
document.addEventListener('SdkConstellationReady', () => this.handleSdkConstellationReady());
63+
64+
const { authConfig } = await getSdkConfig();
65+
66+
initializeAuthentication(authConfig);
67+
68+
// Login if needed, without doing an initial main window redirect
69+
const sAppName = window.location.pathname.substring(window.location.pathname.indexOf('/') + 1);
70+
loginIfNecessary({ appName: sAppName, mainRedirect: false });
71+
}
72+
73+
handleSdkConstellationReady() {
74+
this.bLoggedIn$ = true;
75+
// start the portal
76+
this.startMashup();
77+
}
78+
79+
startMashup() {
80+
PCore.onPCoreReady(async renderObj => {
81+
console.log('PCore ready!');
82+
83+
// Check that we're seeing the PCore version we expect
84+
compareSdkPCoreVersions();
85+
86+
// Initialize the SdkComponentMap (local and pega-provided)
87+
await getSdkComponentMap(localSdkComponentMap);
88+
console.log(`SdkComponentMap initialized`);
89+
90+
// Don't call initialRender until SdkComponentMap is fully initialized
91+
this.initialRender(renderObj);
92+
});
93+
94+
window.myLoadMashup('app-root', false); // this is defined in bootstrap shell that's been loaded already
95+
}
96+
97+
initialRender(renderObj) {
98+
// Need to register the callback function for PCore.registerComponentCreator
99+
// This callback is invoked if/when you call a PConnect createComponent
100+
PCore.registerComponentCreator(c11nEnv => {
101+
return c11nEnv;
102+
});
103+
104+
// Change to reflect new use of arg in the callback:
105+
const { props } = renderObj;
106+
107+
this.pConn$ = props.getPConnect();
108+
109+
this.bHasPConnect$ = true;
110+
111+
this.showHideProgress(false);
112+
}
113+
114+
showHideProgress(bShow: boolean) {
115+
this.isProgress$ = bShow;
116+
}
117+
}
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<mat-toolbar color="primary" class="mc-toolbar">
2+
<mat-toolbar-row class="mc-toolbar-row">
3+
{{ applicationLabel }}
4+
<mat-icon class="mc-icon">router</mat-icon>
5+
6+
<span class="toolbar-spacer"> </span>
7+
</mat-toolbar-row>
8+
</mat-toolbar>

projects/angular-test-app/src/app/_samples/embedded/mc-nav/mc-nav.component.scss renamed to projects/angular-test-app/src/app/_samples/embedded/header/header.component.scss

Lines changed: 0 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -2,25 +2,6 @@
22
flex: 1 1 auto;
33
}
44

5-
.progress-box {
6-
display: flex;
7-
flex-direction: column;
8-
justify-content: center;
9-
align-items: center;
10-
height: 100%;
11-
width: 100%;
12-
background-color: var(--app-background-color);
13-
position: fixed;
14-
z-index: 99999;
15-
top: 0px;
16-
left: 0px;
17-
opacity: 0.5;
18-
}
19-
20-
.progress-spinner {
21-
text-align: center;
22-
}
23-
245
.example-container {
256
min-height: 100%;
267
height: 100%;
@@ -63,11 +44,3 @@
6344
height: 80px;
6445
width: 60px;
6546
}
66-
67-
/*
68-
.mc-header-svg-icon {
69-
width: 1.4rem;
70-
display: inline-block;
71-
filter: $app-primary-color-filter;
72-
}
73-
*/

projects/angular-test-app/src/app/_samples/embedded/mc-nav/mc-nav.component.spec.ts renamed to projects/angular-test-app/src/app/_samples/embedded/header/header.component.spec.ts

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,19 @@
11
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
22

3-
import { MCNavComponent } from './mc-nav.component';
3+
import { HeaderComponent } from './header.component';
44

5-
describe('MCNavComponent', () => {
6-
let component: MCNavComponent;
7-
let fixture: ComponentFixture<MCNavComponent>;
5+
describe('HeaderComponent', () => {
6+
let component: HeaderComponent;
7+
let fixture: ComponentFixture<HeaderComponent>;
88

99
beforeEach(waitForAsync(() => {
1010
TestBed.configureTestingModule({
11-
declarations: [MCNavComponent]
11+
declarations: [HeaderComponent]
1212
}).compileComponents();
1313
}));
1414

1515
beforeEach(() => {
16-
fixture = TestBed.createComponent(MCNavComponent);
16+
fixture = TestBed.createComponent(HeaderComponent);
1717
component = fixture.componentInstance;
1818
fixture.detectChanges();
1919
});
Lines changed: 20 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
import { CommonModule } from '@angular/common';
2+
import { Component, OnInit } from '@angular/core';
3+
import { MatButtonModule } from '@angular/material/button';
4+
import { MatIconModule } from '@angular/material/icon';
5+
import { MatToolbarModule } from '@angular/material/toolbar';
6+
7+
@Component({
8+
selector: 'app-header',
9+
templateUrl: './header.component.html',
10+
styleUrls: ['./header.component.scss'],
11+
standalone: true,
12+
imports: [CommonModule, MatToolbarModule, MatIconModule, MatButtonModule]
13+
})
14+
export class HeaderComponent implements OnInit {
15+
applicationLabel: string | undefined;
16+
17+
ngOnInit() {
18+
this.applicationLabel = PCore.getEnvironmentInfo().getApplicationLabel();
19+
}
20+
}

0 commit comments

Comments
 (0)