add root html to structure db

components/content/PdbeMolstarPlugin.vue

@@ -92,6 +92,7 @@ watchEffect(() => {
 
 </script>
 <template>
+    <div>
         <v-dialog v-model="dialog" transition="dialog-bottom-transition" fullscreen :scrim="false">
             <v-card flat :rounded="false">
                 <v-toolbar>
@@ -173,5 +174,6 @@ watchEffect(() => {
                 </v-card-text>
             </v-card>
         </v-dialog>
+    </div>
 
 </template>
\ No newline at end of file

components/content/StructureDb.vue

@@ -6,6 +6,7 @@ import { ServerDbTable } from "#components"
 
 import { joinURL } from 'ufo'
 import { useStructuresBasket } from "~/stores/structuresBasket"
+import type { StructureItem } from "~/types/structure"
 
 interface Item {
     Foldseek_name: string
@@ -22,7 +23,6 @@ const structureBasket = useStructuresBasket()
 
 
 onMounted(async () => {
-
     try {
         const data = await client.index(toValue(dbName)).search("", {
             facets: ["*"],
@@ -35,9 +35,6 @@ onMounted(async () => {
         throw createError("Unable to get structures")
 
     }
-
-
-
 })
 
 
@@ -161,16 +158,18 @@ function pdbNameToCif(pdbPath: string) {
 }
 
 
-function buildStructureUrl(item) {
+function buildStructureUrl(item: StructureItem) {
     return [`/${item.system}/${pdbNameToCif(item.pdb)}`, `/${item.system}/${item.pdb}`]
 }
 
-function displayStructure(item) {
-
-    structureBasket.set(buildStructureUrl(item).map(url => {
-        return toValue(useRefinedUrl(url).refinedUrl)
+function displayStructure(item: StructureItem) {
+    const structureUrls = buildStructureUrl(item)
+    structureBasket.set(structureUrls.map(url => {
+        const refinedUrl = useRefinedUrl(url).refinedUrl
+        return toValue(refinedUrl)
     }))
-    structureTitle.value = `${item.subtype} - ${item.gene_name}`
+    structureTitle.value = `${item?.system} - ${item.subsystem}`
+
 
 }
 const { refinedUrl: downloadAllPdbUrl } = useRefinedUrl("/df-all-pdbs.tar.gz")
@@ -283,7 +282,6 @@ const { refinedUrl: downloadAllCifUrl } = useRefinedUrl("/df-all-cifs.tar.gz")
             <template #toolbar-items>
                 <v-menu>
                     <template v-slot:activator="{ props }">
-                        <!-- <v-tooltip activator="parent" location="top">Download all structures</v-tooltip> -->
                         <v-btn class="align-self-end" v-bind="props" icon="md:download">
                         </v-btn>
                     </template>

package.json

@@ -9,6 +9,7 @@
     "preview": "nuxt preview"
   },
   "devDependencies": {
+    "@antfu/eslint-config": "^2.12.2",
     "@iconify-json/game-icons": "^1.1.7",
     "@iconify-json/gravity-ui": "^1.1.1",
     "@iconify-json/material-symbols": "^1.1.69",
@@ -22,17 +23,16 @@
     "@nuxtjs/seo": "^2.0.0-rc.9",
     "@types/d3": "^7.4.3",
     "@types/node": "^20.11.0",
+    "@unocss/eslint-plugin": "^0.59.0",
     "@unocss/nuxt": "^0.58.3",
     "@unocss/preset-icons": "^0.58.3",
     "@vueuse/core": "^10.7.1",
     "@vueuse/nuxt": "^10.7.1",
     "eslint": "^8.57.0",
-    "nuxt": "^3.11.1",
-    "nuxt-meilisearch": "^1.1.0",
-    "vuetify-nuxt-module": "^0.9.0",
-    "@antfu/eslint-config": "^2.12.2",
     "eslint-plugin-format": "^0.1.0",
-    "@unocss/eslint-plugin": "^0.59.0"
+    "nuxt": "^3.11.2",
+    "nuxt-meilisearch": "^1.1.0",
+    "vuetify-nuxt-module": "^0.13.5"
   },
   "overrides": {
     "vue": "latest"