Refactor ESLint configuration and update test rules for clarity and consistency

- Consolidated and modularized `eslint.config.mjs` with defined rules for source, test, E2E, and scripts.
- Improved test and E2E rules with relaxed settings for flexibility and enhanced mocking.
- Standardized variable naming and removed redundant imports in unit and E2E tests.
- Updated error handling and comments to align with modern TypeScript best practices (e.g., `@ts-expect-error`).

frontend/e2e/admin-access.spec.ts

@@ -7,7 +7,6 @@ import { test, expect } from '@playwright/test';
 import {
   setupAuthenticatedMocks,
   setupSuperuserMocks,
-  loginViaUI,
 } from './helpers/auth';
 
 test.describe('Admin Access Control', () => {

frontend/e2e/admin-dashboard.spec.ts

@@ -4,7 +4,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupSuperuserMocks, loginViaUI } from './helpers/auth';
+import { setupSuperuserMocks } from './helpers/auth';
 
 test.describe('Admin Dashboard - Page Load', () => {
   test.beforeEach(async ({ page }) => {

frontend/e2e/admin-organization-members.spec.ts

@@ -5,7 +5,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupSuperuserMocks, loginViaUI } from './helpers/auth';
+import { setupSuperuserMocks } from './helpers/auth';
 
 test.describe('Admin Organization Members - Navigation from Organizations List', () => {
   test.beforeEach(async ({ page }) => {

frontend/e2e/admin-organizations.spec.ts

@@ -4,7 +4,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupSuperuserMocks, loginViaUI } from './helpers/auth';
+import { setupSuperuserMocks } from './helpers/auth';
 
 test.describe('Admin Organization Management - Page Load', () => {
   test.beforeEach(async ({ page }) => {

frontend/e2e/admin-users.spec.ts

@@ -4,7 +4,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupSuperuserMocks, loginViaUI } from './helpers/auth';
+import { setupSuperuserMocks } from './helpers/auth';
 
 test.describe('Admin User Management - Page Load', () => {
   test.beforeEach(async ({ page }) => {

frontend/e2e/auth.setup.ts

@@ -11,9 +11,9 @@
  * - Savings: ~690s (~11 minutes) per test run
  */
 
-import { test as setup, expect } from '@playwright/test';
+import { test as setup } from '@playwright/test';
 import path from 'path';
-import { setupAuthenticatedMocks, setupSuperuserMocks, loginViaUI } from './helpers/auth';
+import { setupAuthenticatedMocks, setupSuperuserMocks } from './helpers/auth';
 
 // Use absolute paths to ensure correct file location
 const ADMIN_STORAGE_STATE = path.join(__dirname, '.auth', 'admin.json');

frontend/e2e/helpers/coverage.ts

@@ -57,7 +57,7 @@ export async function startCoverage(
   try {
       await page.coverage.startJSCoverage({
       resetOnNavigation: options?.resetOnNavigation ?? false,
-      // @ts-ignore
+      // @ts-expect-error - includeRawScriptCoverage is not in official types but supported by Playwright
       includeRawScriptCoverage: options?.includeRawScriptCoverage ?? false,
     });
   } catch (error) {

frontend/e2e/homepage.spec.ts

@@ -214,7 +214,7 @@ test.describe('Homepage - Mobile Menu Interactions', () => {
 
   test.skip('should close mobile menu when clicking outside', async ({ page }) => {
     // Open mobile menu
-    const mobileMenu = await openMobileMenu(page);
+    const _mobileMenu = await openMobileMenu(page);
 
     // Press Escape key to close menu (more reliable than clicking overlay)
     await page.keyboard.press('Escape');

frontend/e2e/settings-navigation.spec.ts

@@ -4,7 +4,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupAuthenticatedMocks, loginViaUI } from './helpers/auth';
+import { setupAuthenticatedMocks } from './helpers/auth';
 
 test.describe('Settings Navigation', () => {
   test.beforeEach(async ({ page }) => {

frontend/e2e/settings-password.spec.ts

@@ -4,7 +4,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupAuthenticatedMocks, loginViaUI } from './helpers/auth';
+import { setupAuthenticatedMocks } from './helpers/auth';
 
 test.describe('Password Change', () => {
   test.beforeEach(async ({ page }) => {

frontend/e2e/settings-profile.spec.ts

@@ -4,7 +4,7 @@
  */
 
 import { test, expect } from '@playwright/test';
-import { setupAuthenticatedMocks, loginViaUI, MOCK_USER } from './helpers/auth';
+import { setupAuthenticatedMocks, MOCK_USER } from './helpers/auth';
 
 test.describe('Profile Settings', () => {
   test.beforeEach(async ({ page }) => {

frontend/eslint.config.mjs

@@ -9,7 +9,7 @@ const compat = new FlatCompat({
   baseDirectory: __dirname,
 });
 
-export default [
+const eslintConfig = [
   ...compat.extends('next/core-web-vitals'),
   ...compat.extends('next/typescript'),
   {
@@ -23,9 +23,12 @@ export default [
       'src/lib/api/generated/**',
       '*.gen.ts',
       '*.gen.tsx',
+      'next-env.d.ts', // Auto-generated by Next.js
     ],
   },
+  // Base rules for source code
   {
+    files: ['src/**/*.{ts,tsx}'],
     rules: {
       // Enforce Dependency Injection pattern for auth store
       // Components/hooks must use useAuth() from AuthContext, not useAuthStore directly
@@ -46,4 +49,56 @@ export default [
       ],
     },
   },
+  // Relaxed rules for test files
+  {
+    files: ['tests/**/*.{ts,tsx}', '**/*.test.{ts,tsx}', '**/*.spec.{ts,tsx}'],
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'off', // Test mocks often need any
+      '@typescript-eslint/no-require-imports': 'off', // Jest sometimes needs require
+      'react/display-name': 'off', // Mock components don't need display names
+      'no-restricted-imports': 'off', // Tests can import store directly
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          argsIgnorePattern: '^_',
+          varsIgnorePattern: '^_',
+          destructuredArrayIgnorePattern: '^_',
+        },
+      ],
+    },
+  },
+  // Relaxed rules for E2E tests
+  {
+    files: ['e2e/**/*.{ts,tsx}'],
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'off', // Playwright helpers need flexibility
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          argsIgnorePattern: '^_',
+          varsIgnorePattern: '^_',
+          destructuredArrayIgnorePattern: '^_',
+        },
+      ],
+    },
+  },
+  // Relaxed rules for scripts and config files
+  {
+    files: ['scripts/**/*.{ts,js}', '*.config.{ts,js,mjs}', 'jest.setup.js'],
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'off', // Build scripts need flexibility
+      '@typescript-eslint/no-require-imports': 'off', // CommonJS configs
+      '@next/next/no-assign-module-variable': 'off', // Scripts may need module.exports
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          argsIgnorePattern: '^_',
+          varsIgnorePattern: '^_',
+          destructuredArrayIgnorePattern: '^_',
+        },
+      ],
+    },
+  },
 ];
+
+export default eslintConfig;

frontend/scripts/convert-v8-to-istanbul.ts

@@ -83,7 +83,7 @@ async function convertV8ToIstanbul() {
     // Dynamic import to handle both scenarios (installed vs not installed)
     const module = await import('v8-to-istanbul');
     v8toIstanbul = module.default || module;
-  } catch (error) {
+  } catch {
     console.log('❌ v8-to-istanbul not installed\n');
     console.log('📦 Install it with:');
     console.log('   npm install -D v8-to-istanbul\n');

frontend/tests/app/(auth)/login/page.test.tsx

@@ -9,7 +9,7 @@ import LoginPage from '@/app/(auth)/login/page';
 // Mock dynamic import
 jest.mock('next/dynamic', () => ({
   __esModule: true,
-  default: (importFn: () => Promise<any>, options?: any) => {
+  default: (_importFn: () => Promise<any>, _options?: any) => {
     const Component = () => <div data-testid="login-form">Mocked LoginForm</div>;
     Component.displayName = 'LoginForm';
     return Component;

frontend/tests/app/(auth)/password-reset/confirm/PasswordResetConfirmContent.test.tsx

@@ -25,7 +25,7 @@ jest.mock('next/link', () => ({
 // Mock dynamic import
 jest.mock('next/dynamic', () => ({
   __esModule: true,
-  default: (importFn: () => Promise<any>, options?: any) => {
+  default: (_importFn: () => Promise<any>, _options?: any) => {
     const Component = ({ onSuccess }: { onSuccess?: () => void }) => (
       <div data-testid="password-reset-confirm-form">
         <button onClick={onSuccess}>Submit</button>

frontend/tests/app/(auth)/password-reset/page.test.tsx

@@ -9,7 +9,7 @@ import PasswordResetPage from '@/app/(auth)/password-reset/page';
 // Mock dynamic import
 jest.mock('next/dynamic', () => ({
   __esModule: true,
-  default: (importFn: () => Promise<any>, options?: any) => {
+  default: (_importFn: () => Promise<any>, _options?: any) => {
     const Component = () => <div data-testid="password-reset-form">Mocked PasswordResetRequestForm</div>;
     Component.displayName = 'PasswordResetRequestForm';
     return Component;

frontend/tests/app/(auth)/register/page.test.tsx

@@ -9,7 +9,7 @@ import RegisterPage from '@/app/(auth)/register/page';
 // Mock dynamic import
 jest.mock('next/dynamic', () => ({
   __esModule: true,
-  default: (importFn: () => Promise<any>, options?: any) => {
+  default: (_importFn: () => Promise<any>, _options?: any) => {
     const Component = () => <div data-testid="register-form">Mocked RegisterForm</div>;
     Component.displayName = 'RegisterForm';
     return Component;

frontend/tests/app/(authenticated)/settings/sessions/page.test.tsx

@@ -3,7 +3,7 @@
  * Smoke tests for page rendering
  */
 
-import { render, screen, waitFor } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import SessionsPage from '@/app/(authenticated)/settings/sessions/page';
 

frontend/tests/components/admin/users/UserActionMenu.test.tsx

@@ -510,8 +510,6 @@ describe('UserActionMenu', () => {
 
   describe('User Name Display', () => {
     it('displays full name when last name is provided', async () => {
-      const user = userEvent.setup();
-
       render(
         <UserActionMenu
           user={mockUser}
@@ -527,7 +525,6 @@ describe('UserActionMenu', () => {
     });
 
     it('displays first name only when last name is null', async () => {
-      const user = userEvent.setup();
       const userWithoutLastName = { ...mockUser, last_name: null };
 
       render(

frontend/tests/components/admin/users/UserFormDialog.test.tsx

@@ -52,9 +52,9 @@ describe('UserFormDialog', () => {
 
   describe('Module Exports', () => {
     it('exports UserFormDialog component', () => {
-      const module = require('@/components/admin/users/UserFormDialog');
+      const moduleExports = require('@/components/admin/users/UserFormDialog');
-      expect(module.UserFormDialog).toBeDefined();
+      expect(moduleExports.UserFormDialog).toBeDefined();
-      expect(typeof module.UserFormDialog).toBe('function');
+      expect(typeof moduleExports.UserFormDialog).toBe('function');
     });
 
     it('component is a valid React component', () => {

frontend/tests/components/layout/Skeletons.test.tsx

@@ -30,7 +30,7 @@ describe('HeaderSkeleton', () => {
   });
 
   it('has proper styling classes', () => {
-    const { container } = render(<HeaderSkeleton />);
+    render(<HeaderSkeleton />);
 
     // Verify backdrop blur and background
     const header = screen.getByRole('banner');
@@ -60,7 +60,7 @@ describe('AuthLoadingSkeleton', () => {
   });
 
   it('renders main content with container', () => {
-    const { container } = render(<AuthLoadingSkeleton />);
+    render(<AuthLoadingSkeleton />);
 
     const main = screen.getByRole('main');
     expect(main).toHaveClass('flex-1');
@@ -71,7 +71,7 @@ describe('AuthLoadingSkeleton', () => {
   });
 
   it('renders skeleton placeholders in main content', () => {
-    const { container } = render(<AuthLoadingSkeleton />);
+    render(<AuthLoadingSkeleton />);
 
     const main = screen.getByRole('main');
 

frontend/tests/components/settings/PasswordChangeForm.test.tsx

@@ -2,7 +2,7 @@
  * Tests for PasswordChangeForm Component
  */
 
-import { render, screen, waitFor } from '@testing-library/react';
+import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import { PasswordChangeForm } from '@/components/settings/PasswordChangeForm';

frontend/tests/components/theme/ThemeToggle.test.tsx

@@ -6,7 +6,7 @@
 import { render, screen, waitFor } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 import { ThemeToggle } from '@/components/theme/ThemeToggle';
-import { ThemeProvider, useTheme } from '@/components/theme/ThemeProvider';
+import { useTheme } from '@/components/theme/ThemeProvider';
 
 // Mock theme provider for controlled testing
 jest.mock('@/components/theme/ThemeProvider', () => {

frontend/tests/hooks/usePrefersReducedMotion.test.ts

@@ -164,7 +164,7 @@ describe('usePrefersReducedMotion', () => {
   it('handles SSR environment safely', () => {
     const originalWindow = global.window;
 
-    // @ts-ignore - Simulating SSR
+    // @ts-expect-error - Simulating SSR
     delete global.window;
 
     const { result } = renderHook(() => usePrefersReducedMotion());

frontend/tests/lib/api/errors.test.ts

@@ -630,7 +630,7 @@ describe('API Error Handling', () => {
 
   describe('Error message completeness', () => {
     it('should have non-empty messages for all error codes', () => {
-      Object.entries(ERROR_MESSAGES).forEach(([code, message]) => {
+      Object.entries(ERROR_MESSAGES).forEach(([_code, message]) => {
         expect(message).toBeTruthy();
         expect(message.length).toBeGreaterThan(0);
         expect(message).not.toBe('');
@@ -639,7 +639,7 @@ describe('API Error Handling', () => {
 
     it('should have user-friendly messages', () => {
       // Check that messages don't contain technical jargon or error codes
-      Object.entries(ERROR_MESSAGES).forEach(([code, message]) => {
+      Object.entries(ERROR_MESSAGES).forEach(([_code, message]) => {
         expect(message).not.toContain('null');
         expect(message).not.toContain('undefined');
         expect(message).not.toContain('Error:');

frontend/tests/lib/api/hooks/useAuth.test.tsx

@@ -4,7 +4,7 @@
  * These tests cover hook setup, types, and basic integration
  */
 
-import { renderHook, waitFor } from '@testing-library/react';
+import { renderHook } from '@testing-library/react';
 import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 import {
   useIsAuthenticated,