Development

.github/workflows/build.yml

@@ -28,5 +28,5 @@ jobs:
       - run: npm i -g @angular/cli
       - run: npm i -g nx
       - run: npm i
-      - run: ng lint
+      - run: nx run ramp:lint
       - run: ng run-many --all --target=test -- --no-watch --no-progress --browsers=ChromeHeadlessCI

.travis.yml

@@ -14,5 +14,5 @@ install:
   - npm install
 
 script:
-  - ng lint
+  -  nx run ramp:lint
   - ng run-many --all --target=test -- --no-watch --no-progress --browsers=ChromeHeadlessCI

apps/ramp-client/src/app/app.config.ts

@@ -19,6 +19,7 @@ import {
 import { provideEffects } from '@ngrx/effects';
 import { provideState, provideStore, Store } from '@ngrx/store';
 import { provideStoreDevtools } from '@ngrx/store-devtools';
+import { STRUCTURE_VIEWER_COMPONENT, StructureViewerComponent } from "@ramp/shared/ui/ncats-structure-viewer";
 import {
   LoadRampActions,
   RampService,
@@ -57,6 +58,7 @@ export const appConfig: ApplicationConfig = {
       deps: [],
       multi: true,
     },
+    { provide: STRUCTURE_VIEWER_COMPONENT, useClass: StructureViewerComponent },
     provideRouter(
       routes,
       withViewTransitions(),

apps/ramp-client/src/app/app.routes.ts

@@ -1,5 +1,5 @@
 import { Routes } from '@angular/router';
-import { StructureViewerComponent } from '@ramp/shared/ui/ncats-structure-viewer';
+import { STRUCTURE_VIEWER_COMPONENT, StructureViewerComponent } from "@ramp/shared/ui/ncats-structure-viewer";
 import rFunctions from '../assets/data/rFunctions.json';
 import { environment } from '../environments/environment';
 
@@ -113,7 +113,7 @@ export const routes: Routes = [
     pathMatch: 'full',
     runGuardsAndResolvers: 'paramsOrQueryParamsChange',
     providers: [
-      { provide: StructureViewerComponent, useValue: StructureViewerComponent },
+      { provide: STRUCTURE_VIEWER_COMPONENT, useValue: StructureViewerComponent },
     ],
     loadComponent: () =>
       import('@ramp/features/ramp/properties-from-metabolites').then(

libs/features/ramp/analytes-from-pathways/src/lib/analytes-from-pathways/analytes-from-pathways.component.ts

@@ -128,18 +128,4 @@ export class AnalytesFromPathwaysComponent
       );
     }
   }
-
-  private _mapData(data: any): void {
-    this.dataAsDataProperty = data.map((analyte: Analyte) => {
-      const newObj: { [key: string]: DataProperty } = {};
-      Object.entries(analyte).map((value: any, index: any) => {
-        newObj[value[0]] = new DataProperty({
-          name: value[0],
-          label: value[0],
-          value: value[1],
-        });
-      });
-      return newObj;
-    });
-  }
 }

libs/features/ramp/chemical-enrichment/src/lib/chemical-enrichment/chemical-enrichment.component.html

@@ -36,7 +36,7 @@ <h1 class="page-title">
             type="file"
             class="file-input"
             accept="text/tab-separated-values, .txt"
-            (change)="onFileSelected($event)"
+            (change)="_onFileSelected($event)"
             #fileUpload
           />
           <div class="file-upload">

libs/features/ramp/chemical-enrichment/src/lib/chemical-enrichment/chemical-enrichment.component.spec.ts

@@ -1,8 +1,7 @@
 import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { FlexLayoutModule } from '@angular/flex-layout';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { ReactiveFormsModule } from '@angular/forms';
 import { MatButtonModule } from '@angular/material/button';
 import { MatDialogModule } from '@angular/material/dialog';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -17,14 +16,7 @@ import { ActivatedRoute } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
 import { EffectsModule } from '@ngrx/effects';
 import { StoreModule } from '@ngrx/store';
-import { SharedRampInputRowModule } from '@ramp/shared/ramp/input-row';
-import { SharedRampPageCoreModule } from '@ramp/shared/ramp/page-core';
-import { SharedRampQueryPageModule } from '@ramp/shared/ramp/query-page';
-import { SharedUiDescriptionPanelModule } from '@ramp/shared/ui/description-panel';
-import { SharedUiFeedbackPanelModule } from '@ramp/shared/ui/feedback-panel';
-import { SharedUiLoadingSpinnerModule } from '@ramp/shared/ui/loading-spinner';
-import { SharedUiObjectTreeModule } from '@ramp/shared/ui/object-tree';
-import { RampFacade, StoresRampStoreModule } from '@ramp/stores/ramp-store';
+
 
 import { ChemicalEnrichmentComponent } from './chemical-enrichment.component';
 
@@ -38,18 +30,9 @@ describe('ChemicalEnrichmentComponent', () => {
       imports: [
         BrowserAnimationsModule,
         RouterTestingModule,
-        StoresRampStoreModule,
         HttpClientTestingModule,
-        SharedRampQueryPageModule,
-        SharedRampPageCoreModule,
-        SharedRampInputRowModule,
-        SharedUiLoadingSpinnerModule,
-        SharedUiObjectTreeModule,
-        SharedUiDescriptionPanelModule,
-        FlexLayoutModule,
         MatTabsModule,
         MatFormFieldModule,
-        SharedUiFeedbackPanelModule,
         MatButtonModule,
         MatTooltipModule,
         MatIconModule,
@@ -71,7 +54,6 @@ describe('ChemicalEnrichmentComponent', () => {
         EffectsModule.forRoot([]),
       ],
       providers: [
-        RampFacade,
         {
           provide: ActivatedRoute,
           useValue: {

libs/features/ramp/chemical-enrichment/src/lib/chemical-enrichment/chemical-enrichment.component.ts

@@ -12,7 +12,6 @@ import { MatDialog, MatDialogRef } from '@angular/material/dialog';
 import { MatTabGroup, MatTabsModule } from '@angular/material/tabs';
 import { select } from '@ngrx/store';
 import {
-  ChemicalEnrichment,
   Classes,
   RampChemicalEnrichmentResponse,
   RampResponse,
@@ -174,9 +173,6 @@ export class ChemicalEnrichmentComponent
   enrichmentLoading = false;
 
   classesAsDataProperty: { [key: string]: DataProperty }[] = [];
-  fileName = '';
-  file?: File;
-  // enrichmentdataframe: FishersDataframe;
 
   constructor(
     private ref: ChangeDetectorRef,
@@ -193,23 +189,9 @@ export class ChemicalEnrichmentComponent
         select(RampSelectors.getChemicalEnrichment),
         takeUntilDestroyed(this.destroyRef),
         map((res: RampChemicalEnrichmentResponse | undefined) => {
-          console.log(res);
+          this.dialog.closeAll();
           if (res && res.enriched_chemical_class_list) {
-            this.dataAsDataProperty = res.enriched_chemical_class_list.map(
-              (enrichment: ChemicalEnrichment) => {
-                const newObj: { [key: string]: DataProperty } = {};
-                Object.entries(enrichment).map((value: any) => {
-                  newObj[value[0]] = new DataProperty({
-                    name: value[0],
-                    label: value[0],
-                    value: value[1],
-                  });
-                });
-                return newObj;
-              },
-            );
-            this.enrichmentLoading = false;
-
+           this._mapData(res.enriched_chemical_class_list)
             //     if (res.openModal) {
             const ref: MatDialogRef<CompleteDialogComponent> = this.dialog.open(
               CompleteDialogComponent,
@@ -224,10 +206,12 @@ export class ChemicalEnrichmentComponent
             ref.afterClosed().subscribe((res) => {
               if (res) {
                 this.resultsTabs.selectedIndex = res;
+                this.enrichmentLoading = false;
                 this.ref.markForCheck();
               }
             });
             //   }
+            this.enrichmentLoading = false;
             this.ref.markForCheck();
           }
           /*if (res && res.dataframe) {
@@ -330,12 +314,12 @@ export class ChemicalEnrichmentComponent
     );
   }
 
-  private _mapClasses(data: any): void {
+  private _mapClasses(data: Classes[]): void {
     this.classesAsDataProperty = data.map((obj: Classes) => {
       const newObj: { [key: string]: DataProperty } = {};
-      Object.entries(obj).map((value: any, index: any) => {
+      Object.entries(obj).map((value: string[]) => {
         newObj[value[0]] = new DataProperty({
-          name: value[0],
+          //name: value[0],
           label: value[0],
           value: value[1],
         });
@@ -344,14 +328,6 @@ export class ChemicalEnrichmentComponent
     });
   }
 
-  onFileSelected(event: any) {
-    this.file = event.target.files[0];
-    if (this.file) {
-      this.fileName = this.file.name;
-      this.ref.markForCheck();
-    }
-  }
-
   cancelUpload() {
     this.fileName = '';
     this.fileUpload.nativeElement.value = '';

libs/features/ramp/classes-from-metabolites/src/lib/classes-from-metabolites/classes-from-metabolites.component.ts

@@ -91,8 +91,7 @@ export class ClassesFromMetabolitesComponent
       customComponent: TREE_VIEWER_COMPONENT,
     }),*/
   ];
-  fileName = '';
-  file?: File;
+
   biospecimenCtrl: UntypedFormControl = new UntypedFormControl();
   biospecimens: string[] = [
     'Blood',
@@ -118,7 +117,7 @@ export class ClassesFromMetabolitesComponent
         takeUntilDestroyed(this.destroyRef),
         map((res: RampResponse<Classes> | undefined) => {
           if (res && res.data) {
-            const classGroup: Map<string, any> = new Map<string, any>();
+           /* const classGroup: Map<string, {sourceIds: string[], classyFireTree } }[]> = new Map<string, unknown[]>();
             res.data.forEach((chclass) => {
               const classObj = classGroup.get(chclass.treePath);
               if (classObj) {
@@ -133,7 +132,7 @@ export class ClassesFromMetabolitesComponent
                 };
                 classGroup.set(chclass.treePath, temp);
               }
-            });
+            });*/
             this._mapData(res.data);
             this.matches = Array.from(
               new Set(
@@ -197,28 +196,6 @@ export class ClassesFromMetabolitesComponent
     }
   }
 
-  private _mapData(data: any): void {
-    this.dataAsDataProperty = data.map((obj: Classes) => {
-      const newObj: { [key: string]: DataProperty } = {};
-      Object.entries(obj).map((value: any) => {
-        newObj[value[0]] = new DataProperty({
-          name: value[0],
-          label: value[0],
-          value: value[1],
-        });
-      });
-      return newObj;
-    });
-  }
-
-  onFileSelected(event: any) {
-    this.file = event.target.files[0];
-    if (this.file) {
-      this.fileName = this.file.name;
-      this.ref.markForCheck();
-    }
-  }
-
   cancelUpload() {
     this.fileName = '';
     this.file = undefined;

libs/features/ramp/common-reaction-analytes/src/lib/common-reaction-analytes/common-reaction-analytes.component.ts

@@ -122,18 +122,4 @@ export class CommonReactionAnalytesComponent
       );
     }
   }
-
-  private _mapData(data: any): void {
-    this.dataAsDataProperty = data.map((reaction: Reaction) => {
-      const newObj: { [key: string]: DataProperty } = {};
-      Object.entries(reaction).map((value: any, index: any) => {
-        newObj[value[0]] = new DataProperty({
-          name: value[0],
-          label: value[0],
-          value: value[1],
-        });
-      });
-      return newObj;
-    });
-  }
 }

libs/features/ramp/metabolites-from-ontologies/src/lib/metabolites-from-ontologies/metabolites-from-ontologies.component.ts

@@ -1,3 +1,4 @@
+import { SelectionChange } from "@angular/cdk/collections";
 import { TitleCasePipe } from '@angular/common';
 import {
   ChangeDetectorRef,
@@ -61,15 +62,15 @@ export class MetabolitesFromOntologiesComponent
   extends PageCoreComponent
   implements OnInit
 {
-  @ViewChildren('filterPanel') filterPanels!: QueryList<FilterPanelComponent>;
+  @ViewChildren('filterPanel') filterPanels!: QueryList<FilterPanelComponent<Ontology>>;
   @ViewChild('metaTabs') metaTabs!: ElementRef<MatTabGroup>;
   tabIndex = 0;
 
   allOntoFilterCtrl: UntypedFormControl = new UntypedFormControl();
   metaboliteColumns: DataProperty[] = [
     new DataProperty({
       label: 'Ontology',
-      field: 'ontology',
+      field: 'ontologyTerm',
       sortable: true,
     }),
     new DataProperty({
@@ -79,7 +80,7 @@ export class MetabolitesFromOntologiesComponent
     }),
     new DataProperty({
       label: 'Metabolite',
-      field: 'metabolites',
+      field: 'metNames',
       sortable: true,
     }),
     new DataProperty({
@@ -90,7 +91,7 @@ export class MetabolitesFromOntologiesComponent
   ];
   ontologies!: OntologyList[];
   allOntologies!: OntologyList[];
-  selectedOntologies: any[] = [];
+  selectedOntologies: Ontology[] = [];
   globalFilter?: string;
   disableSearch = false;
   loading = false;
@@ -129,7 +130,7 @@ export class MetabolitesFromOntologiesComponent
       .pipe(
         select(RampSelectors.getontologiesList),
         takeUntilDestroyed(this.destroyRef),
-        map((res: any) => {
+        map((res: OntologyList[] | undefined) => {
           if (res && res.length) {
             this.ontologies = res;
             this.allOntologies = res;
@@ -147,9 +148,9 @@ export class MetabolitesFromOntologiesComponent
           if (res && res.data) {
             this.dataAsDataProperty = res.data.map((metabolite: Metabolite) => {
               const newObj: { [key: string]: DataProperty } = {};
-              Object.entries(metabolite).map((value: any, index: any) => {
+              Object.entries(metabolite).map((value: string[]) => {
                 newObj[value[0]] = new DataProperty({
-                  name: value[0],
+                  //name: value[0],
                   label: value[0],
                   value: value[1],
                 });
@@ -171,17 +172,20 @@ export class MetabolitesFromOntologiesComponent
       .subscribe();
   }
 
-  setValues(values: any) {
+  setValues(values: SelectionChange<Ontology>) {
     if (values.added) {
       this.selectedOntologies = Array.from(
-        new Set(this.selectedOntologies.concat(values.added)),
+        new Set(this.selectedOntologies.concat(values.added as Ontology[])),
       );
     }
     if (values.removed) {
       values.removed.forEach(
-        (val: { value: any }) =>
+        (val: unknown) =>
           (this.selectedOntologies = this.selectedOntologies.filter(
-            (ont) => ont.value !== val.value,
+            (ont: Ontology) => {
+              const tempVal: Ontology = val as Ontology;
+            return  ont.value !== tempVal.value
+            }
           )),
       );
     }
@@ -197,7 +201,7 @@ export class MetabolitesFromOntologiesComponent
   fetchMetabolites(): void {
     this.loading = true;
     this.tabIndex = 0;
-    const ontologiesList = this.selectedOntologies.map((ont) => ont.value);
+    const ontologiesList: string[] = this.selectedOntologies.map((ont:Ontology) => <string>ont.value);
     this.store.dispatch(
       MetaboliteFromOntologyActions.fetchMetabolitesFromOntologies({
         ontologies: ontologiesList,
@@ -206,8 +210,8 @@ export class MetabolitesFromOntologiesComponent
   }
 
   fetchMetabolitesFile(): void {
-    const ontologiesList = this.selectedOntologies.map((ont) => ont.value);
-    if (ontologiesList.length) {
+    const ontologiesList: string[] = this.selectedOntologies.map((ont:Ontology) => <string>ont.value);
+    if (ontologiesList && ontologiesList.length) {
       this.store.dispatch(
         MetaboliteFromOntologyActions.fetchMetabolitesFromOntologiesFile({
           ontologies: ontologiesList,