Resolve "Design of the structure section in a system's page"

Ref #137 (closed)

components/content/pdockqMatrix.vue

@@ -30,6 +30,23 @@ const margin = ref<PlotMargin>({
     marginLeft: 150
 })
 
+const data = ref()
+onBeforeMount(async () => {
+
+    const { data: d, error } = await useAsyncMeiliSearch({
+        index: toValue(dbName), query: "", params: {
+            facets: ["*"],
+            filter: [
+                `System='${toValue(computedSystem)}'`,
+                ...toValue(filterBase)
+            ],
+        }
+    })
+    data.value = d.value
+    if (error.value) {
+        throw createError("Error while getting structure pdocks")
+    }
+})
 
 onMounted(async () => {
 
@@ -46,10 +63,10 @@ onMounted(async () => {
     if (error.value) {
         throw createError("Error while getting structure pdocks")
     }
-
 })
 
 
+
 const computedSystem = computed(() => {
     const toValPage = toValue(page)
     const toValSystem = toValue(system)
@@ -64,33 +81,35 @@ const computedSystem = computed(() => {
 
 const groupedPdocks = computed(() => {
     const toValData = toValue(data)
-    return d3.groups(toValData.hits.flatMap(({ System_name_ok, pDockQ, pdb, nb_sys, proteins_in_the_prediction, system_genes }) => {
+    if (toValData?.hits) {
+        return d3.groups(toValData.hits.flatMap(({ System_name_ok, pDockQ, pdb, nb_sys, proteins_in_the_prediction, system_genes }) => {
 
 
-        if (proteins_in_the_prediction.length === 2) {
-            const sanitizedSystemGenes = system_genes.map(d => d.split("__")[1])
-            const sanitizedProteins = proteins_in_the_prediction.map(d => d.split("__")[1])
-            const setProteins = new Set(sanitizedProteins)
+            if (proteins_in_the_prediction.length === 2) {
+                const sanitizedSystemGenes = system_genes.map(d => d.split("__")[1])
+                const sanitizedProteins = proteins_in_the_prediction.map(d => d.split("__")[1])
+                const setProteins = new Set(sanitizedProteins)
 
 
-            if (setProteins.size === 2) {
+                if (setProteins.size === 2) {
 
-                return sanitizedProteins.map((prot, i) => {
-                    if (i === 0) {
-                        return { System_name_ok, system_genes: sanitizedSystemGenes, pDockQ, pdb, nb_sys, proteins_in_the_prediction: sanitizedProteins, protX: prot, protY: sanitizedProteins[i + 1] }
-                    }
-                    else {
-                        return { System_name_ok, system_genes: sanitizedSystemGenes, pDockQ, pdb, nb_sys, proteins_in_the_prediction: sanitizedProteins, protX: prot, protY: sanitizedProteins[i - 1] }
-                    }
+                    return sanitizedProteins.map((prot, i) => {
+                        if (i === 0) {
+                            return { System_name_ok, system_genes: sanitizedSystemGenes, pDockQ, pdb, nb_sys, proteins_in_the_prediction: sanitizedProteins, protX: prot, protY: sanitizedProteins[i + 1] }
+                        }
+                        else {
+                            return { System_name_ok, system_genes: sanitizedSystemGenes, pDockQ, pdb, nb_sys, proteins_in_the_prediction: sanitizedProteins, protX: prot, protY: sanitizedProteins[i - 1] }
+                        }
 
-                })
+                    })
+                } else {
+                    return { System_name_ok, system_genes: sanitizedSystemGenes, pDockQ, pdb, nb_sys, proteins_in_the_prediction: sanitizedProteins, protX: sanitizedProteins[0], protY: sanitizedProteins[1] }
+                }
             } else {
-                return { System_name_ok, system_genes: sanitizedSystemGenes, pDockQ, pdb, nb_sys, proteins_in_the_prediction: sanitizedProteins, protX: sanitizedProteins[0], protY: sanitizedProteins[1] }
+                throw createError(`More than 2 proteins in a dimer structure for system ${computedSystem.value} !`)
             }
-        } else {
-            throw createError(`More than 2 proteins in a dimer structure for system ${computedSystem.value} !`)
-        }
-    }), d => d.system_genes.sort().join("--"))
+        }), d => d.system_genes.sort().join("--"))
+    } else { return [] }
 })
 
 
@@ -128,19 +147,19 @@ const computedPDocksMatrixPlotOptions = computed(() => {
     })
 })
 
-const { data, error } = await useAsyncMeiliSearch({
-    index: toValue(dbName), query: "", params: {
-        facets: ["*"],
-        filter: [
-            `System='${toValue(computedSystem)}'`,
-            ...toValue(filterBase)
-        ],
-    }
-})
-
-if (error.value) {
-    throw createError("Error while getting structure pdocks")
-}
+// const { data, error } = await useAsyncMeiliSearch({
+//     index: toValue(dbName), query: "", params: {
+//         facets: ["*"],
+//         filter: [
+//             `System='${toValue(computedSystem)}'`,
+//             ...toValue(filterBase)
+//         ],
+//     }
+// })
+
+// if (error.value) {
+//     throw createError("Error while getting structure pdocks")
+// }
 </script>
 <template>
     <v-card flat color="transparent">