use client for both structure and refseq compo

components/content/RefseqDb.vue

@@ -25,76 +25,39 @@ const cellPlotMargin = ref({
     marginRight: 50
 })
 
+const client = useMeiliSearchRef()
 
-onBeforeMount(async () => {
-    const { data } = await useAsyncMeiliSearch({
-        index: toValue(dbName), query: "", params: {
-            facets: ["*"],
-            filter: [],
-            page: 1,
-            hitsPerPage: 25,
-
-        }
-    })
-    await getAllHits({
-        index: toValue(dbName), query: "", params: {
-            facets: ["*"],
-            filter: [],
-            // page: 1,
-            // hitsPerPage: 25,
-            limit: 500000,
-            sort: ["type:asc"]
-
-        }
-    })
-    autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
-    // allHitsDb.value = toValue(data)?.hits
-    const { data: taxo } = await useAsyncMeiliSearch({
-        index: toValue("refseqtaxo"), query: "", params: {
-            facets: ["*"],
-            filter: [],
-            page: 1,
-            hitsPerPage: 25,
-        }
-    })
-    taxonomyFacet.value = toValue(taxo)?.facetDistribution
-})
 onMounted(async () => {
-
-    const { data } = await useAsyncMeiliSearch({
-        index: toValue(dbName), query: "", params: {
+    try {
+        const data = await client.index(toValue(dbName)).search("", {
             facets: ["*"],
             filter: [],
             page: 1,
             hitsPerPage: 25,
-            // limit: 500000,
-            // sort: ["type:asc"]
-        }
-    })
+        })
+        autocompleteMeiliFacetsProps.value.facetDistribution = data?.facetDistribution
+    } catch (error) {
+    }
     await getAllHits({
         index: toValue(dbName), query: "", params: {
             facets: ["*"],
             filter: [],
-            // page: 1,
-            // hitsPerPage: 25,
             limit: 500000,
             sort: ["type:asc"]
 
         }
     })
-    autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
-    // allHitsDb.value = toValue(data)?.hits
-
-    const { data: taxo } = await useAsyncMeiliSearch({
-        index: toValue("refseqtaxo"), query: "", params: {
+    try {
+        const taxo = await client.index("refseqtaxo").search("", {
             facets: ["*"],
             filter: [],
             page: 1,
             hitsPerPage: 25,
-        }
-    })
-    taxonomyFacet.value = toValue(taxo)?.facetDistribution
+        })
+        taxonomyFacet.value = taxo?.facetDistribution
+    } catch (error) {
 
+    }
 })
 
 const { serialize } = useSerialize()
@@ -221,16 +184,14 @@ async function getAllHits(params: { index: string, params: Record<string, any>,
 
     pendingAllHits.value = true
     try {
-        const { data, error } = await useAsyncMeiliSearch({
-            ...params,
-            index: "refseqsanitized",
-            params: {
+        const data = await client
+            .index("refseqsanitized")
+            .search("", {
                 ...params.params,
-
                 'attributesToRetrieve': ['type', 'Assembly', ...toValue(availableTaxo)]
-            }
-        })
-        allHits.value = data.value
+            })
+
+        allHits.value = data
     } finally {
         pendingAllHits.value = false
 

components/content/StructureDb.vue

@@ -16,34 +16,41 @@ interface Item {
 const sortBy: Ref<SortItem[]> = ref([{ key: 'System', order: "asc" }])
 const itemValue = ref("id");
 const dbName = ref("structure")
+const client = useMeiliSearchRef()
 
-onBeforeMount(async () => {
-    const { data } = await useAsyncMeiliSearch({
-        index: toValue(dbName), query: "", params: {
+onMounted(async () => {
+
+    try {
+        const data = await client.index(toValue(dbName)).search("", {
             facets: ["*"],
             filter: [],
             page: 1,
             hitsPerPage: 25,
-        }
-    })
-    autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
+        })
+        autocompleteMeiliFacetsProps.value.facetDistribution = data?.facetDistribution
+    } catch (error) {
+        throw createError("Unable to get structures")
 
-})
+    }
 
 
-onMounted(async () => {
-    const { data } = await useAsyncMeiliSearch({
-        index: toValue(dbName), query: "", params: {
-            facets: ["*"],
-            filter: [],
-            page: 1,
-            hitsPerPage: 25,
-        }
-    })
-    autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
 
 })
 
+
+// onBeforeMount(async () => {
+//     const { data } = await useAsyncMeiliSearch({
+//         index: toValue(dbName), query: "", params: {
+//             facets: ["*"],
+//             filter: [],
+//             page: 1,
+//             hitsPerPage: 25,
+//         }
+//     })
+//     autocompleteMeiliFacetsProps.value.facetDistribution = toValue(data)?.facetDistribution
+
+// })
+
 const autocompleteMeiliFacetsProps = ref<AutocompleteMeiliFacetProps>({
     db: toValue(dbName),
     facets: [