refactor: create contracts, css fixes, interface changes
MODIFY
src/app/components/api-card/api-card.component.html
src/app/components/api-card/api-card.component.html
mat-raised-button
color="primary"
class="api-card-button"
- [disabled]="!api.docsAvailable"
+ *ngIf="!api.docsAvailable"
[routerLink]="[
'/swagger',
api.organizationId,

MODIFY
src/app/components/header/header.component.scss
src/app/components/header/header.component.scss
position: absolute;
bottom: 10%;
left: 3%;
- width: 10%;
- button {
- width: 100%;
- }
}
.hero-large {

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-content>
<mat-divider></mat-divider>
<mat-card-actions class="right">
- <button mat-raised-button matStepperNext color="primary">
- {{ "COMMON.NEXT" | translate }}
+ <button
+ mat-raised-button
+ (click)="createContract(stepper)"
+ color="primary"
+ >
+ {{ "COMMON.CONFIRM" | translate }}
</button>
</mat-card-actions>
</mat-card>
</mat-step>
- <mat-step label="{{ 'WIZARD.FORTH_STEP_LABEL' | translate }}" state="phone">
+ <mat-step label="{{ 'WIZARD.FORTH_STEP_LABEL' | translate }}">
<mat-card>
<mat-card-header>
<mat-card-title>{{

MODIFY
src/app/components/marketplace-signup-stepper/marketplace-signup-stepper.component.ts
src/app/components/marketplace-signup-stepper/marketplace-signup-stepper.component.ts
import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
import { HeroService } from '../../services/hero/hero.service';
import { TranslateService } from '@ngx-translate/core';
-import { IClientSummary } from '../../interfaces/ICommunication';
+import {
+ IClientSummary,
+ IContract,
+ INewContract,
+} from '../../interfaces/ICommunication';
import { SnackbarService } from '../../services/snackbar/snackbar.service';
import { ConfigService } from '../../services/config/config.service';
+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';
@Component({
selector: 'app-marketplace-signup-stepper',
@@ -15,19 +23,25 @@ export class MarketplaceSignupStepperComponent implements OnInit {
selectedClients = new Set<IClientSummary>();
agreedTermsAndPrivacy: boolean | undefined;
termsEnabled: boolean;
+ infos: ISignUpInfo;
constructor(
private heroService: HeroService,
private route: ActivatedRoute,
private translator: TranslateService,
private snackbar: SnackbarService,
- private configService: ConfigService
+ private configService: ConfigService,
+ private signUpService: SignUpService,
+ private router: Router,
+ private backend: BackendService
) {
this.termsEnabled = this.configService.getTerms().enabled;
+ this.infos = this.signUpService.getSignUpInfo();
}
ngOnInit(): void {
this.setUpHero();
+ this.checkNavigationAllowed();
}
private setUpHero() {
@@ -58,4 +72,40 @@ export class MarketplaceSignupStepperComponent implements OnInit {
this.translator.instant('WIZARD.TERMS_ERROR')
);
}
+
+ private checkNavigationAllowed() {
+ if (!this.infos) {
+ this.snackbar.showErrorSnackBar(
+ this.translator.instant('WIZARD.REDIRECT')
+ );
+ void this.router.navigate(['home']);
+ }
+ }
+
+ createContract(stepper: MatStepper): void {
+ const client: IClientSummary = this.selectedClients.values().next().value;
+
+ const contract: INewContract = {
+ apiOrgId: this.infos.organizationId,
+ apiId: this.infos.apiVersion.api.id,
+ apiVersion: this.infos.apiVersion.version,
+ // planId: this.infos.plan.id,
+ planId: 'Petstore',
+ };
+
+ this.backend
+ .createContract(client.organizationId, client.id, '1.0', contract)
+ .subscribe(
+ (contract: IContract) => {
+ this.snackbar.showPrimarySnackBar(
+ this.translator.instant('WIZARD.SUCCESS')
+ );
+ stepper.next();
+ },
+ (error) => {
+ this.snackbar.showErrorSnackBar(error.message);
+ console.error(error);
+ }
+ );
+ }
}

MODIFY
src/app/interfaces/ISignUpInfo.ts
src/app/interfaces/ISignUpInfo.ts
-import {IApiVersion} from "./ICommunication";
-import {Plan} from "./plan";
+import { IApiVersion } from './ICommunication';
+import { Plan } from './plan';
export interface ISignUpInfo {
- api: IApiVersion;
+ apiVersion: IApiVersion;
plan: Plan;
organizationId: string;
}

MODIFY
src/app/services/backend/backend.service.ts
src/app/services/backend/backend.service.ts
@@ -7,7 +7,11 @@ import {
IApi,
IApiVersion,
IApiVersionSummary,
- IClient, IClientSummary, IContract, IContractSummary,
+ IClient,
+ IClientSummary,
+ IContract,
+ IContractSummary,
+ INewContract,
IOrganization,
IOrganizationSummary,
ISearchCriteria,
@@ -15,7 +19,7 @@ import {
} from '../../interfaces/ICommunication';
import {
IClientSummaryBean,
- IClientVersionSummaryBean
+ IClientVersionSummaryBean,
} from '../../interfaces/ICommunication';
export interface ApiSummaryBean {
@@ -104,9 +108,11 @@ export class BackendService {
private readonly endpoint: string;
userName: string;
- constructor(private http: HttpClient,
+ constructor(
+ private http: HttpClient,
private configService: ConfigService,
- private keycloak: KeycloakService) {
+ private keycloak: KeycloakService
+ ) {
this.endpoint = configService.getEndpoint();
this.userName = this.keycloak.getKeycloakInstance().profile?.username!;
}
@@ -125,9 +131,9 @@ export class BackendService {
public searchApis(
searchCriteria: ISearchCriteria
): Observable<ISearchResultsApiSummary> {
- const url = this.endpoint + '/search/apis';
+ const path = '/search/apis';
return this.http.post(
- url,
+ this.generateUrl(path),
searchCriteria,
this.httpOptions
) as Observable<ISearchResultsApiSummary>;
@@ -137,8 +143,11 @@ export class BackendService {
* Get Api
*/
public getApi(orgId: string, apiId: string): Observable<IApi> {
- const url = this.endpoint + `/organizations/${orgId}/apis/${apiId}`;
- return this.http.get(url, this.httpOptions) as Observable<IApi>;
+ const path = `/organizations/${orgId}/apis/${apiId}`;
+ return this.http.get(
+ this.generateUrl(path),
+ this.httpOptions
+ ) as Observable<IApi>;
}
/**
@@ -148,9 +157,11 @@ export class BackendService {
orgId: string,
apiId: string
): Observable<IApiVersionSummary[]> {
- const url =
- this.endpoint + `/organizations/${orgId}/apis/${apiId}/versions`;
- return this.http.get<IApiVersionSummary[]>(url, this.httpOptions);
+ const path = `/organizations/${orgId}/apis/${apiId}/versions`;
+ return this.http.get<IApiVersionSummary[]>(
+ this.generateUrl(path),
+ this.httpOptions
+ );
}
/**
@@ -161,53 +172,85 @@ export class BackendService {
apiId: string,
version: string
): Observable<IApiVersion> {
- const url =
- this.endpoint +
- `/organizations/${orgId}/apis/${apiId}/versions/${version}`;
- return this.http.get<IApiVersion>(url, this.httpOptions);
+ const path = `organizations/${orgId}/apis/${apiId}/versions/${version}`;
+ return this.http.get<IApiVersion>(this.generateUrl(path), this.httpOptions);
}
public getClientOrgs(): Observable<Array<IOrganizationSummary>> {
const username = this.keycloak.getKeycloakInstance().profile?.username;
- const url = this.endpoint + `/users/${username}/clientorgs`;
- return this.http.get(url) as Observable<Array<IOrganizationSummary>>;
+ const path = `users/${username}/clientorgs`;
+ return this.http.get(this.generateUrl(path)) as Observable<
+ Array<IOrganizationSummary>
+ >;
}
public createClient(
orgId: string,
clientName: string
): Observable<IOrganization> {
- const url = this.endpoint + `/organizations/${orgId}/clients`;
- return this.http.post(url, {
+ const path = `organizations/${orgId}/clients`;
+ return this.http.post(this.generateUrl(path), {
name: clientName,
initialVersion: '1.0',
description: '',
}) as Observable<IOrganization>;
}
+ public createContract(
+ organizationId: string,
+ clientId: string,
+ versionName: string,
+ contract: INewContract
+ ): Observable<IContract> {
+ const path = `organizations/${organizationId}/clients/${clientId}/versions/${versionName}/contracts`;
+ return this.http.post(
+ this.generateUrl(path),
+ contract
+ ) as Observable<IContract>;
+ }
+
public getEditableClients(): Observable<Array<IClientSummaryBean>> {
const path = `users/${this.userName}/editable-clients`;
- return this.http.get(this.generateUrl(path)) as Observable<Array<IClientSummaryBean>>;
+ return this.http.get(this.generateUrl(path)) as Observable<
+ Array<IClientSummaryBean>
+ >;
}
- public getClientVersions(organizationId: string, clientId: string): Observable<Array<IClientVersionSummaryBean>> {
- const path = `/organizations/${organizationId}/clients/${clientId}/versions`;
- return this.http.get(this.generateUrl(path)) as Observable<Array<IClientVersionSummaryBean>>;
+ public getClientVersions(
+ organizationId: string,
+ clientId: string
+ ): Observable<Array<IClientVersionSummaryBean>> {
+ const path = `organizations/${organizationId}/clients/${clientId}/versions`;
+ return this.http.get(this.generateUrl(path)) as Observable<
+ Array<IClientVersionSummaryBean>
+ >;
}
- public getContracts(organizationId: string, clientId: string, versionName: string): Observable<IContractSummary[]> {
- const path = `/organizations/${organizationId}/clients/${clientId}/versions/${versionName}/contracts`;
- return this.http.get(this.generateUrl(path)) as Observable<IContractSummary[]>;
+ public getContracts(
+ organizationId: string,
+ clientId: string,
+ versionName: string
+ ): Observable<IContractSummary[]> {
+ const path = `organizations/${organizationId}/clients/${clientId}/versions/${versionName}/contracts`;
+ return this.http.get(this.generateUrl(path)) as Observable<
+ IContractSummary[]
+ >;
}
- public getContract(organizationId: string, clientId: string, versionName: string, contractId: number): Observable<Array<IContract>> {
+ public getContract(
+ organizationId: string,
+ clientId: string,
+ versionName: string,
+ contractId: number
+ ): Observable<Array<IContract>> {
const path = `/organizations/${organizationId}/clients/${clientId}/versions/${versionName}/contracts/${contractId}`;
- return this.http.get(this.generateUrl(path)) as Observable<Array<IContract>>;
+ return this.http.get(this.generateUrl(path)) as Observable<
+ Array<IContract>
+ >;
}
/********* Helper **********/
private generateUrl(path: string) {
return `${this.endpoint}/${path}`;
}
-
}

MODIFY
src/app/services/sign-up/sign-up.service.ts
src/app/services/sign-up/sign-up.service.ts
import { Injectable } from '@angular/core';
-import {ISignUpInfo} from "../../interfaces/ISignUpInfo";
-import {IApiVersion} from "../../interfaces/ICommunication";
-import {Plan} from "../../interfaces/plan";
+import { ISignUpInfo } from '../../interfaces/ISignUpInfo';
+import { IApiVersion } from '../../interfaces/ICommunication';
+import { Plan } from '../../interfaces/plan';
@Injectable({
- providedIn: 'root'
+ providedIn: 'root',
})
export class SignUpService {
+ signUpInfo?: ISignUpInfo;
- signUpInfo: ISignUpInfo | undefined;
-
- constructor() { }
-
- public getSignUpInfo(): ISignUpInfo | undefined {
- return this.signUpInfo;
+ public getSignUpInfo(): ISignUpInfo {
+ return this.signUpInfo!;
}
- public setSignUpInfo(apiVersion: IApiVersion, plan: Plan, organizationId: string): void {
+ public setSignUpInfo(
+ apiVersion: IApiVersion,
+ plan: Plan,
+ organizationId: string
+ ): void {
this.signUpInfo = {
- api: apiVersion,
+ apiVersion: apiVersion,
plan: plan,
- organizationId: organizationId
- }
+ organizationId: organizationId,
+ };
}
}

refactor: create contracts, css fixes, interface changes