From bb58380b0c0c5ad866c58df50df848b2e7894177 Mon Sep 17 00:00:00 2001
From: Mary Salvi <mary.salvi@kitware.com>
Date: Thu, 23 Jan 2025 15:31:24 -0500
Subject: [PATCH] Update eslint config

---
 web/.eslintrc.js                              |  3 +
 web/jsconfig.json                             | 13 ----
 web/package.json                              |  2 +
 web/src/components/AppBanner.vue              |  2 +-
 web/src/components/FacetedSearch.vue          |  4 +-
 .../components/Presentation/AttributeList.vue |  6 +-
 .../Presentation/ConditionChips.vue           |  4 +-
 .../components/Presentation/FacetedSearch.vue |  4 +-
 web/src/store/index.ts                        |  4 +-
 .../IndividualResults/IndividualTitle.vue     |  4 +-
 web/src/views/IndividualResults/StudyPage.vue |  8 +-
 web/yarn.lock                                 | 73 ++++++++++++++++++-
 12 files changed, 93 insertions(+), 34 deletions(-)
 delete mode 100644 web/jsconfig.json

diff --git a/web/.eslintrc.js b/web/.eslintrc.js
index b9b841d1..7623ae47 100644
--- a/web/.eslintrc.js
+++ b/web/.eslintrc.js
@@ -25,6 +25,9 @@ module.exports = {
   extends: [
     'eslint:recommended',
     'plugin:vue/recommended',
+    'plugin:vuetify/recommended',
+    'plugin:import/typescript',
+    '@vue/eslint-config-typescript',
   ],
   rules: {
     'max-len': 'off',
diff --git a/web/jsconfig.json b/web/jsconfig.json
deleted file mode 100644
index 397b412a..00000000
--- a/web/jsconfig.json
+++ /dev/null
@@ -1,13 +0,0 @@
-{
-  "include": [
-    "src/**/*"
-  ],
-  "compilerOptions": {
-    "baseUrl": "",
-    "paths": {
-      "@/*": [
-        "src/*"
-      ]
-    }
-  }
-}
diff --git a/web/package.json b/web/package.json
index 626e9ac6..7acdfd88 100644
--- a/web/package.json
+++ b/web/package.json
@@ -68,9 +68,11 @@
     "@vitejs/plugin-vue2": "^2.3.3",
     "@vue/eslint-config-typescript": "^9.1.0",
     "eslint": "8",
+    "eslint-import-resolver-alias": "^1.1.2",
     "eslint-plugin-import": "^2.25.3",
     "eslint-plugin-vue": "8",
     "eslint-plugin-vuejs-accessibility": "^1.1.0",
+    "eslint-plugin-vuetify": "^1.1.0",
     "js-yaml": "^4.1.0",
     "sass": "^1.83.1",
     "sass-loader": "^16.0.4",
diff --git a/web/src/components/AppBanner.vue b/web/src/components/AppBanner.vue
index f7002719..dec8d471 100644
--- a/web/src/components/AppBanner.vue
+++ b/web/src/components/AppBanner.vue
@@ -21,7 +21,7 @@ export default defineComponent({
     class="ma-4"
   >
     <p
-      class="title"
+      class="text-h6"
     >
       {{ title || '' }}
     </p>
diff --git a/web/src/components/FacetedSearch.vue b/web/src/components/FacetedSearch.vue
index 9964bdc1..dd53c52a 100644
--- a/web/src/components/FacetedSearch.vue
+++ b/web/src/components/FacetedSearch.vue
@@ -1,5 +1,5 @@
 <script lang="ts">
-import Vue, { PropType } from 'vue';
+import { PropType, set  } from 'vue';
 import { groupBy } from 'lodash';
 
 // @ts-ignore
@@ -89,7 +89,7 @@ export default Vue.extend({
   methods: {
     fieldDisplayName,
     toggleMenu(category: string, value: boolean): void {
-      Vue.set(this.menuState, category, value);
+      set(this.menuState, category, value);
     },
     hasActiveConditions(category: string): boolean {
       return this.conditions.some((cond) => `${cond.table}_${cond.field}` === category);
diff --git a/web/src/components/Presentation/AttributeList.vue b/web/src/components/Presentation/AttributeList.vue
index 80c53bb1..d412134d 100644
--- a/web/src/components/Presentation/AttributeList.vue
+++ b/web/src/components/Presentation/AttributeList.vue
@@ -105,7 +105,7 @@ export default defineComponent({
 
 <template>
   <div>
-    <div class="display-1">
+    <div class="text-h4">
       Attributes
     </div>
     <v-list
@@ -121,7 +121,7 @@ export default defineComponent({
       </v-col>
     </v-list>
     <v-list v-if="alternateIdentifiers.length > 0 || item.emsl_biosample_identifiers.length > 0">
-      <div class="display-1">
+      <div class="text-h4">
         Alternative Identifiers
       </div>
       <AttributeItem
@@ -136,7 +136,7 @@ export default defineComponent({
       />
     </v-list>
     <v-list v-if="type === 'biosample' && relatedBiosamples.length">
-      <div class="display-1">
+      <div class="text-h4">
         Related Biosamples
       </div>
       <v-list-item
diff --git a/web/src/components/Presentation/ConditionChips.vue b/web/src/components/Presentation/ConditionChips.vue
index 5b41bfd6..6e54466d 100644
--- a/web/src/components/Presentation/ConditionChips.vue
+++ b/web/src/components/Presentation/ConditionChips.vue
@@ -1,6 +1,6 @@
 <script>
 import moment from 'moment';
-import Vue from 'vue';
+import { set } from 'vue';
 import { groupBy } from 'lodash';
 import { opMap } from '@/data/api';
 import { fieldDisplayName } from '@/util';
@@ -68,7 +68,7 @@ export default Vue.extend({
       return val;
     },
     toggleMenu(category, value) {
-      Vue.set(this.menuState, category, value);
+      set(this.menuState, category, value);
     },
   },
 });
diff --git a/web/src/components/Presentation/FacetedSearch.vue b/web/src/components/Presentation/FacetedSearch.vue
index 763afe5f..544dc373 100644
--- a/web/src/components/Presentation/FacetedSearch.vue
+++ b/web/src/components/Presentation/FacetedSearch.vue
@@ -1,5 +1,5 @@
 <script lang="ts">
-import Vue, { PropType } from 'vue';
+import Vue, { PropType, set } from 'vue';
 import { groupBy } from 'lodash';
 import { fieldDisplayName } from '@/util';
 import * as encoding from '@/encoding';
@@ -46,7 +46,7 @@ export default Vue.extend({
   methods: {
     fieldDisplayName,
     toggleMenu(category: string, value: boolean): void {
-      Vue.set(this.menuState, category, value);
+      set(this.menuState, category, value);
     },
     hasActiveConditions(category: string): boolean {
       return this.conditions.some((cond) => cond.field === category);
diff --git a/web/src/store/index.ts b/web/src/store/index.ts
index 6b49fdfc..2db3cd3e 100644
--- a/web/src/store/index.ts
+++ b/web/src/store/index.ts
@@ -1,5 +1,5 @@
 import Vue, {
-  computed, ComputedRef, reactive, toRefs, watchEffect,
+  computed, ComputedRef, reactive, toRefs, watchEffect, set,
 } from 'vue';
 import { noop, uniqWith } from 'lodash';
 import VueRouter from 'vue-router';
@@ -146,7 +146,7 @@ function makeNodeMap(node: EnvoNode) {
   } else {
     node.children?.forEach(makeNodeMap);
     if (node.children?.length === 1) {
-      Vue.set(node, 'isExpanded', true);
+      set(node, 'isExpanded', true);
     }
   }
 }
diff --git a/web/src/views/IndividualResults/IndividualTitle.vue b/web/src/views/IndividualResults/IndividualTitle.vue
index a0d9cd92..89e8b689 100644
--- a/web/src/views/IndividualResults/IndividualTitle.vue
+++ b/web/src/views/IndividualResults/IndividualTitle.vue
@@ -35,12 +35,12 @@ export default defineComponent({
         </v-btn>
       </v-col>
       <v-col class="grow">
-        <div class="headline">
+        <div class="text-h5">
           {{ item.annotations.title || item.name }}
         </div>
         <div
           v-if="item[subtitleKey]"
-          class="subtitle-1"
+          class="text-subtitle-1"
         >
           <span class="font-weight-bold pr-1">{{ fieldDisplayName(subtitleKey) }}</span>
           <span v-html="urlify(item[subtitleKey])" />
diff --git a/web/src/views/IndividualResults/StudyPage.vue b/web/src/views/IndividualResults/StudyPage.vue
index bf2274c5..aa41fc79 100644
--- a/web/src/views/IndividualResults/StudyPage.vue
+++ b/web/src/views/IndividualResults/StudyPage.vue
@@ -264,7 +264,7 @@ export default defineComponent({
             />
           </v-container>
           <v-col offset="1">
-            <div class="display-1">
+            <div class="text-h4">
               NMDC Details
             </div>
             <v-list>
@@ -283,7 +283,7 @@ export default defineComponent({
                   (item.relevant_protocols && item.relevant_protocols.length > 0) ||
                   item.principal_investigator_websites.length > 0"
             >
-              <div class="display-1">
+              <div class="text-h4">
                 Additional Resources
               </div>
               <v-list
@@ -482,7 +482,7 @@ export default defineComponent({
             v-if="item.part_of && item.part_of.length > 0"
             flat
           >
-            <v-card-title class="display-1">
+            <v-card-title class="text-h4">
               Part of:
             </v-card-title>
             <v-list>
@@ -506,7 +506,7 @@ export default defineComponent({
             v-if="item.children && item.children.length > 0"
             flat
           >
-            <v-card-title class="display-1">
+            <v-card-title class="text-h4">
               Associated Studies:
             </v-card-title>
             <v-list>
diff --git a/web/yarn.lock b/web/yarn.lock
index 4d50f636..931724e7 100644
--- a/web/yarn.lock
+++ b/web/yarn.lock
@@ -1437,11 +1437,16 @@
   dependencies:
     vue-eslint-parser "^8.0.0"
 
-acorn-jsx@^5.3.2:
+acorn-jsx@^5.2.0, acorn-jsx@^5.3.2:
   version "5.3.2"
   resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937"
   integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==
 
+acorn@^7.1.1:
+  version "7.4.1"
+  resolved "https://registry.yarnpkg.com/acorn/-/acorn-7.4.1.tgz#feaed255973d2e77555b83dbc08851a6c63520fa"
+  integrity sha512-nQyp0o1/mNdbTO1PO6kHkwSrmgZ0MT/jCCpNiwbUjGoRN4dlBhqJtoQuCnEOKzgTVwg0ZWiCoQy6SxMebQVh8A==
+
 acorn@^8.14.0, acorn@^8.9.0:
   version "8.14.0"
   resolved "https://registry.yarnpkg.com/acorn/-/acorn-8.14.0.tgz#063e2c70cac5fb4f6467f0b11152e04c682795b0"
@@ -2271,7 +2276,7 @@ debug@^3.2.7:
   dependencies:
     ms "^2.1.1"
 
-debug@^4.1.0, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@^4.4.0:
+debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.2, debug@^4.3.4, debug@^4.4.0:
   version "4.4.0"
   resolved "https://registry.yarnpkg.com/debug/-/debug-4.4.0.tgz#2b3f2aea2ffeb776477460267377dc8710faba8a"
   integrity sha512-6WTZ/IxCY/T6BALoZHaE4ctp9xm+Z5kY/pzYaCHRFeyVhojxlrm+46y68HA6hr0TcwEssoxNiDEUJQjfPZ/RYA==
@@ -2516,6 +2521,11 @@ escape-string-regexp@^4.0.0:
   resolved "https://registry.yarnpkg.com/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz#14ba83a5d373e3d311e5afca29cf5bfad965bf34"
   integrity sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==
 
+eslint-import-resolver-alias@^1.1.2:
+  version "1.1.2"
+  resolved "https://registry.yarnpkg.com/eslint-import-resolver-alias/-/eslint-import-resolver-alias-1.1.2.tgz#297062890e31e4d6651eb5eba9534e1f6e68fc97"
+  integrity sha512-WdviM1Eu834zsfjHtcGHtGfcu+F30Od3V7I9Fi57uhBEwPkjDcii7/yW8jAT+gOhn4P/vOxxNAXbFAKsrrc15w==
+
 eslint-import-resolver-node@^0.3.9:
   version "0.3.9"
   resolved "https://registry.yarnpkg.com/eslint-import-resolver-node/-/eslint-import-resolver-node-0.3.9.tgz#d4eaac52b8a2e7c3cd1903eb00f7e053356118ac"
@@ -2569,6 +2579,16 @@ eslint-plugin-vue@8:
     semver "^7.3.5"
     vue-eslint-parser "^8.0.1"
 
+eslint-plugin-vue@^7.0.0:
+  version "7.20.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-vue/-/eslint-plugin-vue-7.20.0.tgz#98c21885a6bfdf0713c3a92957a5afeaaeed9253"
+  integrity sha512-oVNDqzBC9h3GO+NTgWeLMhhGigy6/bQaQbHS+0z7C4YEu/qK/yxHvca/2PTZtGNPsCrHwOTgKMrwu02A9iPBmw==
+  dependencies:
+    eslint-utils "^2.1.0"
+    natural-compare "^1.4.0"
+    semver "^6.3.0"
+    vue-eslint-parser "^7.10.0"
+
 eslint-plugin-vuejs-accessibility@^1.1.0:
   version "1.2.0"
   resolved "https://registry.yarnpkg.com/eslint-plugin-vuejs-accessibility/-/eslint-plugin-vuejs-accessibility-1.2.0.tgz#b7304bc8dfe4fad930c5d95cd51a2e0979225bda"
@@ -2578,6 +2598,14 @@ eslint-plugin-vuejs-accessibility@^1.1.0:
     emoji-regex "^10.0.0"
     vue-eslint-parser "^9.0.1"
 
+eslint-plugin-vuetify@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-plugin-vuetify/-/eslint-plugin-vuetify-1.1.0.tgz#8853105e0ce18449e59c55f008a8b6359f15b320"
+  integrity sha512-I1YRUCGkDqe8F7O0tdf63UZVKtk4734+8fzbZ24YIZKTTyQp/FIR0nSZYG8mPFhTWerzPta7oXNzliBOwP2XeQ==
+  dependencies:
+    eslint-plugin-vue "^7.0.0"
+    requireindex "^1.2.0"
+
 eslint-scope@^5.1.1:
   version "5.1.1"
   resolved "https://registry.yarnpkg.com/eslint-scope/-/eslint-scope-5.1.1.tgz#e786e59a66cb92b3f6c1fb0d508aab174848f48c"
@@ -2594,6 +2622,13 @@ eslint-scope@^7.0.0, eslint-scope@^7.1.1, eslint-scope@^7.2.2:
     esrecurse "^4.3.0"
     estraverse "^5.2.0"
 
+eslint-utils@^2.1.0:
+  version "2.1.0"
+  resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-2.1.0.tgz#d2de5e03424e707dc10c74068ddedae708741b27"
+  integrity sha512-w94dQYoauyvlDc43XnGB8lU3Zt713vNChgt4EWwhXAP2XkBvndfxF0AgIqKOOasjPIPzj9JqgwkwbCYD0/V3Zg==
+  dependencies:
+    eslint-visitor-keys "^1.1.0"
+
 eslint-utils@^3.0.0:
   version "3.0.0"
   resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-3.0.0.tgz#8aebaface7345bb33559db0a1f13a1d2d48c3672"
@@ -2601,6 +2636,11 @@ eslint-utils@^3.0.0:
   dependencies:
     eslint-visitor-keys "^2.0.0"
 
+eslint-visitor-keys@^1.1.0:
+  version "1.3.0"
+  resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.3.0.tgz#30ebd1ef7c2fdff01c3a4f151044af25fab0523e"
+  integrity sha512-6J72N8UNa462wa/KFODt/PJ3IU60SDpC3QXC1Hjc1BXXpfL2C9R5+AU7jhe0F6GREqVMh4Juu+NY7xn+6dipUQ==
+
 eslint-visitor-keys@^2.0.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-2.1.0.tgz#f65328259305927392c938ed44eb0a5c9b2bd303"
@@ -2655,6 +2695,15 @@ eslint@8:
     strip-ansi "^6.0.1"
     text-table "^0.2.0"
 
+espree@^6.2.1:
+  version "6.2.1"
+  resolved "https://registry.yarnpkg.com/espree/-/espree-6.2.1.tgz#77fc72e1fd744a2052c20f38a5b575832e82734a"
+  integrity sha512-ysCxRQY3WaXJz9tdbWOwuWr5Y/XrPTGX9Kiz3yoUXwW0VZ4w30HTkQLaGx/+ttFjF8i+ACbArnB4ce68a9m5hw==
+  dependencies:
+    acorn "^7.1.1"
+    acorn-jsx "^5.2.0"
+    eslint-visitor-keys "^1.1.0"
+
 espree@^9.0.0, espree@^9.3.1, espree@^9.6.0, espree@^9.6.1:
   version "9.6.1"
   resolved "https://registry.yarnpkg.com/espree/-/espree-9.6.1.tgz#a2a17b8e434690a5432f2f8018ce71d331a48c6f"
@@ -4066,6 +4115,11 @@ regexp.prototype.flags@^1.5.3:
     gopd "^1.2.0"
     set-function-name "^2.0.2"
 
+requireindex@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/requireindex/-/requireindex-1.2.0.tgz#3463cdb22ee151902635aa6c9535d4de9c2ef1ef"
+  integrity sha512-L9jEkOi3ASd9PYit2cwRfyppc9NoABujTP8/5gFcbERmo5jUoAKovIC3fsF17pkTnGsrByysqX+Kxd2OTNI1ww==
+
 requires-port@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/requires-port/-/requires-port-1.0.0.tgz#925d2601d39ac485e091cf0da5c6e694dc3dcaff"
@@ -4191,7 +4245,7 @@ sass@^1.83.1:
   optionalDependencies:
     "@parcel/watcher" "^2.4.1"
 
-semver@^6.3.1:
+semver@^6.3.0, semver@^6.3.1:
   version "6.3.1"
   resolved "https://registry.yarnpkg.com/semver/-/semver-6.3.1.tgz#556d2ef8689146e46dcea4bfdd095f3434dffcb4"
   integrity sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==
@@ -4656,6 +4710,19 @@ vue-async-computed@^3.9.0:
   resolved "https://registry.yarnpkg.com/vue-async-computed/-/vue-async-computed-3.9.0.tgz#af3181c25168bfe9d86d8ffbc7033bf9e484fe84"
   integrity sha512-ac6m/9zxHHNGGKNOU1en8qNk+fAmEbJLuWL7qyQTFuH3vjv3V4urv//QHcVzCobROM6btnaDG2b+XYMncF/ETA==
 
+vue-eslint-parser@^7.10.0:
+  version "7.11.0"
+  resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-7.11.0.tgz#214b5dea961007fcffb2ee65b8912307628d0daf"
+  integrity sha512-qh3VhDLeh773wjgNTl7ss0VejY9bMMa0GoDG2fQVyDzRFdiU3L7fw74tWZDHNQXdZqxO3EveQroa9ct39D2nqg==
+  dependencies:
+    debug "^4.1.1"
+    eslint-scope "^5.1.1"
+    eslint-visitor-keys "^1.1.0"
+    espree "^6.2.1"
+    esquery "^1.4.0"
+    lodash "^4.17.21"
+    semver "^6.3.0"
+
 vue-eslint-parser@^8.0.0, vue-eslint-parser@^8.0.1:
   version "8.3.0"
   resolved "https://registry.yarnpkg.com/vue-eslint-parser/-/vue-eslint-parser-8.3.0.tgz#5d31129a1b3dd89c0069ca0a1c88f970c360bd0d"