feat: show flags comments from other cases in variant result table (#…

…1564)
varfish-org · May 28, 2024 · 6d320a6 · 6d320a6
1 parent 9332f9a
commit 6d320a6
Show file tree

Hide file tree

Showing 6 changed files with 194 additions and 69 deletions.
diff --git a/svs/vueapp/src/components/SvFilterResultsTable.vue b/svs/vueapp/src/components/SvFilterResultsTable.vue
@@ -479,14 +479,14 @@ watch(
           />
           <i-fa-solid-bookmark
             v-if="svFlagsStore.getFlags({ chromosome, start, end, sv_type })"
-            class="text-muted"
+            :class="`${svFlagsStore.hasProjectWideFlags({ chromosome, start, end, sv_type }) ? 'text-warning' : 'text-muted'}`"
             title="flags & bookmarks"
             role="button"
             @click="showVariantDetails(sodar_uuid, 'strucvar-flags')"
           />
           <i-fa-regular-bookmark
             v-else
-            class="text-muted icon-inactive"
+            :class="`${svFlagsStore.hasProjectWideFlags({ chromosome, start, end, sv_type }) ? 'text-warning' : 'text-muted'} icon-inactive`"
             title="flags & bookmarks"
             role="button"
             @click="showVariantDetails(sodar_uuid, 'strucvar-flags')"
@@ -496,13 +496,13 @@ watch(
             v-if="
               svCommentsStore.hasComment({ chromosome, start, end, sv_type })
             "
-            class="text-muted ml-1"
+            :class="`${svCommentsStore.hasProjectWideComments({ chromosome, start, end, sv_type }) ? 'text-warning' : 'text-muted'} ml-1`"
             role="button"
             @click="showVariantDetails(sodar_uuid, 'strucvar-comments')"
           />
           <i-fa-regular-comment
             v-else
-            class="text-muted icon-inactive ml-1"
+            :class="`${svCommentsStore.hasProjectWideComments({ chromosome, start, end, sv_type }) ? 'text-warning' : 'text-muted'} icon-inactive ml-1`"
             role="button"
             @click="showVariantDetails(sodar_uuid, 'strucvar-comments')"
           />

diff --git a/svs/vueapp/src/stores/strucvarFlags/store.ts b/svs/vueapp/src/stores/strucvarFlags/store.ts
@@ -5,7 +5,7 @@ import { defineStore } from 'pinia'
 import { ref, reactive } from 'vue'
 
 import { StoreState, State } from '@varfish/storeUtils'
-import { SvClient } from '@svs/api/strucvarClient'
+import { SvClient, SvFlags } from '@svs/api/strucvarClient'
 import { bndInsOverlap, reciprocalOverlap } from '@varfish/helpers'
 import { useCaseDetailsStore } from '@cases/stores/caseDetails'
 import { Strucvar } from '@bihealth/reev-frontend-lib/lib/genomicVars'
@@ -64,6 +64,8 @@ export const useSvFlagsStore = defineStore('svFlags', () => {
   const caseFlags = ref<Map<string, StructuralVariantFlags>>(new Map())
   /** The project-wide variant flags. */
   const projectWideVariantFlags = ref<Array<StructuralVariantFlags>>([])
+  /** The project-wide flags. */
+  const projectWideFlags = ref<Array<StructuralVariantFlags>>([])
 
   /** Promise for initialization of the store. */
   const initializeRes = ref<Promise<any> | null>(null)
@@ -118,22 +120,26 @@ export const useSvFlagsStore = defineStore('svFlags', () => {
 
     const svClient = new SvClient(csrfToken.value ?? 'undefined-csrf-token')
 
-    initializeRes.value = svClient
-      .listFlags(caseUuid.value)
-      .then((flags) => {
+    initializeRes.value = Promise.all([
+      svClient.listFlags(caseUuid.value).then((flags) => {
         caseFlags.value.clear()
         for (const flag of flags) {
           caseFlags.value.set(flag.sodar_uuid, flag)
         }
+      }),
+      svClient
+        .listProjectFlags(projectUuid.value, caseUuid.value)
+        .then((result) => {
+          projectWideFlags.value = result
+        }),
+    ]).catch((err) => {
+      console.error('Problem initializing variantFlags store', err)
+      storeState.serverInteractions -= 1
+      storeState.state = State.Error
+    })
 
-        storeState.serverInteractions -= 1
-        storeState.state = State.Active
-      })
-      .catch((err) => {
-        console.error('Problem initializing svFlags store', err)
-        storeState.serverInteractions -= 1
-        storeState.state = State.Error
-      })
+    storeState.serverInteractions -= 1
+    storeState.state = State.Active
 
     return initializeRes.value
   }
@@ -299,17 +305,13 @@ export const useSvFlagsStore = defineStore('svFlags', () => {
     flags.value = null
   }
 
-  /**
-   * Return first matching flag for the given `sv`.
-   */
-  const getFlags = (sv: StructuralVariant): StructuralVariantFlags | null => {
-    if (!caseFlags.value) {
-      return null
-    }
-
+  const _getFlags = (
+    sv: StructuralVariant,
+    flagList: Array<StructuralVariantFlags>,
+  ): StructuralVariantFlags | null => {
     const bndInsRadius = 50
     const minReciprocalOverlap = 0.8
-    for (const flag of caseFlags.value.values()) {
+    for (const flag of flagList) {
       if (
         ['BND', 'INS'].includes(flag.sv_type) &&
         flag.sv_type === sv.sv_type &&
@@ -323,7 +325,22 @@ export const useSvFlagsStore = defineStore('svFlags', () => {
         return flag
       }
     }
-    return null
+    return false
+  }
+
+  /**
+   * Return first matching flag for the given `sv`.
+   */
+  const getFlags = (sv: StructuralVariant): StructuralVariantFlags | null => {
+    if (!caseFlags.value) {
+      return null
+    }
+    return _getFlags(sv, Array.from(caseFlags.value.values()))
+  }
+
+  const hasProjectWideFlags = (sv: Strucvar): boolean => {
+    const flag = _getFlags(sv, projectWideFlags.value)
+    return flag ? true : false
   }
 
   /**
@@ -373,6 +390,7 @@ export const useSvFlagsStore = defineStore('svFlags', () => {
     emptyFlagsTemplate,
     initialFlagsTemplate,
     projectWideVariantFlags,
+    projectWideFlags,
     // functions
     initialize,
     retrieveFlags,
@@ -381,5 +399,6 @@ export const useSvFlagsStore = defineStore('svFlags', () => {
     deleteFlags,
     getFlags,
     retrieveProjectWideVariantFlags,
+    hasProjectWideFlags,
   }
 })
diff --git a/svs/vueapp/src/stores/svComments.ts b/svs/vueapp/src/stores/svComments.ts
@@ -45,6 +45,8 @@ export const useSvCommentsStore = defineStore('svComments', () => {
   const caseComments = ref<Map<string, StructuralVariantComment>>(new Map())
   /** The project-wide variant comments. */
   const projectWideVariantComments = ref<Array<StructuralVariantComment>>([])
+  /** The project-wide comments. */
+  const projectWideComments = ref<Array<StructuralVariantComment>>([])
 
   /** Promise for initialization of the store. */
   const initializeRes = ref<Promise<any> | null>(null)
@@ -97,22 +99,26 @@ export const useSvCommentsStore = defineStore('svComments', () => {
 
     const svClient = new SvClient(csrfToken.value ?? 'undefined-csrf-token')
 
-    initializeRes.value = svClient
-      .listComment(caseUuid.value)
-      .then((comments) => {
+    initializeRes.value = Promise.all([
+      svClient.listComment(caseUuid.value).then((comments) => {
         caseComments.value.clear()
         for (const comment of comments) {
           caseComments.value.set(comment.sodar_uuid, comment)
         }
+      }),
+      svClient
+        .listProjectComment(projectUuid.value, caseUuid.value)
+        .then((result) => {
+          projectWideVariantComments.value = result
+        }),
+    ]).catch((err) => {
+      console.error('Problem initializing svComments store', err)
+      storeState.serverInteractions -= 1
+      storeState.state = State.Error
+    })
 
-        storeState.serverInteractions -= 1
-        storeState.state = State.Active
-      })
-      .catch((err) => {
-        console.error('Problem initializing svComments store', err)
-        storeState.serverInteractions -= 1
-        storeState.state = State.Error
-      })
+    storeState.serverInteractions -= 1
+    storeState.state = State.Active
 
     return initializeRes.value
   }
@@ -273,12 +279,12 @@ export const useSvCommentsStore = defineStore('svComments', () => {
     )
   }
 
-  /**
-   * Return whether there is a comment for the given variant.
-   */
-  const hasComment = (strucvar$: Strucvar): boolean => {
+  const _hasComment = (
+    strucvar$: Strucvar,
+    comments: StructuralVariantComment,
+  ): boolean => {
     const minReciprocalOverlap = 0.8
-    for (const comment of caseComments.value.values()) {
+    for (const comment of comments) {
       let end
       if (strucvar$.svType === 'INS' || strucvar$.svType === 'BND') {
         end = strucvar$.start
@@ -299,6 +305,17 @@ export const useSvCommentsStore = defineStore('svComments', () => {
     return false
   }
 
+  /**
+   * Return whether there is a comment for the given variant.
+   */
+  const hasComment = (strucvar$: Strucvar): boolean => {
+    return _hasComment(strucvar$, caseComments.value.values())
+  }
+
+  const hasProjectWideComments = (strucvar$: Strucvar): boolean => {
+    return _hasComment(strucvar$, projectWideVariantComments.value)
+  }
+
   /**
    * Retrieve project-wide variant comments.
    */
@@ -344,6 +361,7 @@ export const useSvCommentsStore = defineStore('svComments', () => {
     comments,
     caseComments,
     projectWideVariantComments,
+    projectWideComments,
     initializeRes,
     // functions
     initialize,
@@ -352,6 +370,7 @@ export const useSvCommentsStore = defineStore('svComments', () => {
     updateComment,
     deleteComment,
     hasComment,
+    hasProjectWideComments,
     retrieveProjectWideVariantComments,
   }
 })
diff --git a/variants/vueapp/src/components/FilterResultsTable.vue b/variants/vueapp/src/components/FilterResultsTable.vue
@@ -262,6 +262,30 @@ const hasComments = (payload) => {
   )
 }
 
+const hasProjectComments = (payload) => {
+  return commentsStore.hasProjectWideComments(
+    new SeqvarImpl(
+      payload.release === 'GRCh37' ? 'grch37' : 'grch38',
+      payload.chromosome,
+      payload.start,
+      payload.reference,
+      payload.alternative,
+    ),
+  )
+}
+
+const hasProjectFlags = (payload) => {
+  return flagsStore.hasProjectWideFlags(
+    new SeqvarImpl(
+      payload.release === 'GRCh37' ? 'grch37' : 'grch38',
+      payload.chromosome,
+      payload.start,
+      payload.reference,
+      payload.alternative,
+    ),
+  )
+}
+
 /**
  * Configuration for the row to color them based on flags.
  */
@@ -636,28 +660,28 @@ watch(
             />
             <i-fa-solid-bookmark
               v-if="getFlags(payload)"
-              class="text-muted ml-1"
+              :class="`${hasProjectFlags(payload) ? 'text-warning' : 'text-muted'} ml-1`"
               title="flags & bookmarks"
               role="button"
               @click="showVariantDetails(sodar_uuid, 'seqvar-flags')"
             />
             <i-fa-regular-bookmark
               v-else
-              class="text-muted ml-1"
+              :class="`${hasProjectFlags(payload) ? 'text-warning' : 'text-muted'} ml-1`"
               title="flags & bookmarks"
               role="button"
               @click="showVariantDetails(sodar_uuid, 'seqvar-flags')"
             />
 
             <i-fa-solid-comment
               v-if="hasComments(payload)"
-              class="text-muted ml-1"
+              :class="`${hasProjectComments(payload) ? 'text-warning' : 'text-muted'} ml-1`"
               role="button"
               @click="showVariantDetails(sodar_uuid, 'seqvar-comments')"
             />
             <i-fa-regular-comment
               v-else
-              class="text-muted ml-1"
+              :class="`${hasProjectComments(payload) ? 'text-warning' : 'text-muted'} ml-1`"
               role="button"
               @click="showVariantDetails(sodar_uuid, 'seqvar-comments')"
             />