Monorepo missing features (#1273)

* fix tauri config

* fix package patch

* regen pnpm lock

* use new workflow

* New GH actions

* Update lockfile

* update scripts

* Fix build script

* Fix missing deps

* Fix assets eslint

* Update libraries lint

* Fix all lint configs

* update lockfile

* add fmt + clippy fails

* Separate App Tauri portion

* fix app features

* Fix lints

* install tauri cli

* update lockfile

* corepack, fix lints

* add store path

* fix unused import

* Fix tests

* Issue templates + port over tauri release

* fix actions

* fix before build command

* Add X86 target

* Update build matrix

* finalize actions

* make debug build smaller

* Use debug build to make cache smaller

* dummy commit

* change proj name

* update file name

* Use release builds for less space use

* Remove rust cache

* Readd for app build

* add merge queue trigger

packages/app-lib/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "@modrinth/app-lib",
+  "scripts": {
+    "build": "cargo build --release",
+    "lint": "cargo fmt --check && cargo clippy -- -D warnings",
+    "fix": "cargo fmt && cargo clippy --fix",
+    "test": "cargo test"
+  },
+  "dependencies": {
+    "@modrinth/app-macros": "workspace:*"
+  }
+}

packages/app-lib/src/api/logs.rs

@@ -114,7 +114,10 @@ pub async fn get_logs_from_type(
         {
             let entry: std::fs::DirEntry =
                 entry.map_err(|e| IOError::with_path(e, &logs_folder))?;
-            let age = entry.metadata()?.created().unwrap_or_else(|_| SystemTime::UNIX_EPOCH);
+            let age = entry
+                .metadata()?
+                .created()
+                .unwrap_or(SystemTime::UNIX_EPOCH);
             let path = entry.path();
             if !path.is_file() {
                 continue;
@@ -125,7 +128,7 @@ pub async fn get_logs_from_type(
                     Logs::build(
                         log_type,
                         age,
-                        &profile_path,
+                        profile_path,
                         file_name,
                         clear_contents,
                     )
@@ -184,7 +187,7 @@ pub async fn get_logs_by_filename(
     .join(&filename);
 
     let metadata = std::fs::metadata(&path)?;
-    let age = metadata.created().unwrap_or_else(|_| SystemTime::UNIX_EPOCH);
+    let age = metadata.created().unwrap_or(SystemTime::UNIX_EPOCH);
 
     Logs::build(log_type, age, &profile_path, filename, Some(true)).await
 }

packages/app-lib/src/api/pack/import/atlauncher.rs

@@ -223,9 +223,9 @@ async fn import_atlauncher_unmanaged(
                     && description.version_id.is_some(),
             ),
         });
-        prof.metadata.icon = description.icon.clone();
-        prof.metadata.game_version = game_version.clone();
-        prof.metadata.loader_version = loader_version.clone();
+        prof.metadata.icon.clone_from(&description.icon);
+        prof.metadata.game_version.clone_from(&game_version);
+        prof.metadata.loader_version.clone_from(&loader_version);
         prof.metadata.loader = mod_loader;
 
         async { Ok(()) }

packages/app-lib/src/api/pack/import/curseforge.rs

@@ -137,9 +137,9 @@ pub async fn import_curseforge(
                 .clone()
                 .unwrap_or_else(|| backup_name.to_string());
             prof.install_stage = ProfileInstallStage::PackInstalling;
-            prof.metadata.icon = icon.clone();
-            prof.metadata.game_version = game_version.clone();
-            prof.metadata.loader_version = loader_version.clone();
+            prof.metadata.icon.clone_from(&icon);
+            prof.metadata.game_version.clone_from(&game_version);
+            prof.metadata.loader_version.clone_from(&loader_version);
             prof.metadata.loader = mod_loader;
 
             async { Ok(()) }
@@ -151,9 +151,10 @@ pub async fn import_curseforge(
             prof.metadata.name = override_title
                 .clone()
                 .unwrap_or_else(|| backup_name.to_string());
-            prof.metadata.icon = icon.clone();
-            prof.metadata.game_version =
-                minecraft_instance.game_version.clone();
+            prof.metadata.icon.clone_from(&icon);
+            prof.metadata
+                .game_version
+                .clone_from(&minecraft_instance.game_version);
             prof.metadata.loader_version = None;
             prof.metadata.loader = ModLoader::Vanilla;
 

packages/app-lib/src/api/pack/import/gdlauncher.rs

@@ -90,9 +90,9 @@ pub async fn import_gdlauncher(
             .clone()
             .unwrap_or_else(|| backup_name.to_string());
         prof.install_stage = ProfileInstallStage::PackInstalling;
-        prof.metadata.icon = icon.clone();
-        prof.metadata.game_version = game_version.clone();
-        prof.metadata.loader_version = loader_version.clone();
+        prof.metadata.icon.clone_from(&icon);
+        prof.metadata.game_version.clone_from(&game_version);
+        prof.metadata.loader_version.clone_from(&loader_version);
         prof.metadata.loader = mod_loader;
 
         async { Ok(()) }

packages/app-lib/src/api/pack/install_from.rs

@@ -407,9 +407,9 @@ pub async fn set_profile_information(
             None
         };
 
-        prof.metadata.icon = description.icon.clone();
-        prof.metadata.game_version = game_version.clone();
-        prof.metadata.loader_version = loader_version.clone();
+        prof.metadata.icon.clone_from(&description.icon);
+        prof.metadata.game_version.clone_from(game_version);
+        prof.metadata.loader_version.clone_from(&loader_version);
         prof.metadata.loader = mod_loader;
 
         async { Ok(()) }

packages/app-lib/src/api/process.rs

@@ -18,9 +18,7 @@ pub async fn has_finished_by_uuid(uuid: Uuid) -> crate::Result<bool> {
 
 // Gets the exit status of a child process stored in the state by UUID
 #[tracing::instrument]
-pub async fn get_exit_status_by_uuid(
-    uuid: Uuid,
-) -> crate::Result<Option<i32>> {
+pub async fn get_exit_status_by_uuid(uuid: Uuid) -> crate::Result<Option<i32>> {
     let state = State::get().await?;
     let children = state.children.read().await;
     children.exit_status(uuid).await

packages/app-lib/src/launcher/download.rs

@@ -88,7 +88,8 @@ pub async fn download_version_info(
             let partial = d::modded::fetch_partial_version(&loader.url).await?;
             info = d::modded::merge_partial_version(partial, info);
         }
-        info.id = version_id.clone();
+
+        info.id.clone_from(&version_id);
 
         write(&path, &serde_json::to_vec(&info)?, &st.io_semaphore).await?;
         Ok(info)

packages/app-lib/src/state/dirs.rs

@@ -165,7 +165,7 @@ impl DirectoryInfo {
     ) -> crate::Result<PathBuf> {
         Ok(profile_id.get_full_path().await?.join("logs"))
     }
-    
+
     /// Gets the crash reports dir for a given profile
     #[inline]
     pub async fn crash_reports_dir(

packages/app-lib/src/state/minecraft_auth.rs

@@ -1070,6 +1070,7 @@ fn get_date_header(headers: &HeaderMap) -> DateTime<Utc> {
 }
 
 #[tracing::instrument]
+#[allow(clippy::format_collect)]
 fn generate_oauth_challenge() -> String {
     let mut rng = rand::thread_rng();
 

packages/app-lib/src/state/profiles.rs

@@ -90,7 +90,7 @@ impl ProfilePathId {
     }
 
     pub async fn profile_path(&self) -> crate::Result<ProfilePathId> {
-        if let Some(p) = crate::profile::get(&self, None).await? {
+        if let Some(p) = crate::profile::get(self, None).await? {
             Ok(p.profile_id())
         } else {
             Err(crate::ErrorKind::UnmanagedProfileError(self.to_string())

packages/app-macros/package.json

@@ -0,0 +1,9 @@
+{
+  "name": "@modrinth/app-macros",
+  "scripts": {
+    "build": "cargo build --release",
+    "lint": "cargo fmt --check && cargo clippy -- -D warnings",
+    "fix": "cargo fmt && cargo clippy --fix",
+    "test": "cargo test"
+  }
+}

packages/assets/.eslintrc.js

@@ -1,5 +1,8 @@
 module.exports = {
   root: true,
   extends: ['custom/library'],
-  ignorePatterns: ['**/*.scss', '**/*.svg', 'node_modules/', 'dist/', 'tsconfig.json'],
+  ignorePatterns: ['**/*.scss', '**/*.svg', 'node_modules/', 'dist/'],
+  env: {
+    node: true,
+  },
 }

packages/assets/index.ts

@@ -54,7 +54,6 @@ import _DashboardIcon from './icons/dashboard.svg?component'
 import _DownloadIcon from './icons/download.svg?component'
 import _DropdownIcon from './icons/dropdown.svg?component'
 import _EditIcon from './icons/edit.svg?component'
-import _ExitIcon from './icons/x.svg?component'
 import _ExpandIcon from './icons/expand.svg?component'
 import _ExternalIcon from './icons/external.svg?component'
 import _EyeIcon from './icons/eye.svg?component'
@@ -205,7 +204,7 @@ export const DashboardIcon = _DashboardIcon
 export const DownloadIcon = _DownloadIcon
 export const DropdownIcon = _DropdownIcon
 export const EditIcon = _EditIcon
-export const ExitIcon = _ExitIcon
+export const ExitIcon = _XIcon
 export const ExpandIcon = _ExpandIcon
 export const ExternalIcon = _ExternalIcon
 export const EyeIcon = _EyeIcon

packages/assets/package.json

@@ -5,9 +5,11 @@
   "main": "./index.ts",
   "types": "./index.ts",
   "scripts": {
-    "lint": "eslint ./**"
+    "lint": "eslint . && prettier --check .",
+    "fix": "eslint . --fix && prettier --write ."
   },
   "devDependencies": {
+    "eslint": "^8.57.0",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*",
     "vue": "^3.4.31"

packages/assets/styles/classes.scss

@@ -226,7 +226,10 @@
 // CLICKABLES/BUTTONS
 a,
 .clickable {
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, scale 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    scale 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   &:active:not(&:disabled) {
@@ -267,7 +270,10 @@ a,
 }
 
 .button-within {
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, transform 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    transform 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   &:focus-visible:not(&.disabled),
@@ -311,7 +317,9 @@ a,
     box-sizing: border-box;
 
     background-color: transparent;
-    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out,
+    transition:
+      background-color 0.2s ease-in-out,
+      border-color 0.2s ease-in-out,
       color 0.2s ease-in-out;
     box-shadow: none;
   }
@@ -659,7 +667,10 @@ a,
   .table-row {
     display: grid;
 
-    transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, scale 0.05s ease-in-out,
+    transition:
+      opacity 0.5s ease-in-out,
+      filter 0.2s ease-in-out,
+      scale 0.05s ease-in-out,
       outline 0.2s ease-in-out;
 
     &.selectable:focus-visible,

packages/assets/styles/defaults.scss

@@ -60,13 +60,17 @@ textarea,
   font-weight: var(--font-weight-medium);
   transition: box-shadow 0.1s ease-in-out;
   min-height: 40px;
-  box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+  box-shadow:
+    var(--shadow-inset-sm),
+    0 0 0 0 transparent;
   border: none;
   outline: none;
 
   &:focus,
   &:focus-visible {
-    box-shadow: inset 0 0 0 transparent, 0 0 0 0.25rem var(--color-brand-shadow);
+    box-shadow:
+      inset 0 0 0 transparent,
+      0 0 0 0.25rem var(--color-brand-shadow);
     color: var(--color-contrast);
     outline: none;
   }
@@ -178,7 +182,10 @@ svg {
 }
 
 .button-animation {
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, transform 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    transform 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   &:active:not(&:disabled) {

packages/assets/styles/inter.scss

@@ -3,7 +3,8 @@
   font-style: normal;
   font-weight: 400;
   font-display: swap;
-  src: url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Regular.woff2?v=3.19') format('woff2'),
+  src:
+    url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Regular.woff2?v=3.19') format('woff2'),
     url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Regular.woff?v=3.19') format('woff');
 }
 @font-face {
@@ -11,7 +12,8 @@
   font-style: normal;
   font-weight: 500;
   font-display: swap;
-  src: url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Medium.woff2?v=3.19') format('woff2'),
+  src:
+    url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Medium.woff2?v=3.19') format('woff2'),
     url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Medium.woff?v=3.19') format('woff');
 }
 @font-face {
@@ -19,7 +21,8 @@
   font-style: normal;
   font-weight: 600;
   font-display: swap;
-  src: url('https://cdn-raw.modrinth.com/fonts/inter/Inter-SemiBold.woff2?v=3.19') format('woff2'),
+  src:
+    url('https://cdn-raw.modrinth.com/fonts/inter/Inter-SemiBold.woff2?v=3.19') format('woff2'),
     url('https://cdn-raw.modrinth.com/fonts/inter/Inter-SemiBold.woff?v=3.19') format('woff');
 }
 @font-face {
@@ -27,7 +30,8 @@
   font-style: normal;
   font-weight: 700;
   font-display: swap;
-  src: url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Bold.woff2?v=3.19') format('woff2'),
+  src:
+    url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Bold.woff2?v=3.19') format('woff2'),
     url('https://cdn-raw.modrinth.com/fonts/inter/Inter-Bold.woff?v=3.19') format('woff');
 }
 @font-face {
@@ -35,6 +39,7 @@
   font-style: normal;
   font-weight: 800;
   font-display: swap;
-  src: url('https://cdn-raw.modrinth.com/fonts/inter/Inter-ExtraBold.woff2?v=3.19') format('woff2'),
+  src:
+    url('https://cdn-raw.modrinth.com/fonts/inter/Inter-ExtraBold.woff2?v=3.19') format('woff2'),
     url('https://cdn-raw.modrinth.com/fonts/inter/Inter-ExtraBold.woff?v=3.19') format('woff');
 }

packages/assets/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "tsconfig/base.json",
-  "include": [".", "icons.d.ts"],
+  "include": [".", "icons.d.ts", ".eslintrc.js"],
   "exclude": ["dist", "build", "node_modules"]
 }

packages/eslint-config-custom/library.js

@@ -2,20 +2,16 @@ const { resolve } = require("node:path");
 
 const project = resolve(process.cwd(), "tsconfig.json");
 
-/*
- * This is a custom ESLint configuration for use with
- * typescript packages.
- *
- * This config extends the Vercel Engineering Style Guide.
- * For more information, see https://github.com/vercel/style-guide
- *
- */
-
 module.exports = {
   extends: [
-    "@vercel/style-guide/eslint/node",
-    "@vercel/style-guide/eslint/typescript",
-  ].map(require.resolve),
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:prettier/recommended',
+    'prettier',
+    'plugin:import/recommended',
+    'plugin:import/typescript',
+    'turbo',
+  ],
   parserOptions: {
     project,
   },

packages/eslint-config-custom/nuxt.js

@@ -2,21 +2,18 @@ const { resolve } = require("node:path");
 
 const project = resolve(process.cwd(), "tsconfig.json");
 
-/*
- * This is a custom ESLint configuration for use with
- * NuxtJs apps.
- *
- * This config extends the Vercel Engineering Style Guide.
- * For more information, see https://github.com/vercel/style-guide
- *
- */
 module.exports = {
   extends: [
-    "@nuxtjs/eslint-config-typescript",
-    "@vercel/style-guide/eslint/node",
-    "@vercel/style-guide/eslint/browser",
-    "turbo",
-  ].map(require.resolve),
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:vue/vue3-recommended',
+    '@nuxtjs/eslint-config-typescript',
+    'plugin:prettier/recommended',
+    'prettier',
+    'plugin:import/recommended',
+    'plugin:import/typescript',
+    'turbo',
+  ],
   parserOptions: {
     sourceType: "module",
   },
@@ -27,11 +24,11 @@ module.exports = {
       },
     },
   },
-  ignorePatterns: ["node_modules/", "dist/", ".eslintrc.cjs", "nuxt.config.ts"],
+  "ignorePatterns": [".nuxt/**", ".output/**", "node_modules", "dist/**"],
   rules: {
-    "comma-dangle": "off",
-    semi: "off",
-    "no-undef": "off",
-    // add specific rules configurations here
+    'no-console': 'off',
+    'vue/no-v-html': 'off',
+    'vue/multi-word-component-names': 'off',
+    'import/extensions': ['error', 'always', { ignorePackages: true }],
   },
 };

packages/eslint-config-custom/package.json

@@ -5,9 +5,11 @@
   "private": true,
   "devDependencies": {
     "@nuxtjs/eslint-config-typescript": "^12.1.0",
-    "@vercel/style-guide": "^5.2.0",
-    "@vue/eslint-config-typescript": "^12.0.0",
-    "eslint-config-turbo": "^2.0.0",
-    "typescript": "^5.3.3"
+    "@vue/eslint-config-typescript": "^13.0.0",
+    "eslint-config-prettier": "^9.1.0",
+    "eslint-config-turbo": "^2.0.6",
+    "eslint-plugin-prettier": "^5.1.3",
+    "typescript": "^5.5.3",
+    "eslint-plugin-unicorn": "^54.0.0"
   }
 }

packages/eslint-config-custom/vue.js

@@ -2,19 +2,17 @@ const { resolve } = require('node:path')
 
 const project = resolve(process.cwd(), 'tsconfig.json')
 
-/*
- * This is a custom ESLint configuration for use with
- * internal that utilize VueJS.
- *
- * This config extends the Vercel Engineering Style Guide.
- * For more information, see https://github.com/vercel/style-guide
- *
- */
-
 module.exports = {
-  extends: ['@vercel/style-guide/eslint/browser', '@vue/eslint-config-typescript'].map(
-    require.resolve,
-  ),
+  extends: [
+    'eslint:recommended',
+    'plugin:@typescript-eslint/recommended',
+    'plugin:vue/vue3-recommended',
+    'plugin:prettier/recommended',
+    'prettier',
+    'plugin:import/recommended',
+    'plugin:import/typescript',
+    'turbo',
+  ],
   parserOptions: {
     ecmaVersion: 'latest',
   },
@@ -25,7 +23,7 @@ module.exports = {
       },
     },
   },
-  ignorePatterns: ['node_modules/', 'dist/', '.eslintrc.js'],
+  ignorePatterns: ['node_modules/', 'dist/', '.eslintrc.js', '*.d.ts'],
 
   rules: {
     'import/no-default-export': 'off',
@@ -33,6 +31,8 @@ module.exports = {
     camelcase: 'off',
     'no-console': 'off',
     'no-bitwise': 'off',
-    // add specific rules configurations here
+    'unicorn/filename-case': 'off',
+    'comma-dangle': ['error', 'only-multiline'],
+    'vue/no-v-html': 'off',
   },
 }

packages/ui/.eslintrc.js

@@ -1,7 +1,4 @@
 module.exports = {
   root: true,
-  extends: ['plugin:vue/vue3-essential', 'custom/vue'],
-  rules: {
-    'unicorn/filename-case': 'off',
-  },
+  extends: ['custom/vue'],
 }

packages/ui/package.json

@@ -5,9 +5,11 @@
   "main": "./index.ts",
   "types": "./index.ts",
   "scripts": {
-    "lint": "eslint ./src --fix"
+    "lint": "eslint . && prettier --check .",
+    "fix": "eslint . --fix && prettier --write ."
   },
   "devDependencies": {
+    "eslint": "^8.57.0",
     "@vintl/unplugin": "^1.5.1",
     "@vintl/vintl": "^4.4.1",
     "eslint-config-custom": "workspace:*",

packages/ui/src/components/base/Avatar.vue

@@ -35,10 +35,10 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref } from 'vue'
 
-const pixelated = ref(false);
-const img = ref(null);
+const pixelated = ref(false)
+const img = ref(null)
 
 defineProps({
   src: {
@@ -47,13 +47,13 @@ defineProps({
   },
   alt: {
     type: String,
-    default: "",
+    default: '',
   },
   size: {
     type: String,
-    default: "sm",
+    default: 'sm',
     validator(value) {
-      return ["xxs", "xs", "sm", "md", "lg", "none"].includes(value);
+      return ['xxs', 'xs', 'sm', 'md', 'lg', 'none'].includes(value)
     },
   },
   circle: {
@@ -66,16 +66,16 @@ defineProps({
   },
   loading: {
     type: String,
-    default: "lazy",
+    default: 'lazy',
   },
   raised: {
     type: Boolean,
     default: false,
   },
-});
+})
 
 function updatePixelated() {
-  pixelated.value = Boolean(img.value && img.value.naturalWidth && img.value.naturalWidth <= 96);
+  pixelated.value = Boolean(img.value && img.value.naturalWidth && img.value.naturalWidth <= 96)
 }
 </script>
 

packages/ui/src/components/base/Button.vue

@@ -46,7 +46,7 @@ const props = defineProps({
 })
 
 const accentedButton = computed(() =>
-  ['danger', 'primary', 'red', 'orange', 'green', 'blue', 'purple', 'gray'].includes(props.color)
+  ['danger', 'primary', 'red', 'orange', 'green', 'blue', 'purple', 'gray'].includes(props.color),
 )
 </script>
 

packages/ui/src/components/base/Card.vue

@@ -13,7 +13,7 @@ const props = withDefaults(
     collapsible: false,
     defaultCollapsed: false,
     noAutoBody: false,
-  }
+  },
 )
 
 const state = reactive({

packages/ui/src/components/base/Checkbox.vue

@@ -46,7 +46,7 @@ const props = withDefaults(
     modelValue: false,
     clickEvent: () => {},
     collapsingToggleStyle: false,
-  }
+  },
 )
 
 function toggle() {
@@ -89,7 +89,9 @@ function toggle() {
   color: var(--color-contrast);
   background-color: var(--color-button-bg);
   border-radius: var(--radius-xs);
-  box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+  box-shadow:
+    var(--shadow-inset-sm),
+    0 0 0 0 transparent;
 
   &.checked {
     background-color: var(--color-brand);

packages/ui/src/components/base/Chips.vue

@@ -95,7 +95,9 @@ export default defineComponent({
   .selected {
     color: var(--color-contrast);
     background-color: var(--color-brand-highlight);
-    box-shadow: inset 0 0 0 transparent, 0 0 0 2px var(--color-brand);
+    box-shadow:
+      inset 0 0 0 transparent,
+      0 0 0 2px var(--color-brand);
   }
 }
 </style>

packages/ui/src/components/base/CopyCode.vue

@@ -39,7 +39,10 @@ async function copyText() {
   width: min-content;
   border-radius: 10px;
   user-select: text;
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, transform 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    transform 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   @media (prefers-reduced-motion) {

packages/ui/src/components/base/DropArea.vue

@@ -21,7 +21,7 @@ const props = withDefaults(
   }>(),
   {
     accept: '*',
-  }
+  },
 )
 
 const emit = defineEmits(['change'])
@@ -77,7 +77,9 @@ onMounted(() => {
   z-index: 10;
   visibility: hidden;
   background-color: hsla(0, 0%, 0%, 0.5);
-  transition: visibility 0.2s ease-in-out, background-color 0.1s ease-in-out;
+  transition:
+    visibility 0.2s ease-in-out,
+    background-color 0.1s ease-in-out;
   display: flex;
   &::before {
     --indent: 4rem;

packages/ui/src/components/base/DropdownSelect.vue

@@ -125,7 +125,7 @@ watch(
   () => props.modelValue,
   (newValue) => {
     selectedValue.value = newValue
-  }
+  },
 )
 
 const toggleDropdown = () => {
@@ -212,7 +212,9 @@ const isChildOfDropdown = (element) => {
     cursor: pointer;
     user-select: none;
     border-radius: var(--radius-md);
-    box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+    box-shadow:
+      var(--shadow-inset-sm),
+      0 0 0 0 transparent;
 
     transition: 0.05s;
 
@@ -253,7 +255,9 @@ const isChildOfDropdown = (element) => {
     z-index: 10;
     max-height: 18.75rem;
     overflow-y: auto;
-    box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+    box-shadow:
+      var(--shadow-inset-sm),
+      0 0 0 0 transparent;
 
     .option {
       background-color: var(--color-button-bg);

packages/ui/src/components/base/Notifications.vue

@@ -28,7 +28,7 @@ defineExpose({
       (x) =>
         x.text === notification.text &&
         x.title === notification.title &&
-        x.type === notification.type
+        x.type === notification.type,
     )
     if (existingNotif) {
       setNotificationTimer(existingNotif)

packages/ui/src/components/base/OverflowMenu.vue

@@ -47,8 +47,8 @@
 
 <script setup>
 import { ref } from 'vue'
-import Button from "./Button.vue"
-import PopoutMenu from "./PopoutMenu.vue"
+import Button from './Button.vue'
+import PopoutMenu from './PopoutMenu.vue'
 
 defineProps({
   options: {

packages/ui/src/components/base/Pagination.vue

@@ -67,7 +67,7 @@ const props = withDefaults(
     page: 1,
     count: 1,
     linkFunction: (page: number) => void page,
-  }
+  },
 )
 
 const pages = computed(() => {
@@ -116,7 +116,10 @@ a {
   background: var(--color-raised-bg);
   cursor: pointer;
 
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, transform 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    transform 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   @media (prefers-reduced-motion) {

packages/ui/src/components/base/PopoutMenu.vue

@@ -102,8 +102,13 @@ onBeforeUnmount(() => {
     box-shadow: var(--shadow-floating);
     z-index: 10;
     opacity: 0;
-    transition: bottom 0.125s ease-in-out, top 0.125s ease-in-out, left 0.125s ease-in-out,
-      right 0.125s ease-in-out, opacity 0.125s ease-in-out, scale 0.125s ease-in-out;
+    transition:
+      bottom 0.125s ease-in-out,
+      top 0.125s ease-in-out,
+      left 0.125s ease-in-out,
+      right 0.125s ease-in-out,
+      opacity 0.125s ease-in-out,
+      scale 0.125s ease-in-out;
 
     @media (prefers-reduced-motion) {
       transition: none !important;

packages/ui/src/components/base/ProjectCard.vue

@@ -80,7 +80,6 @@ import EnvironmentIndicator from './EnvironmentIndicator.vue'
 </script>
 
 <script>
-
 dayjs.extend(relativeTime)
 export default defineComponent({
   props: {
@@ -200,7 +199,7 @@ export default defineComponent({
       const b = color & 0xff
       const g = (color & 0xff00) >>> 8
       const r = (color & 0xff0000) >>> 16
-      return `rgba(${  [r, g, b, 1].join(',')  })`
+      return `rgba(${[r, g, b, 1].join(',')})`
     },
     createdDate() {
       return dayjs(this.createdAt).format('MMMM D, YYYY [at] h:mm:ss A')
@@ -301,7 +300,9 @@ export default defineComponent({
     img,
     svg {
       border-radius: var(--radius-lg);
-      box-shadow: -2px -2px 0 2px var(--color-raised-bg), 2px -2px 0 2px var(--color-raised-bg);
+      box-shadow:
+        -2px -2px 0 2px var(--color-raised-bg),
+        2px -2px 0 2px var(--color-raised-bg);
     }
   }
 

packages/ui/src/components/base/Promotion.vue

@@ -35,7 +35,7 @@ const props = withDefaults(
   {
     external: true,
     queryParam: '',
-  }
+  },
 )
 
 const target = computed(() => (props.external ? '_blank' : '_self'))

packages/ui/src/components/chart/Chart.vue

@@ -6,7 +6,6 @@ import { defineAsyncComponent, ref } from 'vue'
 import Button from '../base/Button.vue'
 import Checkbox from '../base/Checkbox.vue'
 
-
 const VueApexCharts = defineAsyncComponent(() => import('vue3-apexcharts'))
 
 const props = defineProps({
@@ -138,23 +137,22 @@ const chartOptions = ref({
     },
   },
   tooltip: {
-    custom ({ series, seriesIndex, dataPointIndex, w }) {
+    custom({ series, seriesIndex, dataPointIndex, w }) {
       console.log(seriesIndex, w)
       return (
         `<div class="bar-tooltip">` +
         `<div class="seperated-entry title">` +
-        `<div class="label">${
-        props.formatLabels(w.globals.lastXAxis.categories[dataPointIndex])
-        }</div>${
-        !props.hideTotal
-          ? `<div class="value">
+        `<div class="label">${props.formatLabels(
+          w.globals.lastXAxis.categories[dataPointIndex],
+        )}</div>${
+          !props.hideTotal
+            ? `<div class="value">
         ${props.prefix}
         ${formatNumber(series.reduce((a, b) => a + b[dataPointIndex], 0).toString(), false)}
         ${props.suffix}
         </div>`
-          : ``
-        }</div><hr class="card-divider" />${
-        series
+            : ``
+        }</div><hr class="card-divider" />${series
           .map((value, index) =>
             value[dataPointIndex] > 0
               ? `<div class="list-entry">
@@ -168,11 +166,10 @@ const chartOptions = ref({
                   ${props.suffix}
                 </div>
               </div>`
-              : ''
+              : '',
           )
           .reverse()
-          .reduce((a, b) => a + b)
-        }</div>`
+          .reduce((a, b) => a + b)}</div>`
       )
     },
   },
@@ -183,7 +180,7 @@ const chart = ref(null)
 const legendValues = ref(
   [...props.data].map((project, index) => {
     return { name: project.name, visible: true, color: props.colors[index] }
-  })
+  }),
 )
 
 const flipLegend = (legend, newVal) => {
@@ -192,11 +189,9 @@ const flipLegend = (legend, newVal) => {
 }
 
 const downloadCSV = () => {
-  const csvContent =
-    `data:text/csv;charset=utf-8,${
-    props.labels.join(',')
-    }\n${
-    props.data.map((project) => project.data.join(',')).reduce((a, b) => `${a  }\n${  b}`)}`
+  const csvContent = `data:text/csv;charset=utf-8,${props.labels.join(',')}\n${props.data
+    .map((project) => project.data.join(','))
+    .reduce((a, b) => `${a}\n${b}`)}`
 
   const encodedUri = encodeURI(csvContent)
   const link = document.createElement('a')

packages/ui/src/components/chart/CompactChart.vue

@@ -109,7 +109,6 @@ const chartOptions = ref({
   },
   tooltip: {
     custom({ series, seriesIndex, dataPointIndex, w }) {
-       
       console.log(seriesIndex, w)
       return `<div class="bar-tooltip">${series
         .map((value) =>
@@ -128,7 +127,7 @@ const chartOptions = ref({
                   ${props.suffix}
                 </div>
               </div>`
-            : ''
+            : '',
         )
         .reverse()
         .reduce((a, b) => a + b)}</div>`

packages/ui/src/components/modal/ShareModal.vue

@@ -50,7 +50,7 @@ const share = () => {
       : {
           title: props.shareTitle.toString(),
           text: content.value,
-        }
+        },
   )
 }
 
@@ -87,19 +87,20 @@ const sendEmail = computed(
   () =>
     `mailto:user@test.com
     ?subject=${encodeURIComponent(props.shareTitle)}
-    &body=${  encodeURIComponent(content.value)}`
+    &body=${encodeURIComponent(content.value)}`,
 )
 
 const sendTweet = computed(
-  () => `https://twitter.com/intent/tweet?text=${  encodeURIComponent(content.value)}`
+  () => `https://twitter.com/intent/tweet?text=${encodeURIComponent(content.value)}`,
 )
 
-const sendToot = computed(() => `https://tootpick.org/#text=${  encodeURIComponent(content.value)}`)
+const sendToot = computed(() => `https://tootpick.org/#text=${encodeURIComponent(content.value)}`)
 
 const postOnReddit = computed(
   () =>
-    `https://www.reddit.com/submit?title=${encodeURIComponent(props.shareTitle)}&text=${ 
-    encodeURIComponent(content.value)}`
+    `https://www.reddit.com/submit?title=${encodeURIComponent(props.shareTitle)}&text=${encodeURIComponent(
+      content.value,
+    )}`,
 )
 
 defineExpose({

packages/ui/src/components/nav/NavRow.vue

@@ -81,7 +81,7 @@ export default {
     pickLink() {
       this.activeIndex = this.query
         ? this.filteredLinks.findIndex(
-            (x) => (x.href === '' ? undefined : x.href) === this.$route.path[this.query]
+            (x) => (x.href === '' ? undefined : x.href) === this.$route.path[this.query],
           )
         : this.filteredLinks.findIndex((x) => x.href === decodeURIComponent(this.$route.path))
 

packages/ui/src/components/search/SearchDropdown.vue

@@ -130,7 +130,7 @@ const selectOption = (option) => {
 const onFocus = () => {
   if (!props.disabled) {
     focusedOptionIndex.value = props.options.findIndex(
-      (option) => option === props.modelValue.value
+      (option) => option === props.modelValue.value,
     )
     dropdownVisible.value = true
   }
@@ -197,7 +197,9 @@ const isChildOfDropdown = (element) => {
     cursor: pointer;
     user-select: none;
     border-radius: var(--radius-md);
-    box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+    box-shadow:
+      var(--shadow-inset-sm),
+      0 0 0 0 transparent;
 
     &.disabled {
       cursor: not-allowed;
@@ -315,7 +317,9 @@ const isChildOfDropdown = (element) => {
 }
 
 .text-input {
-  box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent !important;
+  box-shadow:
+    var(--shadow-inset-sm),
+    0 0 0 0 transparent !important;
   width: 100%;
 
   transition: 0.05s;

packages/ui/src/vue-shims.d.ts

@@ -1,6 +1,6 @@
 declare module '*.vue' {
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
 
-  const component: ReturnType<typeof defineComponent>;
-  export default component;
+  const component: ReturnType<typeof defineComponent>
+  export default component
 }

packages/ui/tsconfig.json

@@ -1,5 +1,5 @@
 {
   "extends": "tsconfig/vue.json",
-  "include": ["."],
+  "include": [".", ".eslintrc.js"],
   "exclude": ["dist", "build", "node_modules"]
 }

packages/utils/.eslintrc.js

@@ -1,4 +1,7 @@
 module.exports = {
   root: true,
   extends: ['custom/library'],
+  env: {
+    node: true,
+  },
 }

packages/utils/codemirror.ts

@@ -1,3 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-nocheck
 
 import { insertNewlineAndIndent } from '@codemirror/commands'
@@ -20,7 +21,7 @@ const toggleStrikethrough: Command = ({ state, dispatch }) => {
 
 const toggleCodeBlock: Command = ({ state, dispatch }) => {
   const lineBreak = state.lineBreak
-  const codeBlockMark = `${lineBreak  }\`\`\`${  lineBreak}`
+  const codeBlockMark = `${lineBreak}\`\`\`${lineBreak}`
   return toggleAround(state, dispatch, codeBlockMark, codeBlockMark)
 }
 
@@ -87,7 +88,7 @@ type Dispatch = (tr: Transaction) => void
 const surroundedByText = (
   state: EditorState,
   open: string,
-  close: string
+  close: string,
 ): 'inclusive' | 'exclusive' | 'none' => {
   const { from, to } = state.selection.main
 
@@ -113,7 +114,7 @@ const toggleAround = (
   state: EditorState,
   dispatch: Dispatch,
   open: string,
-  close: string
+  close: string,
 ): boolean => {
   const { from, to } = state.selection.main
 
@@ -258,7 +259,7 @@ const insertNewlineContinueMark: Command = (view): boolean => {
 
   const listMark = lastNode.getChild('ListMark')
   if (listMark) {
-    cancelPatterns.push(`${state.doc.sliceString(listMark.from, listMark.to)  } `)
+    cancelPatterns.push(`${state.doc.sliceString(listMark.from, listMark.to)} `)
   }
 
   // Skip if current line matches any of the cancel patterns
@@ -340,7 +341,7 @@ const incrementMark = (mark: string): string => {
   const match = numberedListRegex.exec(mark)
   if (match) {
     const number = parseInt(match[1])
-    return `${(number + 1).toString()  }.`
+    return `${(number + 1).toString()}.`
   }
   return mark
 }

packages/utils/highlight.ts

@@ -50,7 +50,7 @@ hljs.registerAliases(['html', 'htm', 'xhtml', 'mcui', 'fxml'], { languageName: '
 export const renderHighlightedString = (string) =>
   configuredXss.process(
     md({
-      highlight (str, lang) {
+      highlight(str, lang) {
         if (lang && hljs.getLanguage(lang)) {
           try {
             return hljs.highlight(str, { language: lang }).value
@@ -61,5 +61,5 @@ export const renderHighlightedString = (string) =>
 
         return ''
       },
-    }).render(string)
+    }).render(string),
   )

packages/utils/package.json

@@ -5,9 +5,11 @@
   "main": "./index.ts",
   "types": "./index.ts",
   "scripts": {
-    "lint": "eslint *.*"
+    "lint": "eslint . && prettier --check .",
+    "fix": "eslint . --fix && prettier --write ."
   },
   "devDependencies": {
+    "eslint": "^8.57.0",
     "eslint-config-custom": "workspace:*",
     "tsconfig": "workspace:*"
   },

packages/utils/parse.ts

@@ -50,7 +50,7 @@ export const configuredXss = new xss.FilterXSS({
           for (const remove of source.remove) {
             value = value.replace(remove, '')
           }
-          return `${name  }="${  xss.escapeAttrValue(value)  }"`
+          return `${name}="${xss.escapeAttrValue(value)}"`
         }
       }
     }
@@ -63,7 +63,7 @@ export const configuredXss = new xss.FilterXSS({
           allowedClasses.push(className)
         }
       }
-      return `${name  }="${  xss.escapeAttrValue(allowedClasses.join(' '))  }"`
+      return `${name}="${xss.escapeAttrValue(allowedClasses.join(' '))}"`
     }
   },
   safeAttrValue(tag, name, value, cssFilter) {
@@ -96,13 +96,12 @@ export const configuredXss = new xss.FilterXSS({
             tag,
             name,
             `https://wsrv.nl/?url=${encodeURIComponent(
-              url.toString().replaceAll('&', '&')
+              url.toString().replaceAll('&', '&'),
             )}&n=-1`,
-            cssFilter
+            cssFilter,
           )
-        } 
-          return xss.safeAttrValue(tag, name, url.toString(), cssFilter)
-        
+        }
+        return xss.safeAttrValue(tag, name, url.toString(), cssFilter)
       } catch (err) {
         /* empty */
       }

packages/utils/projects.ts

@@ -50,12 +50,10 @@ export const getProjectTypeForUrl = (type, loaders, tags) => {
       return 'plugin'
     } else if (isMod) {
       return 'mod'
-    } 
-      return 'mod'
-    
-  } 
-    return type
-  
+    }
+    return 'mod'
+  }
+  return type
 }
 
 export const getProjectLink = (project) => {
@@ -66,10 +64,9 @@ export const getProjectLink = (project) => {
 
 export const getVersionLink = (project, version) => {
   if (version) {
-    return `${getProjectLink(project)  }/version/${  version.id}`
-  } 
-    return getProjectLink(project)
-  
+    return `${getProjectLink(project)}/version/${version.id}`
+  }
+  return getProjectLink(project)
 }
 
 export const isApproved = (project) => {

packages/utils/tsconfig.json

@@ -1,6 +1,6 @@
 {
   "extends": "tsconfig/base.json",
-  "include": ["."],
+  "include": [".", ".eslintrc.js"],
   "exclude": ["dist", "build", "node_modules"],
   "compilerOptions": {
     "lib": ["esnext", "dom"],

packages/utils/utils.ts

@@ -1,4 +1,5 @@
 // noinspection JSUnusedGlobalSymbols
+// eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-nocheck
 
 import dayjs from 'dayjs'