fix: add approval flow for contracts
MODIFY
src/app/app-routing.module.ts
src/app/app-routing.module.ts
@@ -8,6 +8,7 @@ import { AccountComponent } from './components/account/account.component';
import { MyAppsComponent } from './components/my-apps/my-apps.component';
import { AuthGuard } from './guards/auth.guard';
import { SwaggerComponent } from './components/swagger/swagger.component';
+import {ApprovalComponent} from "./components/approval/approval.component";
const routes: Routes = [
{ path: '', redirectTo: '/home', pathMatch: 'full' },
@@ -24,6 +25,7 @@ const routes: Routes = [
{ path: 'account', component: AccountComponent, canActivate: [AuthGuard] },
{ path: 'applications', component: MyAppsComponent, canActivate: [AuthGuard] },
{ path: 'swagger/:orgId/:apiId/:apiVersion', component: SwaggerComponent },
+ { path: 'approval', component: ApprovalComponent },
];
@NgModule({

MODIFY
src/app/app.module.ts
src/app/app.module.ts
@@ -38,6 +38,7 @@ import { PolicyCardComponent } from './components/policy-card/policy-card.compon
import { NgxChartsModule } from '@swimlane/ngx-charts';
import { GaugeChartComponent } from './components/charts/gauge-chart/gauge-chart.component';
import { IConfig } from './interfaces/IConfig';
+import { ApprovalComponent } from './components/approval/approval.component';
export function initializeApp(configService: ConfigService, devPortalInitializer: InitializerService, keycloakHelper: KeycloakHelperService): () => Promise<any> {
return () => new Promise((resolve, reject) => {
@@ -83,6 +84,7 @@ export function createTranslateLoader(http: HttpClient) {
MyAppsManageApiComponent,
PolicyCardComponent,
GaugeChartComponent,
+ ApprovalComponent,
],
imports: [
KeycloakAngularModule,

ADD
src/app/components/approval/approval.component.html
+<div class="center mt-40">
+ <h1 class="mt-40" [innerHTML]="'APPROVAL.TITLE' | translate"></h1>
+ <h2 [innerHTML]="'APPROVAL.SUBTITLE' | translate"></h2>
+ <h4 [innerHTML]="'APPROVAL.MORE_INFO' | translate"></h4>
+</div>

ADD
src/app/components/approval/approval.component.scss
+.center {
+ text-align: center;
+}

ADD
src/app/components/approval/approval.component.spec.ts
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ApprovalComponent } from './approval.component';
+
+describe('ApprovalComponent', () => {
+ let component: ApprovalComponent;
+ let fixture: ComponentFixture<ApprovalComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ ApprovalComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ApprovalComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});

ADD
src/app/components/approval/approval.component.ts
+import { Component, OnInit } from '@angular/core';
+import { HeroService } from '../../services/hero/hero.service';
+import { TranslateService } from '@ngx-translate/core';
+
+@Component({
+ selector: 'app-approval',
+ templateUrl: './approval.component.html',
+ styleUrls: ['./approval.component.scss'],
+})
+export class ApprovalComponent implements OnInit {
+ constructor(
+ private heroService: HeroService,
+ private translator: TranslateService
+ ) {}
+
+ ngOnInit(): void {
+ this.setUpHero();
+ }
+
+ private setUpHero() {
+ this.heroService.setUpHero({
+ title: this.translator.instant('APPROVAL.APPROVAL'),
+ });
+ }
+}

MODIFY
src/app/components/marketplace-signup-stepper/marketplace-signup-stepper.component.html
src/app/components/marketplace-signup-stepper/marketplace-signup-stepper.component.html
</mat-card-actions>
</mat-card>
</mat-step>
- <mat-step label="{{ 'WIZARD.FORTH_STEP_LABEL' | translate }}">
+<!-- <mat-step label="{{ 'WIZARD.FORTH_STEP_LABEL' | translate }}">-->
+<!-- <mat-card>-->
+<!-- <mat-card-header>-->
+<!-- <mat-card-title>{{-->
+<!-- "WIZARD.FORTH_STEP_TITLE" | translate-->
+<!-- }}</mat-card-title>-->
+<!-- </mat-card-header>-->
+<!-- <mat-card-content class="mat-card-header-text">-->
+<!-- <app-my-apps-use-api [contract]="contract"></app-my-apps-use-api>-->
+<!-- <h3>Policies</h3>-->
+<!-- &lt;!&ndash;In this version we will not have more than 2 policies&ndash;&gt;-->
+<!-- <div class="policies" *ngIf="newContractDetails.policies">-->
+<!-- <app-policy-card-->
+<!-- *ngFor="let policy of newContractDetails.policies"-->
+<!-- [policy]="policy"-->
+<!-- ></app-policy-card>-->
+<!-- </div>-->
+<!-- </mat-card-content>-->
+<!-- <mat-divider></mat-divider>-->
+<!-- <mat-card-actions class="right">-->
+<!-- <button mat-raised-button color="primary" (click)="finish()">-->
+<!-- {{ "COMMON.FINISH" | translate }}-->
+<!-- </button>-->
+<!-- </mat-card-actions>-->
+<!-- </mat-card>-->
+<!-- </mat-step>-->
+
+
+ <mat-step>
+ <ng-template matStepLabel>{{ 'WIZARD.FORTH_STEP_LABEL' | translate }}</ng-template>
+ <ng-template matStepContent>
<mat-card>
<mat-card-header>
- <mat-card-title>{{
- "WIZARD.FORTH_STEP_TITLE" | translate
- }}</mat-card-title>
+ <mat-card-title>{{ "WIZARD.FORTH_STEP_TITLE" | translate }}</mat-card-title>
</mat-card-header>
<mat-card-content class="mat-card-header-text">
<app-my-apps-use-api [contract]="contract"></app-my-apps-use-api>
</button>
</mat-card-actions>
</mat-card>
+ </ng-template>
</mat-step>
</mat-stepper>
</div>

MODIFY
src/app/components/marketplace-signup-stepper/marketplace-signup-stepper.component.ts
src/app/components/marketplace-signup-stepper/marketplace-signup-stepper.component.ts
@@ -14,7 +14,7 @@ import { SignUpService } from '../../services/sign-up/sign-up.service';
import { ISignUpInfo } from '../../interfaces/ISignUpInfo';
import { BackendService } from '../../services/backend/backend.service';
import { MatStepper } from '@angular/material/stepper';
-import {IContractExt} from "../../interfaces/IContractExt";
+import { IContractExt } from '../../interfaces/IContractExt';
@Component({
selector: 'app-marketplace-signup-stepper',
@@ -106,13 +106,15 @@ export class MarketplaceSignupStepperComponent implements OnInit {
.createContract(client.organizationId, client.id, '1.0', contract)
.subscribe(
(contract: IContract) => {
-
this.snackbar.showPrimarySnackBar(
this.translator.instant('WIZARD.SUCCESS')
);
this.contract = contract as IContractExt;
-
+ if (this.contract.client.status === 'Ready') {
stepper.next();
+ } else {
+ void this.router.navigate(['approval']);
+ }
},
(error) => this.snackbar.showErrorSnackBar(error.message, error)
);

MODIFY
src/assets/i18n/en.json
src/assets/i18n/en.json
"API_KEY": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et",
"API_ENDPOINT": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et",
"OAUTH": "Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et"
+ },
+ "APPROVAL": {
+ "APPROVAL": "Approval Required",
+ "TITLE": "Thank you!",
+ "SUBTITLE": "Your subscription is awaiting approval by <i>KoolBank</i>",
+ "MORE_INFO": "You will receive an email notification when there is progress in your application"
}
}

fix: add approval flow for contracts