setup biome for frontend

.github/workflows/lint.yaml

@@ -45,11 +45,8 @@ jobs:
       - name: Install deps
         run: pnpm install --frozen-lockfile
 
-      - name: Run Eslint and Prettier Lint
+      - name: Run Biome and Prettier Lint
         run: pnpm lint
 
-      - name: Check TSC
-        run: pnpm tsc
-
       - name: Audit
         run: pnpm audit --prod

biome.json

@@ -0,0 +1,103 @@
+{
+  "$schema": "https://biomejs.dev/schemas/2.1.2/schema.json",
+  "vcs": {
+    "enabled": false,
+    "clientKind": "git",
+    "useIgnoreFile": false
+  },
+  "files": {
+    "ignoreUnknown": false,
+    "includes": [
+      "src/**",
+      "!src/i18n/*.ts",
+      "!src/i18n/*.tsx",
+      "!src/i18n/i18n-util",
+      "!dist/**"
+    ]
+  },
+  "formatter": {
+    "enabled": true,
+    "formatWithErrors": false,
+    "indentStyle": "space",
+    "indentWidth": 2,
+    "lineEnding": "lf",
+    "lineWidth": 90,
+    "attributePosition": "auto",
+    "bracketSameLine": false,
+    "bracketSpacing": true,
+    "expand": "auto",
+    "useEditorconfig": true,
+    "includes": ["./src/**"]
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true,
+      "a11y": "off",
+      "complexity": {
+        "noBannedTypes": "error",
+        "noUselessTypeConstraint": "error"
+      },
+      "correctness": {
+        "noChildrenProp": "error",
+        "noPrecisionLoss": "error",
+        "noUnusedVariables": "error",
+        "useExhaustiveDependencies": "error",
+        "useHookAtTopLevel": "error",
+        "useJsxKeyInIterable": "error"
+      },
+      "security": {
+        "noDangerouslySetInnerHtmlWithChildren": "error"
+      },
+      "style": {
+        "noNamespace": "error",
+        "noNonNullAssertion": "error",
+        "useArrayLiterals": "error",
+        "useAsConstAssertion": "error",
+        "useBlockStatements": "off",
+        "useLiteralEnumMembers": "off"
+      },
+      "suspicious": {
+        "noCommentText": "error",
+        "noDuplicateJsxProps": "error",
+        "noExplicitAny": "error",
+        "noExtraNonNullAssertion": "error",
+        "noMisleadingInstantiator": "error",
+        "noUnsafeDeclarationMerging": "error",
+        "noArrayIndexKey": "off"
+      }
+    },
+    "includes": ["src/**"]
+  },
+  "javascript": {
+    "formatter": {
+      "jsxQuoteStyle": "double",
+      "quoteProperties": "asNeeded",
+      "trailingCommas": "all",
+      "semicolons": "always",
+      "arrowParentheses": "always",
+      "bracketSameLine": false,
+      "quoteStyle": "single",
+      "attributePosition": "auto",
+      "bracketSpacing": true
+    }
+  },
+  "html": {
+    "formatter": {
+      "selfCloseVoidElements": "always"
+    }
+  },
+  "overrides": [
+    {
+      "includes": ["**/*.js"]
+    }
+  ],
+  "assist": {
+    "enabled": true,
+    "actions": {
+      "source": {
+        "organizeImports": "on"
+      }
+    }
+  }
+}

package.json

