Add eslint (#541)

browser-extensions/chrome/eslint.config.js

@@ -0,0 +1,55 @@
+import js from "@eslint/js";
+import tsParser from "@typescript-eslint/parser";
+import tsPlugin from "@typescript-eslint/eslint-plugin";
+import reactPlugin from "eslint-plugin-react";
+import reactHooksPlugin from "eslint-plugin-react-hooks";
+import importPlugin from "eslint-plugin-import";
+import globals from 'globals';
+
+export default [
+    {
+        ignores: [
+            "dist/**",
+            "node_modules/**",
+        ]
+    },
+    js.configs.recommended,
+    {
+        files: ["src/**/*.{ts,tsx}"],
+        languageOptions: {
+            parser: tsParser,
+            parserOptions: {
+                ecmaFeatures: { jsx: true },
+                ecmaVersion: "latest",
+                sourceType: "module",
+            },
+        },
+        plugins: {
+            "@typescript-eslint": tsPlugin,
+            "react": reactPlugin,
+            "react-hooks": reactHooksPlugin,
+            "import": importPlugin,
+        },
+        rules: {
+            ...tsPlugin.configs.recommended.rules,
+            ...reactPlugin.configs.recommended.rules,
+            ...reactHooksPlugin.configs.recommended.rules,
+            "react/react-in-jsx-scope": "off",
+            "@typescript-eslint/explicit-module-boundary-types": "off",
+        },
+        settings: {
+            react: {
+                version: "detect",
+            },
+        },
+    },
+    {
+        languageOptions: {
+            globals: {
+                ...globals.node,
+                ...globals.browser,
+                chrome: 'readonly',
+            }
+        }
+    }
+];

browser-extensions/chrome/package.json

@@ -2,11 +2,14 @@
   "name": "chrome",
   "version": "1.0.0",
   "main": "index.tsx",
+  "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vite build && npm run build:content-css",
     "preview": "vite preview",
-    "watch": "vite build --watch",
+    "lint": "eslint src",
+    "lint:fix": "eslint src --fix",
+    "build": "npm run lint && vite build && npm run build:content-css",
+    "watch": "concurrently \"npm run lint -- --watch\" \"vite\"",
     "build:content-css": "tailwindcss -i ./src/styles/contentScript.css -o ./dist/contentScript.css --config tailwind.content.config.js"
   },
   "keywords": [],
@@ -16,6 +19,7 @@
   "dependencies": {
     "argon2-browser": "^1.18.0",
     "buffer": "^6.0.3",
+    "globals": "^15.14.0",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "secure-remote-password": "github:LinusU/secure-remote-password#73e5f732b6ca0cdbdc19da1a0c5f48cdbad2cbf0",
@@ -25,8 +29,15 @@
     "@types/react": "^19.0.7",
     "@types/react-dom": "^19.0.3",
     "@types/sql.js": "^1.4.9",
+    "@typescript-eslint/eslint-plugin": "^8.21.0",
+    "@typescript-eslint/parser": "^8.21.0",
     "@vitejs/plugin-react": "^4.3.4",
     "autoprefixer": "^10.4.20",
+    "concurrently": "^9.1.2",
+    "eslint": "^9.19.0",
+    "eslint-plugin-import": "^2.31.0",
+    "eslint-plugin-react": "^7.37.4",
+    "eslint-plugin-react-hooks": "^5.1.0",
     "postcss": "^8.5.1",
     "tailwindcss": "^3.4.17",
     "typescript": "^5.7.3",

browser-extensions/chrome/src/App.tsx

@@ -1,3 +1,4 @@
+/// <reference lib="dom" />
 import React, { useState, useEffect } from 'react';
 import { useAuth } from './context/AuthContext';
 import { useDb } from './context/DbContext';

browser-extensions/chrome/tsconfig.json

@@ -7,7 +7,8 @@
     "esModuleInterop": true,
     "moduleResolution": "Node",
     "skipLibCheck": true,
-    "forceConsistentCasingInFileNames": true
+    "forceConsistentCasingInFileNames": true,
+    "lib": ["dom", "dom.iterable", "esnext"]
   },
   "include": ["src/**/*"],
   "exclude": ["node_modules"]