Major Enhancement: NestJS Migration + CASL Authorization + Error Handling

Complete rewrite from Express to NestJS with enterprise-grade features:

## Backend Improvements
- Migrated from Express to NestJS 11.0.1 with TypeScript
- Implemented Prisma ORM 7.3.0 for type-safe database access
- Added CASL authorization system replacing role-based guards
- Created global exception filters with structured logging
- Implemented Auth0 JWT authentication with Passport.js
- Added vehicle management with conflict detection
- Enhanced event scheduling with driver/vehicle assignment
- Comprehensive error handling and logging

## Frontend Improvements
- Upgraded to React 19.2.0 with Vite 7.2.4
- Implemented CASL-based permission system
- Added AbilityContext for declarative permissions
- Created ErrorHandler utility for consistent error messages
- Enhanced API client with request/response logging
- Added War Room (Command Center) dashboard
- Created VIP Schedule view with complete itineraries
- Implemented Vehicle Management UI
- Added mock data generators for testing (288 events across 20 VIPs)

## New Features
- Vehicle fleet management (types, capacity, status tracking)
- Complete 3-day Jamboree schedule generation
- Individual VIP schedule pages with PDF export (planned)
- Real-time War Room dashboard with auto-refresh
- Permission-based navigation filtering
- First user auto-approval as administrator

## Documentation
- Created CASL_AUTHORIZATION.md (comprehensive guide)
- Created ERROR_HANDLING.md (error handling patterns)
- Updated CLAUDE.md with new architecture
- Added migration guides and best practices

## Technical Debt Resolved
- Removed custom authentication in favor of Auth0
- Replaced role checks with CASL abilities
- Standardized error responses across API
- Implemented proper TypeScript typing
- Added comprehensive logging

Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>

frontend/src/lib/abilities.ts

@@ -0,0 +1,94 @@
+import { AbilityBuilder, PureAbility, AbilityClass } from '@casl/ability';
+
+/**
+ * Define all possible actions in the system
+ */
+export enum Action {
+  Manage = 'manage', // Special: allows everything
+  Create = 'create',
+  Read = 'read',
+  Update = 'update',
+  Delete = 'delete',
+  Approve = 'approve', // Special: for user approval
+  UpdateStatus = 'update-status', // Special: for drivers to update event status
+}
+
+/**
+ * Define all subjects (resources) in the system
+ */
+export type Subjects =
+  | 'User'
+  | 'VIP'
+  | 'Driver'
+  | 'ScheduleEvent'
+  | 'Flight'
+  | 'Vehicle'
+  | 'all';
+
+/**
+ * Define the AppAbility type
+ */
+export type AppAbility = PureAbility<[Action, Subjects]>;
+
+/**
+ * User role type (must match backend)
+ */
+export type UserRole = 'ADMINISTRATOR' | 'COORDINATOR' | 'DRIVER';
+
+/**
+ * User interface (simplified from backend)
+ */
+export interface User {
+  id: string;
+  role: UserRole;
+  isApproved: boolean;
+  driver?: {
+    id: string;
+  } | null;
+}
+
+/**
+ * Define abilities for a user based on their role
+ */
+export function defineAbilitiesFor(user: User | null): AppAbility {
+  const { can, cannot, build } = new AbilityBuilder<AppAbility>(
+    PureAbility as AbilityClass<AppAbility>,
+  );
+
+  if (!user) {
+    // Not authenticated - no permissions
+    return build();
+  }
+
+  // Define permissions based on role
+  if (user.role === 'ADMINISTRATOR') {
+    // Administrators can do everything
+    can(Action.Manage, 'all');
+  } else if (user.role === 'COORDINATOR') {
+    // Coordinators have full access except user management
+    can(Action.Read, 'all');
+    can(Action.Create, ['VIP', 'Driver', 'ScheduleEvent', 'Flight', 'Vehicle']);
+    can(Action.Update, ['VIP', 'Driver', 'ScheduleEvent', 'Flight', 'Vehicle']);
+    can(Action.Delete, ['VIP', 'Driver', 'ScheduleEvent', 'Flight', 'Vehicle']);
+
+    // Cannot manage users
+    cannot(Action.Create, 'User');
+    cannot(Action.Update, 'User');
+    cannot(Action.Delete, 'User');
+    cannot(Action.Approve, 'User');
+  } else if (user.role === 'DRIVER') {
+    // Drivers can only read most resources
+    can(Action.Read, ['VIP', 'Driver', 'ScheduleEvent', 'Vehicle']);
+
+    // Drivers can update status of events (specific instance check would need event data)
+    can(Action.UpdateStatus, 'ScheduleEvent');
+
+    // Cannot access flights
+    cannot(Action.Read, 'Flight');
+
+    // Cannot access users
+    cannot(Action.Read, 'User');
+  }
+
+  return build();
+}

