{{ formatLargeInt(payload.sv_length) }}
bp
diff --git a/svs/vueapp/src/views/StrucvarDetails/StrucvarDetails.vue b/svs/vueapp/src/views/StrucvarDetails/StrucvarDetails.vue
index b9aa09e13..d2de5db8f 100644
--- a/svs/vueapp/src/views/StrucvarDetails/StrucvarDetails.vue
+++ b/svs/vueapp/src/views/StrucvarDetails/StrucvarDetails.vue
@@ -43,7 +43,9 @@ import StrucvarClinvarCard from '@bihealth/reev-frontend-lib/components/Strucvar
import StrucvarToolsCard from '@bihealth/reev-frontend-lib/components/StrucvarToolsCard/StrucvarToolsCard.vue'
import GenomeBrowserCard from '@bihealth/reev-frontend-lib/components/GenomeBrowserCard/GenomeBrowserCard.vue'
import { useCaseDetailsStore } from '@cases/stores/caseDetails'
-import CaseDetailApp from '@cases/components/CaseDetailApp.vue'
+import { State } from '@varfish/storeUtils'
+import { StoreState } from '@bihealth/reev-frontend-lib/stores'
+import { usePubtatorStore } from '@bihealth/reev-frontend-lib/stores/pubtator'
const props = defineProps<{
/** UUID of the result row to display. */
@@ -75,6 +77,8 @@ const svDetailsStore = useSvDetailsStore()
const svFlagsStore = useSvFlagsStore()
/** Management of strucvar comments. */
const svCommentsStore = useSvCommentsStore()
+/** Management of PubTator store. */
+const pubtatorStore = usePubtatorStore()
/** Component state; HGNC identifier of selected gene. */
const selectedGeneHgncId = ref
(undefined)
@@ -157,16 +161,40 @@ const refreshStores = async () => {
/** Watch change in properties to reload data. */
watch(
() => [props.resultRowUuid, props.selectedSection],
+ async () => {
+ await refreshStores()
+ },
+)
+
+watch(
+ () => [
+ svResultSetStore.storeState.state,
+ pubtatorStore.storeState,
+ geneInfoStore.storeState,
+ strucvarInfoStore.storeState,
+ svCommentsStore.storeState,
+ svDetailsStore.storeState,
+ ],
() => {
- refreshStores()
+ if (
+ svResultSetStore.storeState.state === State.Active &&
+ pubtatorStore.storeState === StoreState.Active &&
+ geneInfoStore.storeState === StoreState.Active &&
+ strucvarInfoStore.storeState === StoreState.Active &&
+ svCommentsStore.storeState.state === State.Active &&
+ svDetailsStore.storeState.state === State.Active
+ ) {
+ setTimeout(() => {
+ document.querySelector(`#${props.selectedSection}`)?.scrollIntoView()
+ }, 500)
+ }
},
)
/** When mounted, scroll to the selected element if any.
*/
-onMounted(() => {
- refreshStores()
- document.querySelector(`#${props.selectedSection}`)?.scrollIntoView()
+onMounted(async () => {
+ await refreshStores()
})
// Watch changes of selected HGNC ID and load gene.
diff --git a/variants/vueapp/src/components/FilterApp.vue b/variants/vueapp/src/components/FilterApp.vue
index ce4c7c8f5..32c38c6d8 100644
--- a/variants/vueapp/src/components/FilterApp.vue
+++ b/variants/vueapp/src/components/FilterApp.vue
@@ -39,7 +39,6 @@ const showDetails = async (event) => {
variantQueryStore.lastPosition = document.querySelector(
'div#sodar-app-container',
).scrollTop
- // TODO store y position in store
router.push({
name: 'seqvar-details',
params: {
diff --git a/variants/vueapp/src/components/FilterResultsTable.vue b/variants/vueapp/src/components/FilterResultsTable.vue
index 6e7ea8257..e2a6afdd9 100644
--- a/variants/vueapp/src/components/FilterResultsTable.vue
+++ b/variants/vueapp/src/components/FilterResultsTable.vue
@@ -420,7 +420,7 @@ const getClinvarSignificanceBadge = (patho) => {
const showVariantDetails = (sodarUuid, section) => {
emit('variantSelected', {
smallvariantresultrow: sodarUuid,
- selectedSection: section ?? 'gene',
+ selectedSection: section ?? 'gene-overview',
})
}
@@ -634,34 +634,34 @@ watch(
class="text-muted ml-1"
title="flags & bookmarks"
role="button"
- @click="showVariantDetails(sodar_uuid, 'flags')"
+ @click="showVariantDetails(sodar_uuid, 'seqvar-flags')"
/>
{{ getAcmgRating(payload) || '-' }}
@@ -679,7 +679,7 @@ watch(
{{ position }}
@@ -718,7 +718,7 @@ watch(
{{ truncateText(reference, 5) }}
@@ -726,7 +726,7 @@ watch(
{{ truncateText(alternative, 5) }}
@@ -758,7 +758,10 @@ watch(
-
-
+
-
+
{{ displayHomozygousContent(payload) }}
{{ displayConstraintsContent(payload) }}
@@ -789,7 +795,7 @@ watch(
class="user-select-none"
href="#"
role="button"
- @click.prevent="showVariantDetails(sodar_uuid, 'gene')"
+ @click.prevent="showVariantDetails(sodar_uuid, 'gene-overview')"
>
{{ getSymbol(payload) }}
@@ -827,7 +833,7 @@ watch(
{{ truncateText(effectSummary(payload), 12) }}
diff --git a/variants/vueapp/src/stores/variantDetails.ts b/variants/vueapp/src/stores/variantDetails.ts
index 2ea54d742..96f1d1d00 100644
--- a/variants/vueapp/src/stores/variantDetails.ts
+++ b/variants/vueapp/src/stores/variantDetails.ts
@@ -144,6 +144,7 @@ export const useVariantDetailsStore = defineStore('variantDetails', () => {
}),
])
+ storeState.state = State.Active
smallVariant.value = smallVariant$
}
diff --git a/variants/vueapp/src/views/SeqvarDetails/SeqvarDetails.vue b/variants/vueapp/src/views/SeqvarDetails/SeqvarDetails.vue
index d8a1f9a2a..686bb6301 100644
--- a/variants/vueapp/src/views/SeqvarDetails/SeqvarDetails.vue
+++ b/variants/vueapp/src/views/SeqvarDetails/SeqvarDetails.vue
@@ -44,6 +44,9 @@ import SeqvarToolsCard from '@bihealth/reev-frontend-lib/components/SeqvarToolsC
import SeqvarScoresCard from '@bihealth/reev-frontend-lib/components/SeqvarScoresCard/SeqvarScoresCard.vue'
import SeqvarVariantValidatorCard from '@bihealth/reev-frontend-lib/components/SeqvarVariantValidatorCard/SeqvarVariantValidatorCard.vue'
import { useCaseDetailsStore } from '@cases/stores/caseDetails'
+import { State } from '@varfish/storeUtils'
+import { usePubtatorStore } from '@bihealth/reev-frontend-lib/stores/pubtator'
+import { StoreState } from '@bihealth/reev-frontend-lib/stores'
/** This component's props. */
const props = defineProps<{
@@ -73,6 +76,7 @@ const variantDetailsStore = useVariantDetailsStore()
const variantFlagsStore = useVariantFlagsStore()
const variantCommentsStore = useVariantCommentsStore()
const variantAcmgRatingStore = useVariantAcmgRatingStore()
+const pubtatorStore = usePubtatorStore()
/** Currently displayed Seqvar. */
const seqvar = computed(() => {
@@ -146,23 +150,47 @@ const refreshStores = async () => {
])
}
}
-
- document.querySelector(`#${props.selectedSection}`)?.scrollIntoView()
}
/** Watch change in properties to reload data. */
watch(
() => [props.resultRowUuid, props.selectedSection],
+ async () => {
+ await refreshStores()
+ },
+)
+
+watch(
+ () => [
+ variantResultSetStore.storeState.state,
+ pubtatorStore.storeState,
+ geneInfoStore.storeState,
+ seqvarInfoStore.storeState,
+ variantAcmgRatingStore.storeState,
+ variantCommentsStore.storeState,
+ variantDetailsStore.storeState,
+ ],
() => {
- refreshStores()
+ if (
+ variantResultSetStore.storeState.state === State.Active &&
+ pubtatorStore.storeState === StoreState.Active &&
+ geneInfoStore.storeState === StoreState.Active &&
+ seqvarInfoStore.storeState === StoreState.Active &&
+ variantAcmgRatingStore.storeState.state === State.Active &&
+ variantCommentsStore.storeState.state === State.Active &&
+ variantDetailsStore.storeState.state === State.Active
+ ) {
+ setTimeout(() => {
+ document.querySelector(`#${props.selectedSection}`)?.scrollIntoView()
+ }, 500)
+ }
},
)
/** When mounted, scroll to the selected element if any.
*/
-onMounted(() => {
- refreshStores()
- document.querySelector(`#${props.selectedSection}`)?.scrollIntoView()
+onMounted(async () => {
+ await refreshStores()
})