chore(config): upgrade eslint, ci, and vscode tasks to match backend template

.github/workflows/ci.yml

@@ -5,22 +5,57 @@ on:
     branches: [main, dev]
 
 jobs:
+  # ── 1. Tests ──────────────────────────────────────────────────────────────
   test:
     name: Tests
     runs-on: ubuntu-latest
-
     steps:
-      - name: Checkout code
-        uses: actions/checkout@v4
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - run: npm ci
+      - run: npm run test:run
 
-      - name: Setup Node.js
-        uses: actions/setup-node@v4
+  # ── 2. Lint ───────────────────────────────────────────────────────────────
+  lint:
+    name: Lint
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
         with:
           node-version: 20
           cache: 'npm'
+      - run: npm ci
+      - run: npm run lint
 
-      - name: Install dependencies
-        run: npm ci
+  # ── 3. Format ─────────────────────────────────────────────────────────────
+  format-check:
+    name: Format Check
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - run: npm ci
+      - run: npm run format:check
 
-      - name: Run tests
-        run: npm run test:run
+  # ── 4. Build ──────────────────────────────────────────────────────────────
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v4
+      - uses: actions/setup-node@v4
+        with:
+          node-version: 20
+          cache: 'npm'
+      - run: npm ci
+      - run: npm run build
+        env:
+          VITE_SUPABASE_URL: https://placeholder.supabase.co
+          VITE_SUPABASE_ANON_KEY: placeholder-anon-key

.vscode/tasks.json

@@ -90,6 +90,30 @@
         "reveal": "always",
         "panel": "shared"
       }
+    },
+    {
+      "label": "🎨 Format: Check",
+      "type": "npm",
+      "script": "format:check",
+      "presentation": {
+        "reveal": "always",
+        "panel": "shared"
+      }
+    },
+
+    // ── CI Verify (mirrors all CI jobs locally) ────────────────
+    {
+      "label": "✅ CI: Verify All",
+      "dependsOn": [
+        "🧪 Tests (run once)",
+        "🔍 Lint",
+        "🎨 Format: Check",
+        "🏗️ Build"
+      ],
+      "dependsOrder": "parallel",
+      "presentation": {
+        "reveal": "silent"
+      }
     }
   ]
 }

eslint.config.js

@@ -1,8 +1,8 @@
 import js from '@eslint/js';
-import globals from 'globals';
 import reactHooks from 'eslint-plugin-react-hooks';
 import reactRefresh from 'eslint-plugin-react-refresh';
 import { defineConfig, globalIgnores } from 'eslint/config';
+import globals from 'globals';
 
 /**
  * ESLint configuration for the React client.
@@ -41,8 +41,40 @@ export default defineConfig([
 
     // Define project-specific overrides
     rules: {
-      // Allow unused vars if they follow specific naming (e.g., StyledComponents or ENV_VARS)
-      'no-unused-vars': ['error', { varsIgnorePattern: '^[A-Z_]' }],
+      // Allow unused vars if they follow specific naming conventions:
+      // - Uppercase names (e.g. StyledComponents or ENV_VARS)
+      // - Underscore-prefixed caught errors (e.g. catch (_err))
+      'no-unused-vars': [
+        'error',
+        {
+          varsIgnorePattern: '^[A-Z_]',
+          argsIgnorePattern: '^_',
+          caughtErrors: 'all',
+          caughtErrorsIgnorePattern: '^_',
+        },
+      ],
+
+      // Provider files intentionally export both a component and its matching
+      // hook from the same module.
+      'react-refresh/only-export-components': [
+        'warn',
+        {
+          allowConstantExport: true,
+          allowExportNames: ['useAuth', 'useTheme', 'useToast'],
+        },
+      ],
+
+      // SearchBar syncs local input state from URL params inside a useEffect.
+      // This is the correct pattern for controlled inputs driven by external
+      // state (the URL) — setting state directly in the effect body is
+      // intentional here, not a cascading render bug.
+      'react-hooks/set-state-in-effect': 'off',
+    },
+  },
+  {
+    files: ['src/modules/utils/testing/**/*.{js,jsx}'],
+    rules: {
+      'react-refresh/only-export-components': 'off',
     },
   },
 ]);

prompts/workflow/1-implement.md

@@ -1,14 +1,15 @@
 # input:
 
-
 ---
 
 # process:
+
 follow issue instructions to make changes
 tell me what to do (e.g. run scripts in terminal) and/or show you (e.g. files, console logs) to verify if output passes issue's acceptance criteria
 
 ---
 
 # output:
+
 actual changes to the files mentioned (no need to print it out)
 numbered list of tasks to do to verify if we pass issue's acceptance criteria