frontend/src/lib/api.ts

@@ -0,0 +1,91 @@
+import axios from 'axios';
+
+const API_URL = import.meta.env.VITE_API_URL || 'http://localhost:3000/api/v1';
+const DEBUG_MODE = import.meta.env.DEV; // Enable detailed logging in development
+
+export const api = axios.create({
+  baseURL: API_URL,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+  timeout: 30000, // 30 second timeout
+});
+
+// Request interceptor to add auth token and log requests
+api.interceptors.request.use(
+  (config) => {
+    const token = localStorage.getItem('auth0_token');
+    if (token) {
+      config.headers.Authorization = `Bearer ${token}`;
+    }
+
+    // Log request in development mode
+    if (DEBUG_MODE) {
+      console.log(`[API] → ${config.method?.toUpperCase()} ${config.url}`, {
+        data: config.data,
+        params: config.params,
+      });
+    }
+
+    return config;
+  },
+  (error) => {
+    console.error('[API] Request error:', error);
+    return Promise.reject(error);
+  }
+);
+
+// Response interceptor for logging and error handling
+api.interceptors.response.use(
+  (response) => {
+    // Log successful response in development mode
+    if (DEBUG_MODE) {
+      console.log(`[API] ← ${response.status} ${response.config.method?.toUpperCase()} ${response.config.url}`, {
+        data: response.data,
+      });
+    }
+    return response;
+  },
+  (error) => {
+    const { config, response } = error;
+
+    // Enhanced error logging
+    if (response) {
+      // Server responded with error status
+      console.error(
+        `[API] ✖ ${response.status} ${config?.method?.toUpperCase()} ${config?.url}`,
+        {
+          status: response.status,
+          statusText: response.statusText,
+          data: response.data,
+          requestData: config?.data,
+        }
+      );
+
+      // Log specific error types
+      if (response.status === 401) {
+        console.warn('[API] Authentication required - user may need to log in again');
+      } else if (response.status === 403) {
+        console.warn('[API] Permission denied - user lacks required permissions');
+      } else if (response.status === 404) {
+        console.warn('[API] Resource not found');
+      } else if (response.status === 409) {
+        console.warn('[API] Conflict detected:', response.data.conflicts || response.data.message);
+      } else if (response.status >= 500) {
+        console.error('[API] Server error - backend may be experiencing issues');
+      }
+    } else if (error.request) {
+      // Request was made but no response received
+      console.error('[API] ✖ Network error - no response received', {
+        method: config?.method?.toUpperCase(),
+        url: config?.url,
+        message: error.message,
+      });
+    } else {
+      // Something else happened
+      console.error('[API] ✖ Request setup error:', error.message);
+    }
+
+    return Promise.reject(error);
+  }
+);

frontend/src/lib/errorHandler.ts

