fix(ui): fix my applications loading error
contracts with apis which are not exposed in the developer portal cause http errors when fetching additional data with /devportal endpoints
Those contracts are removed from the list now
MODIFY
src/app/components/img-or-icon-selector/img-or-icon-selector.component.ts
src/app/components/img-or-icon-selector/img-or-icon-selector.component.ts
@@ -14,16 +14,13 @@ import { ConfigService } from '../../services/config/config.service';
styleUrls: ['./img-or-icon-selector.component.scss']
})
export class ImgOrIconSelectorComponent implements AfterViewInit, OnChanges {
- @Input() imgUrl = '';
+ @Input() imgUrl: string | undefined = '';
@Input() dimension = '';
constructor(
public configService: ConfigService,
private cdr: ChangeDetectorRef
- ) {
- // this.imgUrl = '';
- // this.dimension = '';
- }
+ ) {}
ngOnChanges(changes: SimpleChanges): void {
this.imgUrl = changes.imgUrl ? (changes.imgUrl.currentValue as string) : '';

MODIFY
src/app/components/my-apps/my-apps.component.html
src/app/components/my-apps/my-apps.component.html
<div class="app-api-content mat-elevation-z2">
<div class="app-api-header">
<app-img-or-icon-selector
- *ngIf="apiImages.has(contract.api.api.name)"
- [imgUrl]="apiImages.get(contract.api.api.name)!"
+ [imgUrl]="contract.api.api.image"
[dimension]="'44'">
</app-img-or-icon-selector>
<div

MODIFY
src/app/components/my-apps/my-apps.component.ts
src/app/components/my-apps/my-apps.component.ts
@@ -14,9 +14,7 @@ import {
IClientVersionSummary,
IContract,
IContractSummary,
- IPermission,
- ISearchCriteria,
- ISearchResultsApiSummary
+ IPermission
} from '../../interfaces/ICommunication';
import { IContractExt } from '../../interfaces/IContractExt';
import { PolicyService } from '../../services/policy/policy.service';
@@ -42,7 +40,6 @@ import { PermissionsService } from '../../services/permissions/permissions.servi
export class MyAppsComponent implements OnInit {
contracts: IContractExt[] = [];
clientContractsMap!: Map<string, IContractExt[]>;
- apiImages = new Map<string, string>();
contractsLoaded = false;
tocLinks: ITocLink[] = [];
@@ -127,8 +124,14 @@ export class MyAppsComponent implements OnInit {
);
}),
switchMap((contracts: IContract[]) => {
+ // Filter out contracts with apis which are not exposed in developer portal
+ const filteredContracts: IContract[] = contracts.filter(
+ (contract) => {
+ return contract.api.exposeInPortal;
+ }
+ );
return forkJoin(
- contracts.map((contract) => {
+ filteredContracts.map((contract) => {
const orgId = contract.plan.plan.organization.id;
return forkJoin([
this.policyService.getPlanPolicies(
@@ -142,23 +145,13 @@ export class MyAppsComponent implements OnInit {
contract.api.api.id,
contract.api.version
),
- this.apiService.isApiDocAvailable(contract.api),
- this.apiService.getApiImage(contract)
+ this.apiService.isApiDocAvailable(contract.api)
]).pipe(
- map(
- ([
- planPolicies,
- endpoint,
- docsAvailable,
- apiSearchResult
- ]) => {
+ map(([planPolicies, endpoint, docsAvailable]) => {
planPolicies.forEach((planPolicy) => {
this.policyService.initPolicy(planPolicy);
});
- this.apiImages.set(
- contract.api.api.name,
- apiSearchResult.beans[0].image
- );
+
return {
...contract,
policies: planPolicies,
@@ -167,8 +160,7 @@ export class MyAppsComponent implements OnInit {
docsAvailable: docsAvailable,
deletable: this.isDeleteAllowed(contract)
} as IContractExt;
- }
- )
+ })
);
})
);
@@ -276,7 +268,6 @@ export class MyAppsComponent implements OnInit {
}
formatClientContractTitle(key: string): string {
- if (this.clientContractsMap.has(key)) {
return (
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
this.clientContractsMap.get(key)![0].client.client.name +
@@ -284,9 +275,6 @@ export class MyAppsComponent implements OnInit {
// eslint-disable-next-line @typescript-eslint/no-non-null-assertion
this.clientContractsMap.get(key)![0].client.version
);
- } else {
- return '';
- }
}
private generateTocLinks() {

MODIFY
src/app/components/plan-card-list/plan-card-list.component.ts
src/app/components/plan-card-list/plan-card-list.component.ts
@@ -6,7 +6,6 @@ import { IApiPlanSummary } from '../../interfaces/ICommunication';
import { IPolicyExt } from '../../interfaces/IPolicy';
import { PolicyService } from '../../services/policy/policy.service';
import { IApiVersionExt } from '../../interfaces/IApiVersionExt';
-import { KeycloakService } from 'keycloak-angular';
import { map } from 'rxjs/operators';
@Component({

MODIFY
src/app/interfaces/ICommunication.ts
src/app/interfaces/ICommunication.ts
@@ -85,6 +85,7 @@ export interface IApiVersion {
disableKeysStrip: boolean;
definitionUrl: string;
extendedDescription: string;
+ exposeInPortal: boolean;
}
export interface IOrganization {

MODIFY
src/app/services/api/api.service.ts
src/app/services/api/api.service.ts
@@ -6,7 +6,6 @@ import {
IApiSummary,
IApiVersion,
IApiVersionSummary,
- IContract,
ISearchCriteria,
ISearchResultsApiSummary
} from '../../interfaces/ICommunication';
@@ -82,19 +81,6 @@ export class ApiService {
);
}
- // Reminder: ApiVersions do not have api.api.image property
- // Therefore we need to use the search endpoint to receive the image
- getApiImage(contract: IContract): Observable<ISearchResultsApiSummary> {
- const searchCriteria: ISearchCriteria = {
- filters: [
- { name: 'name', value: contract.api.api.name, operator: 'like' }
- ],
- paging: { page: 1, pageSize: 1 }
- };
-
- return this.backendService.searchApis(searchCriteria);
- }
-
handleError(error: HttpErrorResponse): Observable<never> {
let errorMessage = '';
if (error.error instanceof ErrorEvent) {

fix(ui): fix my applications loading error
contracts with apis which are not exposed in the developer portal cause http errors when fetching additional data with /devportal endpoints
Those contracts are removed from the list now