Add scaffold for bioschema

package.json

@@ -17,7 +17,6 @@
   "dependencies": {
     "@geoman-io/leaflet-geoman-free": "^2.14.2",
     "@nuxt/devalue": "^2.0.0",
-    "@unhead/ssr": "^1.1.26",
     "axios": "^1.3.6",
     "js-yaml": "^4.1.0",
     "leaflet": "^1.9.3",
@@ -28,17 +27,19 @@
   },
   "devDependencies": {
     "@tailwindcss/typography": "^0.5.9",
+    "@unhead/schema-org": "^0.5.0",
+    "@unhead/ssr": "^1.1.26",
     "@vitejs/plugin-vue": "^4.1.0",
     "autoprefixer": "^10.4.14",
     "compression": "^1.7.4",
-    "eslint": "^8.38.0",
+    "eslint": "^8.39.0",
     "eslint-plugin-vue": "^9.11.0",
     "express": "^4.18.2",
     "minimist": "^1.2.8",
     "postcss": "^8.4.23",
     "sass": "^1.62.0",
     "tailwindcss": "^3.3.1",
-    "vite": "^4.3.0",
+    "vite": "^4.3.1",
     "vite-plugin-md": "^0.21.5",
     "vite-plugin-pages": "^0.29.0"
   }

src/App.vue

@@ -6,10 +6,9 @@
 
 <script setup>
 import ApplicationLayout from '@/layout/Application.vue'
-import { useHead, createHead } from 'unhead'
+import { useHead } from 'unhead'
 import { getMetaFromConfig } from '@/utils'
-
-const head = createHead()
+import { useRouter } from 'vue-router'
 const meta = getMetaFromConfig(__APP_ENV__)
 
 useHead({

src/main.js

@@ -3,15 +3,30 @@ import.meta.glob('../config/style/*.{scss,css}', { eager: true })
 
 import App from './App.vue'
 import SetupApp from './modules/setup/views/Index.vue'
+import { SchemaOrgUnheadPlugin } from '@unhead/schema-org'
+import { createHead } from 'unhead'
 import { createPinia } from 'pinia'
 import { createSSRApp } from 'vue'
 import { createRouter } from './router'
 
 export function createApp() {
-  const isAPIConfigurationSet = __APP_ENV__.url && __APP_ENV__.project_token
+  const { url, project_token, schema_host } = __APP_ENV__
+  const isAPIConfigurationSet = url && project_token
   const app = createSSRApp(isAPIConfigurationSet ? App : SetupApp)
   const router = createRouter()
   const store = createPinia()
+  const head = createHead({
+    plugins: [
+      SchemaOrgUnheadPlugin({ host: schema_host }, () => {
+        const { meta, path } = router.currentRoute.value
+
+        return {
+          ...meta,
+          path
+        }
+      })
+    ]
+  })
 
   app.use(router)
   app.use(store)

src/modules/otus/components/CommonNames.vue

@@ -14,13 +14,15 @@ const props = defineProps({
 })
 
 const commonNames = ref([])
-const commonNameLabel = computed(() => commonNames.value.map(item => item.name).join('; '))
+const commonNameLabel = computed(() =>
+  commonNames.value.map((item) => item.name).join('; ')
+)
 
 watch(
   () => props.otuId,
-  id => {
+  (id) => {
     if (id) {
-      TaxonWorks.getOtuDescendants(id, { 
+      TaxonWorks.getOtuDescendants(id, {
         max_descendants_depth: 0,
         extend: ['common_names']
       }).then(({ data }) => {
@@ -29,10 +31,9 @@ watch(
     } else {
       commonNames.value = []
     }
+  },
+  {
+    immediate: true
   }
 )
-
-
-
-
-</script>
+</script>