@@ -0,0 +1,170 @@
+import { AxiosError } from 'axios';
+import toast from 'react-hot-toast';
+
+/**
+ * Standard error response from backend
+ */
+interface BackendError {
+  statusCode: number;
+  message: string | string[];
+  error: string;
+  details?: any;
+  conflicts?: any[];
+}
+
+/**
+ * Error handling utility for consistent error messages across the app
+ */
+export class ErrorHandler {
+  /**
+   * Extract user-friendly error message from various error types
+   */
+  static getMessage(error: unknown, fallback: string = 'An error occurred'): string {
+    // Axios error with backend response
+    if (this.isAxiosError(error) && error.response?.data) {
+      const data = error.response.data as BackendError;
+
+      // Handle array of messages
+      if (Array.isArray(data.message)) {
+        return data.message.join(', ');
+      }
+
+      // Handle single message
+      if (data.message) {
+        return data.message;
+      }
+
+      // Handle specific status codes
+      if (error.response.status === 401) {
+        return 'Authentication required. Please log in again.';
+      }
+      if (error.response.status === 403) {
+        return 'You do not have permission to perform this action.';
+      }
+      if (error.response.status === 404) {
+        return 'The requested resource was not found.';
+      }
+      if (error.response.status === 409) {
+        return 'A conflict occurred. Please check for overlapping schedules.';
+      }
+      if (error.response.status >= 500) {
+        return 'Server error. Please try again later.';
+      }
+    }
+
+    // Axios error without response (network error)
+    if (this.isAxiosError(error) && !error.response) {
+      return 'Network error. Please check your connection.';
+    }
+
+    // Standard Error object
+    if (error instanceof Error) {
+      return error.message;
+    }
+
+    // Unknown error type
+    return fallback;
+  }
+
+  /**
+   * Show error toast with extracted message
+   */
+  static showError(error: unknown, fallback?: string): void {
+    const message = this.getMessage(error, fallback);
+    toast.error(message);
+  }
+
+  /**
+   * Log error to console with context
+   */
+  static log(context: string, error: unknown, additionalInfo?: any): void {
+    const timestamp = new Date().toISOString();
+    const message = this.getMessage(error);
+
+    console.error(`[${timestamp}] [${context}] ${message}`);
+
+    if (this.isAxiosError(error)) {
+      console.error('Request:', {
+        method: error.config?.method?.toUpperCase(),
+        url: error.config?.url,
+        data: error.config?.data,
+      });
+      console.error('Response:', error.response?.data);
+    } else {
+      console.error('Error details:', error);
+    }
+
+    if (additionalInfo) {
+      console.error('Additional info:', additionalInfo);
+    }
+  }
+
+  /**
+   * Handle error with both toast and logging
+   */
+  static handle(context: string, error: unknown, fallback?: string, additionalInfo?: any): void {
+    this.log(context, error, additionalInfo);
+    this.showError(error, fallback);
+  }
+
+  /**
+   * Type guard for AxiosError
+   */
+  private static isAxiosError(error: unknown): error is AxiosError {
+    return (error as AxiosError)?.isAxiosError === true;
+  }
+
+  /**
+   * Extract conflict details if present
+   */
+  static getConflicts(error: unknown): any[] | null {
+    if (this.isAxiosError(error) && error.response?.data) {
+      const data = error.response.data as BackendError;
+      return data.conflicts || null;
+    }
+    return null;
+  }
+
+  /**
+   * Check if error is a specific status code
+   */
+  static isStatus(error: unknown, statusCode: number): boolean {
+    return this.isAxiosError(error) && error.response?.status === statusCode;
+  }
+
+  /**
+   * Check if error is authentication-related
+   */
+  static isAuthError(error: unknown): boolean {
+    return this.isStatus(error, 401) || this.isStatus(error, 403);
+  }
+
+  /**
+   * Check if error is a conflict (409)
+   */
+  static isConflict(error: unknown): boolean {
+    return this.isStatus(error, 409);
+  }
+
+  /**
+   * Check if error is validation-related (400)
+   */
+  static isValidationError(error: unknown): boolean {
+    return this.isStatus(error, 400);
+  }
+}
+
+/**
+ * Convenience function for handling errors in try-catch blocks
+ *
+ * @example
+ * try {
+ *   await api.createVIP(data);
+ *   toast.success('VIP created successfully');
+ * } catch (error) {
+ *   handleError('VIP Creation', error, 'Failed to create VIP');
+ * }
+ */
+export function handleError(context: string, error: unknown, fallback?: string, additionalInfo?: any): void {
+  ErrorHandler.handle(context, error, fallback, additionalInfo);
+}

frontend/src/lib/utils.ts

@@ -0,0 +1,34 @@
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+export function cn(...inputs: ClassValue[]) {
+  return twMerge(clsx(inputs));
+}
+
+export function formatDate(date: string | Date): string {
+  const d = typeof date === 'string' ? new Date(date) : date;
+  return d.toLocaleDateString('en-US', {
+    year: 'numeric',
+    month: 'short',
+    day: 'numeric',
+  });
+}
+
+export function formatDateTime(date: string | Date): string {
+  const d = typeof date === 'string' ? new Date(date) : date;
+  return d.toLocaleString('en-US', {
+    year: 'numeric',
+    month: 'short',
+    day: 'numeric',
+    hour: '2-digit',
+    minute: '2-digit',
+  });
+}
+
+export function formatTime(date: string | Date): string {
+  const d = typeof date === 'string' ? new Date(date) : date;
+  return d.toLocaleTimeString('en-US', {
+    hour: '2-digit',
+    minute: '2-digit',
+  });
+}