Merge branch 'system-distribution-plot' into update-article-auto-sections

.vscode/settings.json

@@ -2,5 +2,50 @@
     "editor.defaultFormatter": "Vue.volar",
     "[python]": {
         "editor.defaultFormatter": "ms-python.black-formatter"
-    }
-}
\ No newline at end of file
+    },
+
+
+
+  // Enable the ESlint flat config support
+  "eslint.experimental.useFlatConfig": true,
+
+  // Disable the default formatter, use eslint instead
+  "prettier.enable": false,
+  "editor.formatOnSave": false,
+
+  // Auto fix
+  "editor.codeActionsOnSave": {
+    "source.fixAll.eslint": "explicit",
+    "source.organizeImports": "never"
+  },
+
+  // Silent the stylistic rules in you IDE, but still auto fix them
+  "eslint.rules.customizations": [
+    { "rule": "style/*", "severity": "off" },
+    { "rule": "format/*", "severity": "off" },
+    { "rule": "*-indent", "severity": "off" },
+    { "rule": "*-spacing", "severity": "off" },
+    { "rule": "*-spaces", "severity": "off" },
+    { "rule": "*-order", "severity": "off" },
+    { "rule": "*-dangle", "severity": "off" },
+    { "rule": "*-newline", "severity": "off" },
+    { "rule": "*quotes", "severity": "off" },
+    { "rule": "*semi", "severity": "off" }
+  ],
+
+  // Enable eslint for all supported languages
+  "eslint.validate": [
+    "javascript",
+    "javascriptreact",
+    "typescript",
+    "typescriptreact",
+    "vue",
+    "html",
+    "markdown",
+    "json",
+    "jsonc",
+    "yaml",
+    "toml",
+    "astro",
+  ],
+ 
\ No newline at end of file

components/content/ArticleSystemDistributionPlot.vue

 <script setup lang="ts">
-import { toValue } from '@vueuse/core';
+
+import { computed, toValue, ref, onMounted, watchEffect, unref } from 'vue'
 import * as d3 from "d3";
 import * as Plot from "@observablehq/plot";
 import { useDisplay } from "vuetify";
@@ -22,7 +23,7 @@ const { width } = useDisplay();
 const systemHits = ref(undefined)
 const refseqTaxo = ref(undefined)
 const selectedTaxoRank = ref("phylum")
-const taxoRanks: Ref<string[]> = ref([
+const taxoRanks = ref<string[]>([
     "species",
     "genus",
     "family",
@@ -40,7 +41,6 @@ const pending = ref<boolean>(false)
 const genomeCountThreshold = ref<boolean>(true)
 const genomeCountDomain = ref<[number | null, number | null]>([null, null])
 const genomeCountValue = ref<number>(10)
-const resetCount = ref<Fn | null>(null)
 
 
 const genomePercentDomain = ref<[number, number]>([0, 100])
@@ -80,7 +80,8 @@ const computedDistribution = computed(() => {
         const distribution = []
         for (const [taxo, values] of itemsPerGroup.entries()) {
             if (toValFacetsPerRank[taxo] && toValFacetsPerRank[taxo] > 0) {
-                distribution.push({ taxo, size: values.size, percent: (values.size / toValFacetsPerRank[taxo]) * 100 })
+                const totalGenomePerTaxa = toValFacetsPerRank[taxo]
+                distribution.push({ taxo, size: totalGenomePerTaxa, percent: (values.size / totalGenomePerTaxa) * 100 })
             }
         }
         return distribution
@@ -99,9 +100,6 @@ const filteredDistribution = computed(() => {
     })
 })
 
-// const totalGenome = computed(() => {
-//     refseqTaxo?.estimatedTotalHits
-// })
 const systemStatistics = computed(() => {
     const toValSystemHits = toValue(systemHits)
     const toValRefseqTaxo = toValue(refseqTaxo)

components/content/PdbeMolstarPlugin.vue

@@ -46,8 +46,8 @@ const title = defineModel('title')
 const pdbeMolstarComponent = ref(null)
 
 const dialog = ref(false)
-const moleculeFormat: Ref<string> = ref("pdb")
-const selectedPdb: Ref<string | null> = ref(null)
+const moleculeFormat = ref<string>("pdb")
+const selectedPdb = ref<string | null>(null)
 const structureToDownload: Ref<string | null> = ref(null)
 
 

components/content/RefArticle.vue

 <script setup lang="ts">
 import { useTheme } from "vuetify";
-import type { WikiArticle } from '@/types/articles';
+import { useFetchArticle } from "../../composables/useFetchArticle";
 
 
 const theme = useTheme();

components/content/References.vue

 <script setup lang="ts">
 import ProseH2 from '~/components/content/ProseH2'
+import { computed } from 'vue'
+
 const { page } = useContent();
 const computedDois = computed(() => {
     if (page.value?.references?.length > 0) {

eslint.config.mjs

+import withNuxt from './.nuxt/eslint.config.mjs'
 import antfu from '@antfu/eslint-config'
-
-export default antfu({
-  formatters: true,
-  unocss: true,
-  vue: true,
-})
+export default withNuxt(
+  // your custom flat configs go here, for example:
+  // {
+  //   files: ['**/*.ts', '**/*.tsx'],
+  //   rules: {
+  //     'no-console': 'off' // allow console.log in TypeScript files
+  //   }
+  // },
+  // {
+  //   ...
+  // }
+  antfu({
+    // ...@antfu/eslint-config options
+  }),
+)

nuxt.config.ts

@@ -11,6 +11,7 @@ export default defineNuxtConfig({
     'nuxt-meilisearch',
     '@nuxtjs/plausible',
     '@nuxtjs/seo',
+    '@nuxt/eslint'
   ],
   app: {
     head: {
@@ -94,6 +95,13 @@ export default defineNuxtConfig({
       isCustomElement: (tag) => ['pdbe-molstar'].includes(tag),
     },
   },
+  eslint: {
+    /* module options */
+    lintOnStart: false,
+    config: {
+      stylistic: true // <---
+    }
+  }
 
 
 })

package.json

@@ -17,6 +17,7 @@
     "@iconify-json/tabler": "^1.1.103",
     "@iconify-json/vscode-icons": "^1.1.32",
     "@nuxt/content": "^2.10.0",
+    "@nuxt/eslint": "^0.3.1",
     "@nuxtjs/plausible": "^0.2.4",
     "@nuxtjs/seo": "^2.0.0-rc.9",
     "@types/d3": "^7.4.3",
@@ -25,12 +26,13 @@
     "@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.11.6",
+    "@antfu/eslint-config": "^2.12.2",
     "eslint-plugin-format": "^0.1.0",
-    "@unocss/eslint-plugin": "^0.58.8"
+    "@unocss/eslint-plugin": "^0.59.0"
   },
   "overrides": {
     "vue": "latest"

types/articles.ts

+import type { MarkdownParsedContent } from '@nuxt/content/dist/runtime/types'
+
+
+
+interface DefenseFinderContent extends MarkdownParsedContent {
+    tableColumns: {
+        article: {
+            doi: string
+            abstract?: string
+        }
+        Sensor: string
+        Activator: string
+        Effector: string
+        PFAM: string
+    }
+    contributors?: string[]
+    relevantAbstracts: { doi: string }[]
+}
+
+
 export interface WikiArticle {
     DOI: string
     title?: string