Renovate config files (#1117)

* Renovate the config files * Return Vue and TS ESLint plugins * Revert Prettier config Add typing to ESLint config Re-revert package.json * Re-add ESLint plugin for Prettier (it went missing during merge, oops) * Try to fix CI by explicit dependency * Try to fix CI by explicit dependency x2 * Try to fix CI magically Additionally, remove unneeded jsconfig.json * Brawaru found the reason Co-authored-by: Sasha Sorokin <10401817+brawaru@users.noreply.github.com> --------- Co-authored-by: Sasha Sorokin <10401817+brawaru@users.noreply.github.com>
2023-05-06 22:17:43 +03:00 · 2023-05-06 22:17:43 +03:00 · 732f88ff51
commit 732f88ff51
parent c08139b812
17 changed files with 109 additions and 201 deletions
--- a/.eslintrc.js
+++ b/.eslintrc.js
@ -0,0 +1,18 @@
+// @ts-check
+/** @type {import("eslint").ESLint.ConfigData} */
+module.exports = {
+  root: true,
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:vue/vue3-recommended',
+    '@nuxtjs/eslint-config-typescript',
+    'plugin:prettier/recommended', // Integrate Prettier into ESLint
+    'prettier', // Disable unnecessary ESLint rules in the presence of Prettier
+  ],
+  rules: {
+    'no-console': 'off',
+    'vue/no-v-html': 'off',
+    'vue/multi-word-component-names': 'off',
+  },
+}
--- a/.eslintrc.json
+++ b/.eslintrc.json
@ -1,27 +0,0 @@
-{
-  "env": {
-    "browser": true,
-    "es2021": true,
-    "node": true
-  },
-  "extends": [
-    "eslint:recommended",
-    "plugin:vue/vue3-recommended",
-    "plugin:@typescript-eslint/recommended",
-    "@nuxtjs/eslint-config-typescript",
-    "prettier"
-  ],
-  "parserOptions": {
-    "ecmaVersion": "latest",
-    "parser": "@typescript-eslint/parser",
-    "sourceType": "module"
-  },
-  "plugins": ["vue", "@typescript-eslint"],
-  "rules": {
-    "no-console": "off",
-    "vue/no-v-html": "off",
-    "comma-dangle": ["error", "only-multiline"],
-    "vue/multi-word-component-names": "off",
-    "import/no-named-as-default": "off"
-  }
-}
--- a/app.vue
+++ b/app.vue
@ -7,5 +7,5 @@
 </template>
 <script setup lang="ts">
 import ModrinthLoadingIndicator from '~/components/ui/modrinth-loading-indicator'
-import Notifications from '~/components/ui/Notifications'
+import Notifications from '~/components/ui/Notifications.vue'
 </script>
--- a/components/ui/ModalReport.vue
+++ b/components/ui/ModalReport.vue
@ -20,7 +20,7 @@
          <strong>Reason</strong>
        </span>
      </label>
-      <multiselect
+      <Multiselect
        id="report-type"
        v-model="reportType"
        :options="$tag.reportTypes"
@ -57,7 +57,7 @@
 </template>

 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import CrossIcon from '~/assets/images/utils/x.svg'
 import CheckIcon from '~/assets/images/utils/check.svg'
 import Modal from '~/components/ui/Modal'
--- a/components/ui/VersionFilterControl.vue
+++ b/components/ui/VersionFilterControl.vue
@ -84,7 +84,7 @@
 </template>

 <script setup>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import Checkbox from '~/components/ui/Checkbox'
 import ClearIcon from '~/assets/images/utils/clear.svg'

