feat: batch query version

Change-Id: I09c9b74122891272877602ba1448cd9e91ff9ce3

src/web/src/app/app.component.ts

@@ -1,16 +1,11 @@
 import { Component, OnInit, ViewChild, ElementRef, Renderer } from '@angular/core';
-import { Router, NavigationStart } from '@angular/router';
-import { Observable } from 'rxjs';
-import { filter, pairwise } from 'rxjs/operators';
-import { environment } from 'environments/environment';
+import { Router } from '@angular/router';
 
 import { BaseService } from './dstore/services/base.service';
-import { StoreService } from './dstore-client.module/services/store.service';
 import { AppService } from './services/app.service';
-import { SearchService, SearchResult } from './services/search.service';
+import { SearchService } from './services/search.service';
 import { Channel } from './dstore-client.module/utils/channel';
 import { App } from './dstore/services/app';
-import { OffsetService } from './services/offset.service';
 import { DstoreObject } from './dstore-client.module/utils/dstore-objects';
 import { ThemeService } from './services/theme.service';
 
@@ -24,7 +19,6 @@ export class AppComponent implements OnInit {
     private router: Router,
     private appService: AppService,
     private searchService: SearchService,
-    private offsetService: OffsetService,
     private themeService: ThemeService,
   ) {}
   @ViewChild('$context')
