refactor: add features to home page
MODIFY
src/app/components/api-card-list/api-card-list.component.ts
src/app/components/api-card-list/api-card-list.component.ts
@@ -5,13 +5,13 @@ import {map, switchMap} from 'rxjs/operators';
import {forkJoin, Observable, of} from 'rxjs';
import {SpinnerService} from '../../services/spinner/spinner.service';
import {IApiSummary, ISearchCriteria} from '../../interfaces/ICommunication';
-import {ActivatedRoute, Params, Router} from "@angular/router";
-import {IApiSummaryExt} from "../../interfaces/IApiSummaryExt";
+import {ActivatedRoute, Params, Router} from '@angular/router';
+import {IApiSummaryExt} from '../../interfaces/IApiSummaryExt';
@Component({
selector: 'app-api-card-list',
templateUrl: './api-card-list.component.html',
- styleUrls: ['./api-card-list.component.scss'],
+ styleUrls: ['./api-card-list.component.scss']
})
export class ApiCardListComponent implements OnInit {
apis: IApiSummaryExt[] = [];
@@ -25,13 +25,13 @@ export class ApiCardListComponent implements OnInit {
{
name: 'name',
value: '*',
- operator: 'like',
- },
+ operator: 'like'
+ }
],
paging: {
page: 1,
- pageSize: 8,
- },
+ pageSize: 8
+ }
};
@Input() listType = '';
@@ -69,7 +69,12 @@ export class ApiCardListComponent implements OnInit {
this.searchTerm = '';
this.searchCriteria.filters[0].value = '*';
}
+
+ if (this.listType === 'api') {
this.getApiList();
+ } else if (this.listType === 'featuredApi') {
+ this.getFeaturedApiList();
+ }
});
}
@@ -89,16 +94,16 @@ export class ApiCardListComponent implements OnInit {
}
OnPageChange(event: PageEvent): void {
- this.router.navigate(['/marketplace'],
- {
+ this.router.navigate(['/marketplace'], {
queryParams: {
page: event.pageIndex + 1,
pageSize: event.pageSize,
searchTerm: this.searchCriteria.filters[0].value
- }});
+ }
+ });
}
- getApiList(): void {
+ private getApiList(): void {
this.loadingSpinnerService.startWaiting();
this.ready = false;
this.error = false;
@@ -113,46 +118,70 @@ export class ApiCardListComponent implements OnInit {
}),
switchMap((apiSummaries: IApiSummary[]) => {
+ return this.checkApisDocsInApiVersions(apiSummaries);
+ })
+ )
+ .subscribe(
+ (apiList: IApiSummaryExt[]) => {
+ this.apis = apiList;
+ this.loadingSpinnerService.stopWaiting();
+ this.ready = true;
+ },
+ () => {
+ this.error = true;
+ this.loadingSpinnerService.stopWaiting();
+ }
+ );
+ }
+
+ private getFeaturedApiList() {
+ this.loadingSpinnerService.startWaiting();
+ this.ready = false;
+ this.error = false;
+
+ this.apiService
+ .getFeaturedApis()
+ .pipe(
+ switchMap((apiSummaries: IApiSummary[]) => {
+ return this.checkApisDocsInApiVersions(apiSummaries);
+ })
+ )
+ .subscribe(
+ (apiList: IApiSummaryExt[]) => {
+ this.apis = apiList;
+ this.loadingSpinnerService.stopWaiting();
+ this.ready = true;
+ },
+ () => {
+ this.error = true;
+ this.loadingSpinnerService.stopWaiting();
+ }
+ );
+ }
+
+ private checkApisDocsInApiVersions(apiSummaries: IApiSummary[]) {
if (apiSummaries.length > 0) {
- return forkJoin(apiSummaries.map(apiSummary => {
- return this.apiService.getLatestApiVersion(apiSummary.organizationId, apiSummary.id).pipe(
- switchMap(latestApiVersion => {
+ return forkJoin(
+ apiSummaries.map((apiSummary) => {
+ return this.apiService
+ .getLatestApiVersion(apiSummary.organizationId, apiSummary.id)
+ .pipe(
+ switchMap((latestApiVersion) => {
return this.apiService.isApiDocAvailable(latestApiVersion).pipe(
- map(docsAvailable => {
+ map((docsAvailable) => {
return {
...apiSummary,
latestVersion: latestApiVersion.version,
docsAvailable: docsAvailable
} as IApiSummaryExt;
})
- )
+ );
+ })
+ );
})
);
- }));
} else {
- return of([]) as Observable<IApiSummaryExt[]>
+ return of([]) as Observable<IApiSummaryExt[]>;
}
- })
- ).subscribe((apiList: IApiSummaryExt[]) => {
- if (this.listType === 'api') {
- this.apis = apiList;
- } else if (this.listType === 'featuredApi') {
- this.apis = apiList.slice(0,4);
}
- this.loadingSpinnerService.stopWaiting();
- this.ready = true;
- }, () => {
- this.error = true;
- this.loadingSpinnerService.stopWaiting()
- });
- }
-
- //TODO implement real api call
-/* getFeaturedApis(): void {
- this.apiService
- .getFeaturedApis(this.searchCriteria)
- .subscribe((searchResult) => {
- this.apis = searchResult.beans;
- });
- }*/
}

MODIFY
src/app/services/api/api.service.ts
src/app/services/api/api.service.ts
@@ -15,36 +15,19 @@ import {
providedIn: 'root',
})
export class ApiService {
- apis: IApiSummary[] = [];
- currentApi!: Observable<IApi>;
- currentApiVersions!: Observable<IApiVersionSummary[]>;
-
constructor(private backendService: BackendService) {}
- getFeaturedApis(
- searchCriteria: ISearchCriteria
- ): Observable<ISearchResultsApiSummary> {
- return this.searchApis(searchCriteria).pipe(
- map((searchResult) => {
- searchResult.beans = searchResult.beans.slice(0, 4);
- return searchResult;
- })
- );
- }
-
- getApi(orgId: string, apiId: string): Observable<IApi> {
- return (this.currentApi = this.backendService
- .getApi(orgId, apiId)
- .pipe(retry(1), catchError(this.handleError)));
+ getFeaturedApis(): Observable<IApiSummary[]> {
+ return this.backendService.getFeaturedApis();
}
getApiVersionSummaries(
orgId: string,
apiId: string
): Observable<IApiVersionSummary[]> {
- return (this.currentApiVersions = this.backendService
+ return this.backendService
.getApiVersionSummaries(orgId, apiId)
- .pipe(retry(1), catchError(this.handleError)));
+ .pipe(retry(1), catchError(this.handleError));
}
searchApis(
@@ -78,9 +61,13 @@ export class ApiService {
}
isApiDocAvailable(apiSummary: IApiVersion): Observable<boolean> {
- return this.backendService.headApiDefinition(apiSummary.api.organization.id,
+ return this.backendService
+ .headApiDefinition(
+ apiSummary.api.organization.id,
apiSummary.api.id,
- apiSummary.version).pipe(
+ apiSummary.version
+ )
+ .pipe(
map(() => {
return true;
}),

refactor: add features to home page