fix: Present hpo terms on seqvar page (#286) (#298)

bihealth · Dec 15, 2023 · a61b57e · a61b57e
1 parent bdf7583
commit a61b57e
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 2 deletions.
diff --git a/frontend/src/stores/__tests__/variantInfo.spec.ts b/frontend/src/stores/__tests__/variantInfo.spec.ts
@@ -37,6 +37,7 @@ describe.concurrent('geneInfo Store', () => {
     expect(store.seqvar).toBe(undefined)
     expect(store.varAnnos).toBe(null)
     expect(store.geneInfo).toBe(null)
+    expect(store.hpoTerms).toEqual([])
     expect(store.txCsq).toBe(null)
   })
 
@@ -218,6 +219,6 @@ describe.concurrent('geneInfo Store', () => {
 
     await store.loadData(deepCopy(seqvarInfo))
 
-    expect(fetchMocker.mock.calls.length).toBe(4)
+    expect(fetchMocker.mock.calls.length).toBe(5)
   })
 })
diff --git a/frontend/src/stores/seqVarInfo.ts b/frontend/src/stores/seqVarInfo.ts
@@ -9,6 +9,7 @@ import { ref } from 'vue'
 
 import { AnnonarsClient } from '@/api/annonars'
 import { MehariClient } from '@/api/mehari'
+import { type HpoTerm, VigunoClient } from '@/api/viguno'
 import { type Seqvar } from '@/lib/genomicVars'
 import { StoreState } from '@/stores/misc'
 
@@ -28,6 +29,9 @@ export const useSeqVarInfoStore = defineStore('seqVarInfo', () => {
   /** Information about related gene. */
   const geneInfo = ref<any | null>(null)
 
+  /** The HPO terms retrieved from viguno. */
+  const hpoTerms = ref<HpoTerm[]>([])
+
   /** Transcript consequence information from mehari. */
   const txCsq = ref<any | null>(null)
 
@@ -64,6 +68,7 @@ export const useSeqVarInfoStore = defineStore('seqVarInfo', () => {
     storeState.value = StoreState.Loading
     const annonarsClient = new AnnonarsClient()
     const mehariClient = new MehariClient()
+    const vigunoClient = new VigunoClient()
     let hgncId = ''
 
     const { genomeBuild, chrom, pos, del, ins } = seqvar$
@@ -86,6 +91,12 @@ export const useSeqVarInfoStore = defineStore('seqVarInfo', () => {
             }),
             annonarsClient.fetchGeneClinvarInfo(hgncId).then((data) => {
               geneClinvar.value = data.genes[hgncId]
+            }),
+            vigunoClient.fetchHpoTermsForHgncId(hgncId).then((data) => {
+              if (data === null) {
+                throw new Error('No HPO terms found.')
+              }
+              hpoTerms.value = data
             })
           ])
         } else {
@@ -112,6 +123,7 @@ export const useSeqVarInfoStore = defineStore('seqVarInfo', () => {
     varAnnos,
     geneClinvar,
     geneInfo,
+    hpoTerms,
     txCsq,
     loadData,
     clearData

diff --git a/frontend/src/views/SeqvarDetailsView.vue b/frontend/src/views/SeqvarDetailsView.vue
@@ -330,7 +330,10 @@ const SECTIONS: { [key: string]: Section[] } = {
                 <GenePathogenicityCard :gene-info="seqvarInfoStore?.geneInfo" />
               </div>
               <div id="gene-conditions">
-                <GeneConditionsCard :gene-info="seqvarInfoStore?.geneInfo" :hpo-terms="[]" />
+                <GeneConditionsCard
+                  :gene-info="seqvarInfoStore?.geneInfo"
+                  :hpo-terms="seqvarInfoStore.hpoTerms"
+                />
               </div>
               <div id="gene-expression">
                 <GeneExpressionCard