--- a/components/ui/modrinth-loading-indicator.ts
+++ b/components/ui/modrinth-loading-indicator.ts
@ -42,7 +42,7 @@ export default defineComponent({

    const loading = useLoading()

-    watch(loading, (newValue, _oldValue) => {
+    watch(loading, (newValue) => {
      if (newValue) {
        indicator.start()
      } else {
--- a/jsconfig.json
+++ b/jsconfig.json
@ -1,12 +0,0 @@
-{
-  "compilerOptions": {
-    "baseUrl": ".",
-    "paths": {
-      "~/*": ["./*"],
-      "@/*": ["./*"],
-      "~~/*": ["./*"],
-      "@@/*": ["./*"]
-    }
-  },
-  "exclude": ["node_modules", ".nuxt", "dist"]
-}
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@ -1,6 +1,5 @@
 import { promises as fs } from 'fs'
 import svgLoader from 'vite-svg-loader'
-import eslintPlugin from 'vite-plugin-eslint'
 import { resolve } from 'pathe'
 import { defineNuxtConfig } from 'nuxt/config'
 import { $fetch } from 'ofetch'
@ -8,6 +7,38 @@ import { $fetch } from 'ofetch'
 const STAGING_API_URL = 'https://staging-api.modrinth.com/v2/'
 const STAGING_ARIADNE_URL = 'https://staging-ariadne.modrinth.com/v1/'

+const preloadedFonts = [
+  'inter/Inter-Regular.woff2',
+  'inter/Inter-Medium.woff2',
+  'inter/Inter-SemiBold.woff2',
+  'inter/Inter-Bold.woff2',
+]
+
+const favicons = {
+  '(prefers-color-scheme:no-preference)': '/favicon-light.ico',
+  '(prefers-color-scheme:light)': '/favicon-light.ico',
+  '(prefers-color-scheme:dark)': '/favicon.ico',
+}
+
+const meta = {
+  description:
+    'Download Minecraft mods, plugins, datapacks, shaders, resourcepacks, and modpacks on Modrinth. Discover and publish projects on Modrinth with a modern, easy to use interface and API.',
+  publisher: 'Rinth, Inc.',
+  'apple-mobile-web-app-title': 'Modrinth',
+  'theme-color': '#1bd96a',
+  'color-scheme': 'dark light',
+  // OpenGraph
+  'og:title': 'Modrinth',
+  'og:site_name': 'Modrinth',
+  'og:description': 'An open source modding platform',
+  'og:type': 'website',
+  'og:url': 'https://modrinth.com',
+  'og:image': 'https://cdn.modrinth.com/modrinth-new.png?',
+  // Twitter
+  'twitter:card': 'summary',
+  'twitter:site': '@modrinth',
+}
+
 export default defineNuxtConfig({
  app: {
    head: {
@ -15,108 +46,23 @@ export default defineNuxtConfig({
        lang: 'en',
      },
      title: 'Modrinth',
-      meta: [
-        {
-          name: 'description',
-          content:
-            'Download Minecraft mods, plugins, datapacks, shaders, resourcepacks, and modpacks on Modrinth. Discover and publish projects on Modrinth with a modern, easy to use interface and API.',
-        },
-        {
-          name: 'publisher',
-          content: 'Rinth, Inc.',
-        },
-        {
-          name: 'og:title',
-          content: 'Modrinth',
-        },
-        {
-          name: 'apple-mobile-web-app-title',
-          content: 'Modrinth',
-        },
-        {
-          name: 'theme-color',
-          content: '#1bd96a',
-        },
-        {
-          name: 'color-scheme',
-          content: 'dark light',
-        },
-        {
-          name: 'og:site_name',
-          content: 'Modrinth',
-        },
-        {
-          name: 'og:description',
-          content: 'An open source modding platform',
-        },
-        {
-          name: 'og:type',
-          content: 'website',
-        },
-        {
-          name: 'og:url',
-          content: 'https://modrinth.com',
-        },
-        {
-          name: 'og:image',
-          content: 'https://cdn.modrinth.com/modrinth-new.png?',
-        },
-        {
-          name: 'twitter:card',
-          content: 'summary',
-        },
-        {
-          name: 'twitter:site',
-          content: '@modrinth',
-        },
-      ],
+      meta: Object.entries(meta).map(([name, content]): object => {
+        return { name, content }
+      }),
      link: [
-        {
-          rel: 'preload',
-          href: 'https://cdn-raw.modrinth.com/fonts/inter/Inter-Regular.woff2?v=3.19',
-          as: 'font',
-          type: 'font/woff2',
-          crossorigin: true,
-        },
-        {
-          rel: 'preload',
-          href: 'https://cdn-raw.modrinth.com/fonts/inter/Inter-Medium.woff2?v=3.19',
-          as: 'font',
-          type: 'font/woff2',
-          crossorigin: true,
-        },
-        {
-          rel: 'preload',
-          href: 'https://cdn-raw.modrinth.com/fonts/inter/Inter-SemiBold.woff2?v=3.19',
-          as: 'font',
-          type: 'font/woff2',
-          crossorigin: true,
-        },
-        {
-          rel: 'preload',
-          href: 'https://cdn-raw.modrinth.com/fonts/inter/Inter-Bold.woff2?v=3.19',
-          as: 'font',
-          type: 'font/woff2',
-          crossorigin: true,
-        },
-        {
-          rel: 'icon',
-          type: 'image/x-icon',
-          href: '/favicon-light.ico',
-          media: '(prefers-color-scheme:no-preference)',
-        },
-        {
-          rel: 'icon',
-          type: 'image/x-icon',
-          href: '/favicon.ico',
-          media: '(prefers-color-scheme:dark)',
-        },
-        {
-          rel: 'icon',
-          type: 'image/x-icon',
-          href: '/favicon-light.ico',
-          media: '(prefers-color-scheme:light)',
-        },
+        // The type is necessary because the linter can't always compare this very nested/complex type on itself
+        ...preloadedFonts.map((font): object => {
+          return {
+            rel: 'preload',
+            href: `https://cdn-raw.modrinth.com/fonts/${font}?v=3.19`,
+            as: 'font',
+            type: 'font/woff2',
+            crossorigin: 'anonymous',
+          }
+        }),
+        ...Object.entries(favicons).map(([media, href]): object => {
+          return { rel: 'icon', type: 'image/x-icon', href, media }
+        }),
        {
          rel: 'search',
          type: 'application/opensearchdescription+xml',
@ -128,7 +74,6 @@ export default defineNuxtConfig({
  },
  vite: {
    plugins: [
-      eslintPlugin(),
      svgLoader({
        svgoConfig: {
          plugins: [
@ -145,17 +90,20 @@ export default defineNuxtConfig({
      }),
    ],
  },
-  dayjs: {
-    locales: ['en'],
-    defaultLocale: 'en',
-    plugins: ['relativeTime'],
-  },
  hooks: {
    async 'build:before'() {
      // 30 minutes
      const TTL = 30 * 60 * 1000

-      let state = {}
+      let state: {
+        lastGenerated?: string
+        apiUrl?: string
+        categories?: any[]
+        loaders?: any[]
+        gameVersions?: any[]
+        donationPlatforms?: any[]
+        reportTypes?: any[]
+      } = {}
      try {
        state = JSON.parse(await fs.readFile('./generated/state.json', 'utf8'))
      } catch {
@ -170,7 +118,6 @@ export default defineNuxtConfig({
        state.lastGenerated &&
        new Date(state.lastGenerated).getTime() + TTL > new Date().getTime() &&
        // ...but only if the API URL is the same
-        state.apiUrl &&
        state.apiUrl === API_URL
      ) {
        return
@ -212,42 +159,16 @@ export default defineNuxtConfig({
        1
      )

-      routes.push({
-        name: 'search-mods',
-        path: '/mods',
-        file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
-        children: [],
-      })
-      routes.push({
-        name: 'search-modpacks',
-        path: '/modpacks',
-        file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
-        children: [],
-      })
-      routes.push({
-        name: 'search-plugins',
-        path: '/plugins',
-        file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
-        children: [],
-      })
-      routes.push({
-        name: 'search-resourcepacks',
-        path: '/resourcepacks',
-        file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
-        children: [],
-      })
-      routes.push({
-        name: 'search-shaders',
-        path: '/shaders',
-        file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
-        children: [],
-      })
-      routes.push({
-        name: 'search-datapacks',
-        path: '/datapacks',
-        file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
-        children: [],
-      })
+      const types = ['mods', 'modpacks', 'plugins', 'resourcepacks', 'shaders', 'datapacks']
+
+      types.forEach((type) =>
+        routes.push({
+          name: `search-${type}`,
+          path: `/${type}`,
+          file: resolve(__dirname, 'pages/search/[searchProjectType].vue'),
+          children: [],
+        })
+      )
    },
  },
  runtimeConfig: {
@ -266,6 +187,11 @@ export default defineNuxtConfig({
      hash: process.env.VERCEL_GIT_COMMIT_SHA || 'unknown',
    },
  },
+  typescript: {
+    shim: false,
+    strict: true,
+    typeCheck: true,
+  },
 })

 function getApiUrl() {
--- a/package.json
+++ b/package.json
@ -6,23 +6,26 @@
    "generate": "nuxi generate",
    "preview": "nuxi preview",
    "postinstall": "nuxi prepare",
-    "lint:js": "eslint --ext .js,.vue,.ts,.jsx,.tsx,.html,.vue .",
+    "lint:js": "eslint . --ext .js,.vue,.ts",
    "lint": "npm run lint:js && prettier --check .",
-    "fix": "eslint --fix --ext .js,.vue,.ts,.jsx,.tsx,.html,.vue . && prettier --write ."
+    "fix": "eslint . --fix --ext .js,.vue,.ts && prettier --write ."
  },
  "devDependencies": {
    "@nuxtjs/eslint-config-typescript": "^12.0.0",
+    "@types/node": "^20.1.0",
    "@typescript-eslint/eslint-plugin": "^5.50.0",
    "@typescript-eslint/parser": "^5.50.0",
    "eslint": "^8.33.0",
    "eslint-config-prettier": "^8.6.0",
+    "eslint-plugin-prettier": "^4.2.1",
    "eslint-plugin-vue": "^9.9.0",
    "nuxt": "^3.4.2",
    "prettier": "^2.8.3",
    "sass": "^1.58.0",
    "typescript": "^4.9.5",
    "vite-plugin-eslint": "^1.8.1",
-    "vite-svg-loader": "^4.0.0"
+    "vite-svg-loader": "^4.0.0",
+    "vue-tsc": "^1.6.4"
  },
  "dependencies": {
    "@ltd/j-toml": "^1.38.0",
--- a/pages/[type]/[id]/settings/index.vue
+++ b/pages/[type]/[id]/settings/index.vue
@ -203,7 +203,7 @@
 </template>

 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import Avatar from '~/components/ui/Avatar'
 import ModalConfirm from '~/components/ui/ModalConfirm'
 import FileInput from '~/components/ui/FileInput'
--- a/pages/[type]/[id]/settings/links.vue
+++ b/pages/[type]/[id]/settings/links.vue
@ -120,7 +120,7 @@
 </template>

 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import SaveIcon from '~/assets/images/utils/save.svg'

 export default defineNuxtComponent({
--- a/pages/[type]/[id]/version/[version].vue
+++ b/pages/[type]/[id]/version/[version].vue
@ -668,7 +668,7 @@
  </div>
 </template>
 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import { acceptFileFromProjectType } from '~/helpers/fileUtils'
 import { inferVersionInfo } from '~/helpers/infer'
 import { createDataPackVersion } from '~/helpers/package'
--- a/pages/dashboard/projects.vue
+++ b/pages/dashboard/projects.vue
@ -295,7 +295,7 @@
 </template>

 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'

 import Badge from '~/components/ui/Badge.vue'
 import Checkbox from '~/components/ui/Checkbox.vue'
--- a/pages/index.vue
+++ b/pages/index.vue
@ -518,7 +518,7 @@
  </div>
 </template>
 <script setup>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import SearchIcon from '~/assets/images/utils/search.svg'
 import CalendarIcon from '~/assets/images/utils/calendar.svg'
 import ModrinthIcon from '~/assets/images/logo.svg'
--- a/pages/search/[searchProjectType].vue
+++ b/pages/search/[searchProjectType].vue
@ -342,7 +342,7 @@
  </div>
 </template>
 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import ProjectCard from '~/components/ui/ProjectCard'
 import Pagination from '~/components/ui/Pagination'
 import SearchFilter from '~/components/ui/search/SearchFilter'
--- a/pages/settings/index.vue
+++ b/pages/settings/index.vue
@ -135,7 +135,7 @@
 </template>

 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'

 export default defineNuxtComponent({
  components: {
--- a/pages/settings/monetization.vue
+++ b/pages/settings/monetization.vue
@ -90,7 +90,7 @@
 </template>

 <script>
-import Multiselect from 'vue-multiselect'
+import { Multiselect } from 'vue-multiselect'
 import Chips from '~/components/ui/Chips'
 import SaveIcon from '~/assets/images/utils/save.svg'
 import TrashIcon from '~/assets/images/utils/trash.svg'