Merge branch 'feat/xrefs' into 'master'

Xref part, Fix GNP-5842.

Closes GNP-5842 and GNP-5482

See merge request urgi-is/gpds!15

frontend/package-lock.json

@@ -6577,6 +6577,11 @@
       "integrity": "sha512-MFh0d/Wa7vkKO3Y3LlacqAEeHK0mckVqzDieUKTT+KGxi+zIpeVsFxymkIiRpbpDziHc290Xr9A1O4Om7otoRA==",
       "dev": true
     },
+    "ng-mocks": {
+      "version": "7.6.0",
+      "resolved": "https://registry.npmjs.org/ng-mocks/-/ng-mocks-7.6.0.tgz",
+      "integrity": "sha512-Zorpd5I6KmvTtiYwcjymzCaortznMZr5CRB737XaNheITTUb2rVLUoEBk1dwQE3b/Cp5sByuS85fzwJRvjEXKQ=="
+    },
     "ngx-moment": {
       "version": "3.3.0",
       "resolved": "https://registry.npmjs.org/ngx-moment/-/ngx-moment-3.3.0.tgz",

frontend/package.json

@@ -21,15 +21,16 @@
     "@angular/platform-browser": "7.2.7",
     "@angular/platform-browser-dynamic": "7.2.7",
     "@angular/router": "7.2.7",
+    "@ng-bootstrap/ng-bootstrap": "4.0.0",
     "@types/leaflet": "1.2.14",
     "@types/leaflet.markercluster": "1.0.3",
-    "@ng-bootstrap/ng-bootstrap": "4.0.0",
     "bootstrap": "4.1.3",
     "core-js": "2.5.7",
     "font-awesome": "4.7.0",
-    "moment": "2.24.0",
     "leaflet": "1.3.4",
     "leaflet.markercluster": "1.4.1",
+    "moment": "2.24.0",
+    "ng-mocks": "^7.6.0",
     "ngx-moment": "3.3.0",
     "popper.js": "1.14.6",
     "rxjs": "6.4.0",

frontend/src/app/app.module.ts

@@ -23,6 +23,8 @@ import { CardSectionComponent } from './card-section/card-section.component';
 import { LoadingSpinnerComponent } from './loading-spinner/loading-spinner.component';
 import { CardTableComponent } from './card-table/card-table.component';
 import { MomentModule } from 'ngx-moment';
+import { XrefsComponent } from './xrefs/xrefs.component';
+
 
 @NgModule({
     declarations: [
@@ -43,6 +45,7 @@ import { MomentModule } from 'ngx-moment';
         CardSectionComponent,
         LoadingSpinnerComponent,
         CardTableComponent,
+        XrefsComponent
     ],
     imports: [
         BrowserModule,

frontend/src/app/germplasm-card/germplasm-card.component.html

@@ -660,4 +660,9 @@
       </ng-container>
     </div>
   </div>
+
+
+  <!--XRefs part -->
+ <gpds-xrefs [xrefId]="germplasmGnpis.germplasmPUI"></gpds-xrefs>
 </ng-container>
+

frontend/src/app/germplasm-card/germplasm-card.component.spec.ts

@@ -19,6 +19,9 @@ import { Germplasm, GermplasmData, GermplasmResult, Institute, Origin, Site } fr
 import { NgbPopoverModule } from '@ng-bootstrap/ng-bootstrap';
 import { MomentModule } from 'ngx-moment';
 import { LoadingSpinnerComponent } from '../loading-spinner/loading-spinner.component';
+import { MockComponent } from 'ng-mocks';
+import { XrefsComponent } from '../xrefs/xrefs.component';
+
 
 describe('GermplasmCardComponent', () => {
 
@@ -74,7 +77,7 @@ describe('GermplasmCardComponent', () => {
     };
 
     const brapiGermplasmPedigree: GermplasmResult<BrapiGermplasmPedigree> = {
-        result : {
+        result: {
             germplasmDbId: '12',
             defaultDisplayName: '12',
             pedigree: null,
@@ -139,7 +142,7 @@ describe('GermplasmCardComponent', () => {
 
     const brapiGermplasmAttributes: GermplasmResult<GermplasmData<BrapiGermplasmAttributes[]>> = {
         result: {
-            data: [ {
+            data: [{
                 attributeName: 'longueur',
                 value: '30'
             }]
@@ -202,13 +205,14 @@ describe('GermplasmCardComponent', () => {
         TestBed.configureTestingModule({
             imports: [RouterTestingModule, NgbPopoverModule, MomentModule],
             declarations: [
-                GermplasmCardComponent, LoadingSpinnerComponent
+                GermplasmCardComponent, LoadingSpinnerComponent, MockComponent(XrefsComponent)
             ],
             providers: [
                 // { provide: ActivatedRoute, useValue: activatedRoute },
                 { provide: BrapiService, useValue: brapiService },
                 { provide: GnpisService, useValue: gnpisService },
-                { provide: ActivatedRoute,
+                {
+                    provide: ActivatedRoute,
                     useValue: {
                         snapshot: {
                             queryParams: convertToParamMap({

frontend/src/app/gnpis.service.ts

@@ -5,6 +5,7 @@ import { Germplasm } from './models/gnpis.germplasm.model';
 import { DataDiscoveryCriteria, DataDiscoveryFacet, DataDiscoveryResults, DataDiscoverySource } from './models/data-discovery.model';
 import { BrapiResults } from './models/brapi.model';
 import { map } from 'rxjs/operators';
+import { XrefResponse } from './models/xref.model';
 
 
 export const BASE_URL = 'gnpis/v1/datadiscovery';
@@ -106,4 +107,9 @@ export class GnpisService {
     getSource(sourceURI: string): Observable<DataDiscoverySource> {
         return this.sourceByURI$.pipe(map(sourceByURI => sourceByURI[sourceURI]));
     }
+
+    xref(xrefId: string): Observable<XrefResponse> {
+        return this.http.get<XrefResponse>(`gnpis/v1/xref/documentbyfulltextid?linkedRessourcesID=${xrefId}`);
+    }
+
 }

frontend/src/app/models/xref.model.ts

+export interface XrefModel {
+
+    url: string;
+    description: string;
+    database_name: string;
+    entry_type: string;
+    db_version: string;
+
+}
+
+export type XrefResponse = XrefModel[];

frontend/src/app/site-card/site-card.component.html

@@ -3,10 +3,14 @@
 <ng-container *ngIf="location">
   <h3>
     Site: {{ location.locationName }}
+
+
   </h3>
 
   <gpds-map [locations]="[location]" *ngIf="location && location.latitude && location.longitude"></gpds-map>
 
+
+
   <gpds-card-section
     header="Details">
     <ng-template>
@@ -75,4 +79,8 @@
       </gpds-card-table>
     </ng-template>
   </gpds-card-section>
+
+  <!--XRefs part -->
+  <gpds-xrefs [xrefId]="location.locationDbId"></gpds-xrefs>
+
 </ng-container>

frontend/src/app/site-card/site-card.component.spec.ts

@@ -10,6 +10,9 @@ import { CardRowComponent } from '../card-row/card-row.component';
 import { LoadingSpinnerComponent } from '../loading-spinner/loading-spinner.component';
 import { CardTableComponent } from '../card-table/card-table.component';
 import { CardSectionComponent } from '../card-section/card-section.component';
+import { MockComponent } from 'ng-mocks';
+import { XrefsComponent } from '../xrefs/xrefs.component';
+
 
 describe('SiteCardComponent', () => {
     const brapiService = jasmine.createSpyObj(
@@ -48,7 +51,8 @@ describe('SiteCardComponent', () => {
         TestBed.configureTestingModule({
             declarations: [
                 SiteCardComponent, MapComponent, LoadingSpinnerComponent,
-                CardRowComponent, CardSectionComponent, CardTableComponent
+                CardRowComponent, CardSectionComponent, CardTableComponent,
+                MockComponent(XrefsComponent)
             ],
             providers: [
                 { provide: BrapiService, useValue: brapiService },

frontend/src/app/site-card/site-card.component.ts

@@ -15,6 +15,7 @@ export class SiteCardComponent implements OnInit {
     additionalInfos: KeyValueObject[];
     loading = true;
 
+
     constructor(private brapiService: BrapiService, private route: ActivatedRoute) {
     }
 
@@ -22,11 +23,9 @@ export class SiteCardComponent implements OnInit {
         this.route.paramMap.subscribe(paramMap => {
             // initialize site from location ID
             const locationId = paramMap.get('id');
-
             this.brapiService.location(locationId).subscribe(
                 response => {
                     this.location = response.result;
-
                     this.additionalInfos = [];
                     if (this.location.additionalInfo) {
                         this.additionalInfos = KeyValueObject.fromObject(this.location.additionalInfo);

frontend/src/app/study-card/study-card.component.html

@@ -254,5 +254,7 @@
     </ng-template>
   </gpds-card-section>
 
-</ng-container>
 
+  <!--XRefs part -->
+  <gpds-xrefs [xrefId]="study.studyDbId"></gpds-xrefs>
+</ng-container>

frontend/src/app/study-card/study-card.component.spec.ts

@@ -23,6 +23,9 @@ import { CardSectionComponent } from '../card-section/card-section.component';
 import { CardRowComponent } from '../card-row/card-row.component';
 import { LoadingSpinnerComponent } from '../loading-spinner/loading-spinner.component';
 import { CardTableComponent } from '../card-table/card-table.component';
+import { MockComponent } from 'ng-mocks';
+import { XrefsComponent } from '../xrefs/xrefs.component';
+
 
 describe('StudyCardComponent', () => {
     beforeEach(() => jasmine.addMatchers(speculoosMatchers));
@@ -204,7 +207,7 @@ describe('StudyCardComponent', () => {
             imports: [RouterTestingModule],
             declarations: [
                 StudyCardComponent, MapComponent, CardSectionComponent,
-                CardRowComponent, LoadingSpinnerComponent, CardTableComponent
+                CardRowComponent, LoadingSpinnerComponent, CardTableComponent, MockComponent(XrefsComponent)
             ],
             providers: [
                 { provide: ActivatedRoute, useValue: activatedRoute },

frontend/src/app/xrefs/xrefs.component.html

+<gpds-card-section *ngIf="xrefs.length > 0"
+                   header="Cross References">
+  <ng-template>
+    <gpds-card-table
+      [headers]="[
+          'Name',
+           'Source',
+           'Type',
+           'Description'
+        ]"
+      [rows]=xrefs>
+      <ng-template let-crossRef>
+        <tr>
+          <td><a [href]="crossRef.url">{{ crossRef.db_version }}</a></td>
+          <td>{{ crossRef.database_name }}</td>
+          <td>{{ crossRef.entry_type }}</td>
+          <td>{{ crossRef.description | slice:0:120 }}...</td>
+        </tr>
+      </ng-template>
+    </gpds-card-table>
+  </ng-template>
+</gpds-card-section>

frontend/src/app/xrefs/xrefs.component.spec.ts

+import { async, TestBed } from '@angular/core/testing';
+
+import { XrefsComponent } from './xrefs.component';
+import { ComponentTester, speculoosMatchers } from 'ngx-speculoos';
+import { XrefModel } from '../models/xref.model';
+import { of } from 'rxjs';
+import { GnpisService } from '../gnpis.service';
+import { CardSectionComponent } from '../card-section/card-section.component';
+import { CardTableComponent } from '../card-table/card-table.component';
+
+describe('XrefsComponent', () => {
+    beforeEach(() => jasmine.addMatchers(speculoosMatchers));
+
+    class XrefsComponentTester extends ComponentTester<XrefsComponent> {
+        constructor() {
+            super(XrefsComponent);
+        }
+
+        get cardHeader() {
+            return this.element('div.card-header');
+        }
+
+        get columns() {
+            return this.elements('td');
+        }
+    }
+
+    const gnpisService = jasmine.createSpyObj(
+        'GnpisService', [
+            'xref'
+        ]
+    );
+
+    const xref: XrefModel[] = [{
+        url: 'https://urgi.versailles.inra.fr/association/association/viewer.do#results/analysisIds=1808038',
+        description: 'Col-Fa-b*_MLM+Q+K is a GWASd anté paneCol-Fa-b*_MLM+Q+K is aGAS anlysis involving CC_Qualité' +
+            'djs dsqdsq djsqpodsjqodsqdsqkpdqpdWOLOLOLOOOOOOOsqpkdsqkdsqkdsqdsdsqdsqdsqddsqffjùsodfusjùfsfsd',
+        database_name: 'GnpIS',
+        entry_type: 'GWAS analysis',
+        db_version: 'GWAS_ANALYSIS_1808038_1'
+    }];
+
+
+    const xrefBlank: XrefModel[] = [];
+
+
+    beforeEach(async(() => {
+        TestBed.configureTestingModule({
+            declarations: [
+                XrefsComponent, CardSectionComponent, CardTableComponent
+            ],
+            providers: [
+                { provide: GnpisService, useValue: gnpisService },
+            ]
+        });
+    }));
+
+    it('should fetch the xref information', async(() => {
+        gnpisService.xref.and.returnValue(of(xref));
+        const tester = new XrefsComponentTester();
+
+        tester.detectChanges();
+
+        expect(tester.cardHeader).toContainText('Cross References');
+        expect(tester.columns[0]).toContainText(xref[0].db_version);
+        expect(tester.columns[1]).toContainText(xref[0].database_name);
+        expect(tester.columns[2]).toContainText(xref[0].entry_type);
+        expect(tester.columns[3].textContent.length).toBeLessThanOrEqual(124);
+
+    }));
+
+
+    it('should not display cross references', async(() => {
+        gnpisService.xref.and.returnValue(of(xrefBlank));
+        const tester = new XrefsComponentTester();
+        tester.detectChanges();
+
+        expect(tester.cardHeader).toBeFalsy();
+
+    }));
+});

frontend/src/app/xrefs/xrefs.component.ts

+import { Component, Input, OnInit } from '@angular/core';
+import { GnpisService } from '../gnpis.service';
+import { XrefModel } from '../models/xref.model';
+
+@Component({
+    selector: 'gpds-xrefs',
+    templateUrl: './xrefs.component.html',
+    styleUrls: ['./xrefs.component.scss']
+})
+export class XrefsComponent implements OnInit {
+
+    xrefs: Array<XrefModel> = new Array<XrefModel>();
+    @Input() xrefId: string;
+
+    constructor(private gnpisService: GnpisService) {
+    }
+
+    ngOnInit() {
+        this.gnpisService.xref(this.xrefId).subscribe(
+            xrefs => {
+                this.xrefs = xrefs;
+            }
+        );
+
+    }
+}