webapp - ESLint + Prettier with pre-commit hooks (#54)

resolves #47

Co-authored-by: johba <johba@harb.eth>
Reviewed-on: https://codeberg.org/johba/harb/pulls/54

web-app/eslint.config.js

@@ -0,0 +1,95 @@
+import { dirname, resolve } from 'node:path';
+import { fileURLToPath } from 'node:url';
+import pluginVue from 'eslint-plugin-vue';
+import vueTsEslintConfig from '@vue/eslint-config-typescript';
+import tsParser from '@typescript-eslint/parser';
+import stylistic from '@stylistic/eslint-plugin';
+import prettier from 'eslint-config-prettier';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = dirname(__filename);
+
+export default [
+  {
+    name: 'app/files-to-lint',
+    files: ['**/*.{ts,mts,tsx,vue}'],
+    languageOptions: {
+      parser: tsParser,
+      parserOptions: {
+        projectService: true,
+        project: [resolve(__dirname, 'tsconfig.app.json')],
+        tsconfigRootDir: __dirname,
+        sourceType: 'module',
+        ecmaVersion: 'latest',
+        allowDefaultProject: true,
+      },
+    },
+    plugins: {
+      '@stylistic': stylistic,
+    },
+  },
+
+  {
+    name: 'app/files-to-ignore',
+    ignores: ['**/dist/**', '**/dist-ssr/**', '**/coverage/**', '**/node_modules/**', '**/.ponder/**', '**/__tests__/**'],
+  },
+
+  ...pluginVue.configs['flat/essential'],
+  ...vueTsEslintConfig(),
+
+  {
+    name: 'app/custom-rules',
+    rules: {
+      // TypeScript rules
+      '@typescript-eslint/no-explicit-any': 'error',
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          argsIgnorePattern: '^_',
+          varsIgnorePattern: '^_',
+          caughtErrorsIgnorePattern: '^_',
+        },
+      ],
+
+      // General code quality
+      'no-console': 'error',
+      '@stylistic/indent': ['error', 2, { SwitchCase: 1 }],
+      'max-len': ['error', { code: 140 }],
+
+      // Vue specific rules
+      'vue/multi-word-component-names': 'error',
+      'vue/component-name-in-template-casing': ['error', 'PascalCase'],
+      'vue/require-prop-types': 'error',
+      'vue/require-default-prop': 'error',
+      'vue/html-indent': ['error', 2],
+      'vue/no-unused-vars': 'error',
+
+      // Disable rules that conflict with Prettier
+      'vue/max-attributes-per-line': 'off',
+      'vue/singleline-html-element-content-newline': 'off',
+      'vue/html-self-closing': 'off',
+
+      // Naming conventions
+      camelcase: ['error', { properties: 'never', ignoreDestructuring: true, allow: ['^UNSAFE_'] }],
+
+      // Complexity rules (disabled as per requirements)
+      complexity: 'off',
+      'max-depth': 'off',
+      'max-lines': 'off',
+      'max-params': 'off',
+    },
+  },
+
+  {
+    name: 'app/tests-override',
+    files: ['src/**/__tests__/**/*.ts', 'src/**/__tests__/**/*.tsx'],
+    languageOptions: {
+      parserOptions: {
+        projectService: false,
+        project: undefined,
+      },
+    },
+  },
+
+  prettier,
+];