@@ -5,20 +5,22 @@
   "type": "module",
   "scripts": {
     "dev": "npm-run-all --parallel vite typesafe-i18n",
-    "build": "tsc && vite build",
+    "typecheck": "tsc --project ./tsconfig.node.json",
+    "build": "pnpm run typecheck && vite build",
     "preview": "vite preview",
     "typesafe-i18n": "typesafe-i18n",
     "generate-translation-types": "typesafe-i18n --no-watch",
-    "lint": "eslint --config ./.eslintrc.cjs src && prettier --check src/**/*.{ts,tsx,scss} && tsc",
-    "fix": "prettier --end-of-line lf -w src/**/*.{ts,tsx,scss} && eslint --fix --config ./.eslintrc.cjs src",
+    "fix": "biome check --fix && prettier src/**/*.scss -w --log-level silent",
+    "lint": "biome lint && pnpm run typecheck && prettier src/**/*.scss --check --log-level error",
+    "lint-ci": "biome ci && pnpm run typecheck && prettier src/**/*.scss --check --log-level error",
     "vite": "vite",
-    "eslint": "eslint",
     "prettier": "prettier",
     "parse-client-svgs": "svgr --no-index --jsx-runtime automatic --svgo-config ./svgo.config.json --prettier-config ./.prettierrc --out-dir ./src/shared/components/svg/ --typescript ./src/shared/images/svg/",
     "parse-ui-svgs": "svgr --no-index --jsx-runtime automatic --svgo-config ./svgo.config.json --prettier-config ./.prettierrc --out-dir ./src/shared/defguard-ui/components/svg/ --typescript ./src/shared/defguard-ui/images/svg/",
     "parse-svgs": "pnpm parse-ui-svgs && pnpm parse-client-svgs",
     "svgr": "svgr",
-    "tauri": "tauri"
+    "tauri": "tauri",
+    "biome": "biome"
   },
   "browserslist": {
     "production": [
@@ -37,20 +39,24 @@
       "ignoreMissing": [
         "react-native"
       ]
-    }
+    },
+    "onlyBuiltDependencies": [
+      "@swc/core",
+      "esbuild"
+    ]
   },
   "dependencies": {
-    "@floating-ui/react": "^0.26.28",
-    "@hookform/resolvers": "^3.10.0",
+    "@floating-ui/react": "^0.27.13",
+    "@hookform/resolvers": "^5.1.1",
     "@react-hook/resize-observer": "^2.0.2",
-    "@stablelib/base64": "^1.0.1",
-    "@stablelib/x25519": "^1.0.3",
-    "@tanstack/query-core": "^5.76.0",
-    "@tanstack/react-virtual": "3.0.0-beta.54",
+    "@stablelib/base64": "^2.0.1",
+    "@stablelib/x25519": "^2.0.1",
+    "@tanstack/query-core": "^5.83.0",
+    "@tanstack/react-virtual": "3.13.12",
     "@tauri-apps/api": "^1.6.0",
     "@types/byte-size": "^8.1.2",
     "@use-gesture/react": "^10.3.1",
-    "byte-size": "^8.2.1",
+    "byte-size": "^9.0.1",
     "classnames": "^2.5.1",
     "clsx": "^2.1.1",
     "compare-versions": "^6.1.1",
@@ -59,68 +65,58 @@
     "detect-browser": "^5.3.0",
     "fast-deep-equal": "^3.1.3",
     "file-saver": "^2.0.5",
-    "framer-motion": "^10.18.0",
+    "framer-motion": "^12.23.9",
     "get-text-width": "^1.0.3",
-    "html-react-parser": "^5.2.5",
+    "html-react-parser": "^5.2.6",
     "itertools": "^2.4.1",
     "lodash-es": "^4.17.21",
-    "merge-refs": "^1.3.0",
+    "merge-refs": "^2.0.0",
     "millify": "^6.1.0",
     "p-timeout": "^6.1.4",
     "prop-types": "^15.8.1",
-    "radash": "^11.0.0",
+    "radash": "^12.1.1",
     "react": "^18.3.1",
     "react-auth-code-input": "^3.2.1",
     "react-click-away-listener": "^2.4.0",
     "react-dom": "^18.3.1",
-    "react-hook-form": "^7.56.4",
+    "react-hook-form": "^7.61.0",
     "react-loading-skeleton": "^3.5.0",
-    "react-markdown": "^9.1.0",
-    "react-qr-code": "^2.0.15",
-    "react-router-dom": "^6.30.0",
+    "react-markdown": "^10.1.0",
+    "react-qr-code": "^2.0.18",
+    "react-router-dom": "^6.30.1",
     "react-virtualized-auto-sizer": "^1.0.26",
-    "recharts": "^2.15.3",
+    "recharts": "^3.1.0",
     "rehype-sanitize": "^6.0.0",
     "rxjs": "^7.8.2",
     "tauri-plugin-log-api": "github:tauri-apps/tauri-plugin-log",
     "tauri-plugin-window-state-api": "github:tauri-apps/tauri-plugin-window-state#v1",
     "use-breakpoint": "^4.0.6",
-    "zod": "^3.24.4",
-    "zustand": "^5.0.4"
+    "zod": "^4.0.8",
+    "zustand": "^5.0.6"
   },
   "devDependencies": {
+    "@biomejs/biome": "2.1.2",
     "@hookform/devtools": "^4.4.0",
     "@svgr/cli": "^8.1.0",
-    "@tanstack/react-query": "^5.76.1",
-    "@tanstack/react-query-devtools": "^5.76.1",
+    "@tanstack/react-query": "^5.83.0",
+    "@tanstack/react-query-devtools": "^5.83.0",
     "@tauri-apps/cli": "^1.6.3",
     "@types/file-saver": "^2.0.7",
     "@types/lodash-es": "^4.17.12",
-    "@types/node": "^20.17.48",
-    "@types/react": "^18.3.21",
+    "@types/node": "^24.1.0",
+    "@types/react": "^18.3.23",
     "@types/react-dom": "^18.3.7",
-    "@typescript-eslint/eslint-plugin": "^6.21.0",
-    "@typescript-eslint/parser": "^6.21.0",
-    "@vitejs/plugin-react": "^4.4.1",
-    "@vitejs/plugin-react-swc": "^3.9.0",
+    "@vitejs/plugin-react": "^4.7.0",
+    "@vitejs/plugin-react-swc": "^3.11.0",
     "autoprefixer": "^10.4.21",
-    "eslint": "^8.57.1",
-    "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-import": "^2.31.0",
-    "eslint-plugin-prettier": "^5.4.0",
-    "eslint-plugin-react": "^7.37.5",
-    "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-plugin-react-refresh": "^0.4.20",
-    "eslint-plugin-simple-import-sort": "^10.0.0",
     "npm-run-all": "^4.1.5",
-    "postcss": "^8.5.3",
-    "prettier": "^3.5.3",
+    "postcss": "^8.5.6",
+    "prettier": "^3.6.2",
     "sass": "~1.70.0",
     "typedoc": "^0.25.13",
     "typesafe-i18n": "^5.26.2",
     "typescript": "^5.8.3",
-    "typescript-eslint-language-service": "^5.0.5",
-    "vite": "^4.5.14"
+    "vite": "^7.0.6"
   },
   "volta": {
     "node": "20.5.1"