Consolidated the get region methods in the gene and region services a…

…nd updated the gene and track detail components to use an RxJS flatten operator when calling these methods.
legumeinfo · Nov 2, 2022 · 41e11e8 · 41e11e8
1 parent bcf6340
commit 41e11e8
Show file tree

Hide file tree

Showing 4 changed files with 59 additions and 54 deletions.
diff --git a/src/app/gene/components/details/gene/gene-detail.component.ts b/src/app/gene/components/details/gene/gene-detail.component.ts
@@ -1,11 +1,11 @@
 // Angular
 import { Component, Input, OnDestroy, OnInit } from '@angular/core';
-import { Observable, Subject } from 'rxjs';
-import { map, take, takeUntil } from 'rxjs/operators';
+import { Subject } from 'rxjs';
+import { filter, map, switchMap, take, takeUntil } from 'rxjs/operators';
 // App
-import { AppConfig, Server } from '@gcv/core/models';
-import { GeneService } from '@gcv/gene/services';
-import { Gene } from '@gcv/gene/models';
+import { AppConfig } from '@gcv/core/models';
+import { GeneService, RegionService } from '@gcv/gene/services';
+
 
 @Component({
   selector: 'gcv-gene-detail',
@@ -26,7 +26,6 @@ import { Gene } from '@gcv/gene/models';
     </div>
   `,
 })
-
 export class GeneDetailComponent implements OnDestroy, OnInit {
 
   @Input() gene: string;
@@ -41,7 +40,11 @@ export class GeneDetailComponent implements OnDestroy, OnInit {
   singleGeneMatrix = {};
   familyTreeLink: string = '';
 
-  constructor(private _appConfig: AppConfig, private _geneService: GeneService) {
+  constructor(
+    private _appConfig: AppConfig,
+    private _geneService: GeneService,
+    private _regionService: RegionService,
+  ) {
     this._serverIDs = _appConfig.getServerIDs();
   }
 
@@ -54,37 +57,49 @@ export class GeneDetailComponent implements OnDestroy, OnInit {
 
   ngOnInit(): void {
     const server = this._appConfig.getServer(this.source);
-    //get gene details to convert to region
-    this._geneService.getGenes([this.gene], this.source)
-      .pipe(map((genes) => genes[0]))
-      .subscribe((geneInstance) => this._processInstance(geneInstance));
+
+    // set the tree link
     if (server !== undefined) {
       if (server.hasOwnProperty('familyTreeLink')) {
         this.familyTreeLink = server.familyTreeLink.url + this.family;
       }
       this.singleGeneMatrix[this.source] = this.gene;
     }
+
+    // get gene details
     this._geneService.getGeneDetails(this.gene, this.source)
       .pipe(
         takeUntil(this._destroy),
         take(1))
-      .subscribe((geneLinks) => this._process(geneLinks));
+      .subscribe(this._processGeneLinks);
+
+    // get gene region details
+    this._geneService.getGenes([this.gene], this.source)
+      .pipe(
+        filter((genes) => genes.length > 0),
+        map((genes) => genes[0]),
+        switchMap((gene) => {
+          return this._regionService
+            .getRegionDetails(
+              gene.chromosome,
+              gene.fmin,
+              gene.fmax,
+              this.source,
+            );
+        }),
+        takeUntil(this._destroy),
+        take(1))
+      .subscribe(this._processRegionLinks);
   }
 
   // private
 
-  private _process(links: any[]) {
+  private _processGeneLinks(links: any[]) {
     this.geneLinks = links;
   }
-  private _processRegion(links: any[]) {
+
+  private _processRegionLinks(links: any[]) {
     this.regionLinks = links;
   }
 
-  private _processInstance(instance: Gene) {
-    this._geneService.getGeneRegionDetails(instance, this.source)
-      .pipe(
-        takeUntil(this._destroy),
-        take(1))
-      .subscribe((regionLinks) => this._processRegion(regionLinks));
-  }
 }
diff --git a/src/app/gene/components/details/track/track-detail.component.ts b/src/app/gene/components/details/track/track-detail.component.ts
@@ -1,12 +1,11 @@
 // Angular
 import { Component, Input, OnDestroy, OnInit } from '@angular/core';
-import { Observable, Subject } from 'rxjs';
-import { map, take, takeUntil } from 'rxjs/operators';
+import { Subject } from 'rxjs';
+import { filter, switchMap, take, takeUntil } from 'rxjs/operators';
 // App
-import { AppConfig, Server } from '@gcv/core/models';
+import { AppConfig } from '@gcv/core/models';
 import { RegionService, GeneService } from '@gcv/gene/services';
-import { Gene, Track } from '@gcv/gene/models';
-import { ClusterMixin } from '@gcv/gene/models/mixins';
+import { Track } from '@gcv/gene/models';
 
 
 @Component({
@@ -43,10 +42,12 @@ export class TrackDetailComponent implements OnDestroy, OnInit {
   focus: string;
   familyTreeLink: string = '';
   regionLinks: any[] = [];
-  fmin: number;
-  fmax: number;
 
-  constructor(private _appConfig: AppConfig, private _regionService: RegionService, private _geneService: GeneService) {
+  constructor(
+    private _appConfig: AppConfig,
+    private _geneService: GeneService,
+    private _regionService: RegionService,
+  ) {
     this._serverIDs = _appConfig.getServerIDs();
   }
 
@@ -61,36 +62,31 @@ export class TrackDetailComponent implements OnDestroy, OnInit {
     const i = Math.floor(this.track.genes.length / 2);
     this.focus = this.track.genes[i];
     const server = this._appConfig.getServer(this.track.source);
+
+    // set the tree link
     if (server !== undefined && server.hasOwnProperty('familyTreeLink')) {
       this.familyTreeLink = server.familyTreeLink.url;
     }
+
+    // get region details
     const first = this.track.genes[0];
     const last = this.track.genes[this.track.genes.length-1];
     this._geneService.getGenes([first, last], this.track.source)
       .pipe(
+        filter((genes) => genes.length >= 2),
+        switchMap((genes) => {
+          const fmin = Math.min(genes[0].fmin, genes[1].fmin);
+          const fmax = Math.max(genes[0].fmax, genes[1].fmax);
+          return this._regionService
+            .getRegionDetails(this.track.name, fmin, fmax, this.track.source);
+        }),
         takeUntil(this._destroy),
         take(1))
-      .subscribe(([firstGene, lastGene]) => this._setBounds(firstGene,lastGene));
+      .subscribe(this._processRegionLinks);
   }
 
-  private _process(links: any[]) {
+  private _processRegionLinks(links: any[]) {
     this.regionLinks = links;
   }
 
-  private _setBounds(first: Gene, last: Gene) {
-    if (first.fmin < last.fmin) {
-        this.fmin = first.fmin;
-        this.fmax = last.fmax;
-    }
-    else {
-        this.fmin = last.fmin;
-        this.fmax = first.fmax;
-    }
-    this._regionService.getRegionDetails(this.track.name, this.fmin, this.fmax, this.track.source)
-      .pipe(
-        takeUntil(this._destroy),
-        take(1))
-      .subscribe((regionLinks) => this._process(regionLinks));
-  }
-
 }
diff --git a/src/app/gene/components/details/track/track-detail.layout.ts b/src/app/gene/components/details/track/track-detail.layout.ts
@@ -6,7 +6,7 @@ export const trackDetailLayoutComponent =
   {component: TrackDetailComponent, name: 'track'};
 
 
-export function trackDetailConfigFactory(track, source) {
+export function trackDetailConfigFactory(track) {
   const first = track.genes[0];
   const last = track.genes[track.genes.length-1];
   const id = `track:${clusteredTrackID(track)}`;

diff --git a/src/app/gene/services/gene.service.ts b/src/app/gene/services/gene.service.ts
@@ -81,10 +81,4 @@ export class GeneService extends HttpService {
     return this._makeHttpRequest<any>(request, {}, makeUrl);
   }
 
-  // fetches source specific details for the given gene region
-  getGeneRegionDetails(gene: Gene, source: string): Observable<any> {
-    const request = this._appConfig.getServerRequest(source, 'regionLinks');
-    const makeUrl = (url: string) => url + gene.chromosome + '&start=' + gene.fmin + '&end=' + gene.fmax ;
-    return this._makeHttpRequest<any>(request, {}, makeUrl);
-  }
 }