@@ -45,7 +39,7 @@ export class AppComponent implements OnInit {
 
   searchIndex() {
     if (BaseService.isNative) {
-      this.appService.listNoVersion().subscribe((apps: App[]) => {
+      this.appService.list().subscribe((apps: App[]) => {
         const appStringList = JSON.stringify(apps);
         Channel.exec('search.updateAppList', appStringList);
       });

src/web/src/app/components/app-list/app-list.component.ts

@@ -109,8 +109,8 @@ export class AppListComponent implements OnInit, OnChanges, OnDestroy {
   ngOnChanges() {
     if (this.apps$) {
       this.loading = true;
-      this.apps$.subscribe(apps => {
-        apps = apps.filter(app => app);
+      this.apps$.subscribe(async apps => {
+        apps = apps.filter(Boolean);
         if (this.sortBy) {
           if (this.sortBy === SortOrder.Downloads) {
             apps = sortBy(apps, ['downloads', 'name']).reverse();
@@ -121,6 +121,14 @@ export class AppListComponent implements OnInit, OnChanges, OnDestroy {
         if (this.maxCount) {
           apps = apps.slice(0, this.maxCount);
         }
+        const versionMap = await this.storeService
+          .getVersionMap(apps.map(app => app.name))
+          .toPromise();
+        apps = apps.filter(app => versionMap.has(app.name)).map(app => {
+          app.version = versionMap.get(app.name);
+          return app;
+        });
+
         this.apps = apps;
         this.appListLength.emit(this.apps.length);
         this.loading = false;

src/web/src/app/components/index/index.component.ts

@@ -32,7 +32,7 @@ export class IndexComponent implements OnInit, OnDestroy {
   jobs$: Subscription;
 
   ngOnInit() {
-    this.appService.appMap().subscribe(appMap => {
+    this.appService.getAppMap().subscribe(appMap => {
       this.appMap = appMap;
       this.sectionList$ = this.sectionService.getList().pipe(map(ss => ss.filter(s => s.show)));
     });

src/web/src/app/dstore-client.module/components/job-button/job-button.component.ts

@@ -9,11 +9,16 @@ import { StoreService } from '../../services/store.service';
 })
 export class JobButtonComponent implements OnInit {
   constructor(private storeService: StoreService) {}
-  @Input() appName: string;
-  @Input() localName: string;
-  @Input() version: AppVersion;
-  @Input() openType: string;
-  @Output() start = new EventEmitter<string>();
+  @Input()
+  appName: string;
+  @Input()
+  localName: string;
+  @Input()
+  version: AppVersion;
+  @Input()
+  openType: string;
+  @Output()
+  start = new EventEmitter<string>();
   canOpen = canOpen;
   disabled: boolean;
 

src/web/src/app/dstore-client.module/services/store.service.ts

@@ -139,11 +139,11 @@ export class StoreService {
   }
 
   getVersionMap(appNameList: string[]): Observable<Map<string, AppVersion>> {
-    return this.execWithCallback(
-      'storeDaemon.queryVersions',
-      appNameList.toString(),
-      appNameList,
-    ).pipe(map((vs: AppVersion[]) => new Map(_.toPairs(_.keyBy(vs, 'name')))));
+    return this.getVersion(appNameList).pipe(
+      map((vs: AppVersion[]) => {
+        return new Map(vs.map(v => [v.name, v] as [string, AppVersion]));
+      }),
+    );
   }
 
   getInstalledApps(): Observable<InstalledApp[]> {

src/web/src/app/dstore/components/assemble/assemble.component.html

@@ -8,8 +8,8 @@
            [routerLink]="['/category',$assemble.category]">
         {{categoryList[$assemble.category].LocalName}}
       </div>
-      <ng-container *ngFor="let $index of section.rowSpan|range;first as $first">
-        <ng-container *ngIf="filter($assemble.apps)[$index]?.name|appInfo|async as $app">
+      <ng-container *ngFor="let $assembleApp of $assemble.apps">
+        <ng-container *ngIf="$assembleApp.name|appInfo|async as $app">
           <div class="item"
                [class.job]="jobs.has($app.name) || jobsNames.has($app.name)"
                [routerLink]="$app.name">

src/web/src/app/dstore/components/assemble/assemble.component.ts

@@ -29,9 +29,12 @@ export class AssembleComponent implements OnInit, OnDestroy {
   StoreJobStatus = StoreJobStatus;
   StoreJobType = StoreJobType;
 
-  @Input() section: Section;
-  @Input() assembleList: SectionAssemble[] = [];
-  @Input() appFilter: AppFilterFunc = Allowed;
+  @Input()
+  section: Section;
+  @Input()
+  assembleList: SectionAssemble[] = [];
+  @Input()
+  appFilter: AppFilterFunc = Allowed;
 
   constructor(
     private appService: AppService,
@@ -62,8 +65,9 @@ export class AssembleComponent implements OnInit, OnDestroy {
     this.jobs$.unsubscribe();
   }
 
-  filter(apps: SectionApp[]) {
-    return apps.filter(app => this.appFilter(app.name));
+  async filter(apps: SectionApp[]) {
+    const versionMap = await this.storeService.getVersionMap(apps.map(app => app.name)).toPromise();
+    return apps.filter(app => versionMap.has(app.name));
   }
 
   getJobs() {

src/web/src/app/dstore/components/cover/cover.component.ts

@@ -35,9 +35,12 @@ export class CoverComponent implements OnInit, OnDestroy {
   StoreJobStatus = StoreJobStatus;
   StoreJobType = StoreJobType;
 
-  @Input() section: Section;
-  @Input() apps: SectionApp[];
-  @Input() appFilter: AppFilterFunc = Allowed;
+  @Input()
+  section: Section;
+  @Input()
+  apps: SectionApp[];
+  @Input()
+  appFilter: AppFilterFunc = Allowed;
   // data
   moreNav: any[];
   appList: App[] = [];

src/web/src/app/dstore/components/icon/icon.component.ts

@@ -31,9 +31,12 @@ export class IconComponent implements OnInit, OnDestroy {
   StoreJobStatus = StoreJobStatus;
   StoreJobType = StoreJobType;
 
-  @Input() section: Section;
-  @Input() apps: SectionApp[];
-  @Input() appFilter: AppFilterFunc = Allowed;
+  @Input()
+  section: Section;
+  @Input()
+  apps: SectionApp[];
+  @Input()
+  appFilter: AppFilterFunc = Allowed;
 
   // data
   moreNav: any[] = [];

src/web/src/app/dstore/components/phrase/phrase.component.ts

@@ -38,9 +38,12 @@ export class PhraseComponent implements OnInit, OnDestroy {
   StoreJobType = StoreJobType;
 
   // input
-  @Input() section: Section;
-  @Input() phraseList: SectionPhrase[] = [];
-  @Input() appFilter: AppFilterFunc = Allowed;
+  @Input()
+  section: Section;
+  @Input()
+  phraseList: SectionPhrase[] = [];
+  @Input()
+  appFilter: AppFilterFunc = Allowed;
 
   // data
   moreNav: any[] = [];

src/web/src/app/dstore/components/ranking/ranking.component.ts

@@ -4,7 +4,7 @@ import { Observable, Subscription, merge, timer, of } from 'rxjs';
 import { map, tap, flatMap, shareReplay, switchMap, concat, startWith } from 'rxjs/operators';
 
 import { BaseService } from '../../services/base.service';
-import { App, AppService } from '../../../services/app.service';
+import { App, AppService } from 'app/services/app.service';
 
 import { Section } from '../../services/section';
 import { AppFilterFunc, Allowed } from '../appFilter';
@@ -29,8 +29,10 @@ export class RankingComponent implements OnInit, OnDestroy {
   StoreJobStatus = StoreJobStatus;
   StoreJobType = StoreJobType;
 
-  @Input() section: Section;
-  @Input() appFilter: AppFilterFunc = Allowed;
+  @Input()
+  section: Section;
+  @Input()
+  appFilter: AppFilterFunc = Allowed;
 
   appList: App[];
   jobs: { [key: string]: StoreJobInfo } = {};
@@ -43,22 +45,16 @@ export class RankingComponent implements OnInit, OnDestroy {
   openApp = this.storeService.openApp;
 
   ngOnInit() {
-    console.log('ranking');
     const category = this.section.ranking.category;
-    this.appService.list().subscribe(apps => {
+    this.appService.list().subscribe(async apps => {
       if (category) {
         apps = apps.filter(app => app.category === category);
       }
-      this.appList = apps
-        .filter(app => {
-          if (category) {
-            return app.category === category && this.appFilter(app.name);
-          } else {
-            return this.appFilter(app.name);
-          }
-        })
-        .sort((a, b) => b.downloads - a.downloads)
-        .slice(0, this.section.ranking.count);
+      apps.sort((a, b) => b.downloads - a.downloads).slice(0, this.section.ranking.count);
+      const versionMap = await this.storeService
+        .getVersionMap(apps.map(app => app.name))
+        .toPromise();
+      this.appList = apps.filter(app => versionMap.has(app.name));
       this.getJobs();
     });
   }

src/web/src/app/dstore/pipes/app-info.ts

@@ -1,18 +1,36 @@
 import { Pipe, PipeTransform } from '@angular/core';
-import { Observable } from 'rxjs';
-import { shareReplay } from 'rxjs/operators';
+import { Observable, Subject } from 'rxjs';
+import { scan, debounceTime, share, flatMap, map, shareReplay } from 'rxjs/operators';
 
 import { memoize } from 'lodash';
 
-import { AppService } from '../services/app.service';
+import { AppService } from 'app/services/app.service';
 
 @Pipe({
   name: 'appInfo',
 })
 export class AppInfoPipe implements PipeTransform {
+  private query$ = new Subject<string>();
+  private result$ = this.getResult();
   constructor(private appService: AppService) {}
-
-  transform = memoize(
-    name => (!name ? undefined : this.appService.getAppByName(name).pipe(shareReplay())),
-  );
+  getResult() {
+    return this.query$.pipe(
+      scan((list: string[], name: string) => [...list, name], []),
+      debounceTime(10),
+      flatMap(list => {
+        return this.appService.getApps(list);
+      }),
+      share(),
+    );
+  }
+  transform(name: string) {
+    setTimeout(() => {
+      this.query$.next(name);
+    }, 0);
+    return this.result$.pipe(
+      map(list => {
+        return list.find(app => app.name === name);
+      }),
+    );
+  }
 }