Back to biome

Author: matthiask

.pre-commit-config.yaml

@@ -22,7 +22,14 @@ repos:
     rev: "v0.6.4"
     hooks:
       - id: ruff
+        args: [--unsafe-fixes]
       - id: ruff-format
+  - repo: https://github.com/biomejs/pre-commit
+    rev: "v0.4.0"
+    hooks:
+      - id: biome-check
+        additional_dependencies: ["@biomejs/[email protected]"]
+        args: [--unsafe]
   - repo: https://github.com/tox-dev/pyproject-fmt
     rev: 2.2.3
     hooks:
@@ -31,18 +38,3 @@ repos:
     rev: v0.19
     hooks:
       - id: validate-pyproject
-  - repo: local
-    hooks:
-      - id: prettier
-        name: prettier
-        entry: npx [email protected] --no-semi --write
-        language: system
-        types_or: [css, scss]
-        require_serial: true
-      - id: eslint
-        name: eslint
-        entry: yarn eslint
-        language: system
-        types_or: [javascript]
-        require_serial: true
-        verbose: true

biome.json

@@ -0,0 +1,57 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.8.3/schema.json",
+  "organizeImports": {
+    "enabled": false
+  },
+  "formatter": {
+    "enabled": true,
+    "indentStyle": "space",
+    "indentWidth": 2
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true,
+      "a11y": {
+        "noSvgWithoutTitle": "off"
+      },
+      "correctness": {
+        "noUndeclaredVariables": "error",
+        "noUnusedImports": "error",
+        "noUnusedVariables": "error",
+        "useArrayLiterals": "error",
+        "useHookAtTopLevel": "error"
+      },
+      "security": {
+        "noDangerouslySetInnerHtml": "warn"
+      },
+      "style": {
+        "noParameterAssign": "off",
+        "useForOf": "warn"
+      },
+      "suspicious": {
+        "noArrayIndexKey": "warn",
+        "noAssignInExpressions": "off"
+      }
+    }
+  },
+  "javascript": {
+    "formatter": {
+      "semicolons": "asNeeded"
+    },
+    "globals": ["django", "CKEDITOR"]
+  },
+  "css": {
+    "formatter": {
+      "enabled": true
+    },
+    "linter": {
+      "enabled": true
+    }
+  },
+  "json": {
+    "formatter": {
+      "enabled": false
+    }
+  }
+}

eslint.config.mjs

@@ -5,41 +5,37 @@
       point.style.top = `${img.clientHeight * y}px`
     }
 
-    Array.prototype.slice
-      .call(document.querySelectorAll(".imagefield[data-ppoi-id]"))
-      .forEach((field) => {
-        if (!field.dataset.ppoiId) return
-        const ppoiField = document.querySelector(`#${field.dataset.ppoiId}`)
-        if (!ppoiField) return
+    for (const field of document.querySelectorAll(
+      ".imagefield[data-ppoi-id]",
+    )) {
+      if (!field.dataset.ppoiId) return
+      const ppoiField = document.querySelector(`#${field.dataset.ppoiId}`)
+      if (!ppoiField) return
 
-        const point = document.createElement("div")
-        const img = field.querySelector("img")
-        point.className = "imagefield-point opaque"
-        img.parentNode.appendChild(point)
+      const point = document.createElement("div")
+      const img = field.querySelector("img")
+      point.className = "imagefield-point opaque"
+      img.parentNode.appendChild(point)
 
-        setTimeout(() => {
-          point.className = "imagefield-point"
-        }, 1000)
+      setTimeout(() => {
+        point.className = "imagefield-point"
+      }, 1000)
 
-        const matches = ppoiField.value.match(/^([.0-9]+)x([.0-9]+)$/)
-        if (matches) {
-          movePoint(
-            point,
-            img,
-            Number.parseFloat(matches[1]),
-            Number.parseFloat(matches[2]),
-          )
-        } else {
-          movePoint(point, img, 0.5, 0.5)
-        }
-      })
+      const matches = ppoiField.value.match(/^([.0-9]+)x([.0-9]+)$/)
+      if (matches) {
+        movePoint(
+          point,
+          img,
+          Number.parseFloat(matches[1]),
+          Number.parseFloat(matches[2]),
+        )
+      } else {
+        movePoint(point, img, 0.5, 0.5)
+      }
+    }
 
     document.body.addEventListener("click", (e) => {
-      if (
-        e.target &&
-        e.target.matches &&
-        e.target.matches("img.imagefield-preview-image")
-      ) {
+      if (e.target?.matches?.("img.imagefield-preview-image")) {
         const field = e.target.closest(".imagefield[data-ppoi-id]")
         if (!field.dataset.ppoiId) return
         const ppoiField = document.querySelector(`#${field.dataset.ppoiId}`)