JavaScript AI Coding

// AI-Generated React Component with Production-Ready Patterns
import React, { useState, useEffect, useMemo, useCallback, useRef } from 'react';
import PropTypes from 'prop-types';
import { debounce } from 'lodash';

const UserSearchComponent = ({ onUserSelect, initialUsers = [] }) => {
  const [searchTerm, setSearchTerm] = useState('');
  const [users, setUsers] = useState([]);
  const [loading, setLoading] = useState(false);
  const [error, setError] = useState(null);
  const abortControllerRef = useRef(null);
  const currentSearchRef = useRef('');

  // Initialize with provided users
  useEffect(() => {
    setUsers(initialUsers);
  }, [initialUsers]);

  // Memoized filtered users for performance
  const filteredUsers = useMemo(() => {
    if (!searchTerm.trim()) return users;
    
    return users.filter(user =>
      user.name.toLowerCase().includes(searchTerm.toLowerCase()) ||
      user.email.toLowerCase().includes(searchTerm.toLowerCase())
    );
  }, [users, searchTerm]);

  // Enhanced search with race condition protection and memory management
  const performSearch = useCallback(async (term) => {
    if (!term.trim() || term.length < 2) return;
    
    // Cancel previous request
    if (abortControllerRef.current) {
      abortControllerRef.current.abort();
    }
    
    // Create new abort controller
    abortControllerRef.current = new AbortController();
    currentSearchRef.current = term;
    
    setLoading(true);
    setError(null);
    
    try {
      const response = await fetch(
        `/api/v1/users/search?q=${encodeURIComponent(term)}&limit=50`,
        {
          signal: abortControllerRef.current.signal,
          headers: {
            'Content-Type': 'application/json',
            'X-Request-ID': crypto.randomUUID()
          }
        }
      );
      
      if (!response.ok) {
        throw new Error(`HTTP ${response.status}: ${response.statusText}`);
      }
      
      const data = await response.json();
      
      // Only update if this is still the current search
      if (currentSearchRef.current === term) {
        // Replace users instead of accumulating to prevent memory leaks
        setUsers(data.users || []);
      }
    } catch (err) {
      // Ignore abort errors (expected when cancelling)
      if (err.name !== 'AbortError' && currentSearchRef.current === term) {
        setError(`Search failed: ${err.message}`);
        console.error('User search error:', err);
      }
    } finally {
      if (currentSearchRef.current === term) {
        setLoading(false);
      }
    }
  }, []);

  // Debounced search function
  const debouncedSearch = useMemo(
    () => debounce(performSearch, 300),
    [performSearch]
  );

  // Effect for triggering search with cleanup
  useEffect(() => {
    if (searchTerm.length >= 2) {
      debouncedSearch(searchTerm);
    } else if (searchTerm.length === 0) {
      // Reset to initial users when search is cleared
      setUsers(initialUsers);
      setError(null);
    }
    
    return () => {
      debouncedSearch.cancel();
      if (abortControllerRef.current) {
        abortControllerRef.current.abort();
      }
    };
  }, [searchTerm, debouncedSearch, initialUsers]);

  // Optimized event handlers
  const handleSearchChange = useCallback((e) => {
    const value = e.target.value;
    setSearchTerm(value);
  }, []);

  const handleUserClick = useCallback((user) => {
    if (onUserSelect && typeof onUserSelect === 'function') {
      onUserSelect(user);
    }
  }, [onUserSelect]);

  const handleKeyDown = useCallback((e, user) => {
    if (e.key === 'Enter' || e.key === ' ') {
      e.preventDefault();
      handleUserClick(user);
    }
  }, [handleUserClick]);

  const handleClearSearch = useCallback(() => {
    setSearchTerm('');
    setUsers(initialUsers);
    setError(null);
  }, [initialUsers]);

  return (
    

      

        
        {searchTerm && (
          
            ×
          
        )}
        {loading && (
          

            ⏳
          
        )}
      
      
      

        Type at least 2 characters to search for users
      

      {error && (
        

          ⚠️
          {error}
           setError(null)}
            className="error-dismiss"
            aria-label="Dismiss error"
          >
            ×
          
        
      )}

      

        {filteredUsers.map(user => (
          
 handleUserClick(user)}
            onKeyDown={(e) => handleKeyDown(e, user)}
            tabIndex={0}
            role="option"
            aria-label={`Select user ${user.name}, ${user.email}`}
          >
            

              {user.avatar ? (
                 {
                    e.target.style.display = 'none';
                    e.target.nextSibling.style.display = 'flex';
                  }}
                />
              ) : null}
              

                {user.name.charAt(0).toUpperCase()}
              
            
            

              
{user.name}
              
{user.email}
              {user.department && (
                
{user.department}
              )}
            
          
        ))}
      

      {searchTerm && filteredUsers.length === 0 && !loading && (
        

          🔍
          No users found matching "{searchTerm}"
          

          Try adjusting your search terms
        
      )}
      
      {!searchTerm && users.length === 0 && (
        

          👥
          Start typing to search for users
        
      )}
    
  );
};

// PropTypes for runtime type checking
UserSearchComponent.propTypes = {
  onUserSelect: PropTypes.func,
  initialUsers: PropTypes.arrayOf(
    PropTypes.shape({
      id: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
      name: PropTypes.string.isRequired,
      email: PropTypes.string.isRequired,
      avatar: PropTypes.string,
      department: PropTypes.string
    })
  )
};

UserSearchComponent.defaultProps = {
  onUserSelect: null,
  initialUsers: []
};

export default React.memo(UserSearchComponent);

// AI-Generated Production-Ready Node.js API with Security & Monitoring
import express from 'express';
import helmet from 'helmet';
import cors from 'cors';
import rateLimit from 'express-rate-limit';
import { body, validationResult } from 'express-validator';
import winston from 'winston';
import crypto from 'crypto';
import { AppError, asyncHandler } from '../utils/errorHandling.js';
import { UserService } from '../services/UserService.js';

// Configure structured logging
const logger = winston.createLogger({
  level: process.env.LOG_LEVEL || 'info',
  format: winston.format.combine(
    winston.format.timestamp(),
    winston.format.errors({ stack: true }),
    winston.format.json()
  ),
  transports: [
    new winston.transports.File({ filename: 'logs/error.log', level: 'error' }),
    new winston.transports.File({ filename: 'logs/combined.log' }),
    ...(process.env.NODE_ENV !== 'production' ? [
      new winston.transports.Console({
        format: winston.format.combine(
          winston.format.colorize(),
          winston.format.simple()
        )
      })
    ] : [])
  ]
});

class UserController {
  constructor(userService = new UserService()) {
    this.userService = userService;
    
    // Bind methods to preserve context
    this.searchUsers = this.searchUsers.bind(this);
    this.createUser = this.createUser.bind(this);
    this.getUserById = this.getUserById.bind(this);
    this.updateUser = this.updateUser.bind(this);
    this.deleteUser = this.deleteUser.bind(this);
  }

  // Enhanced error handling middleware
  static handleValidationErrors = (req, res, next) => {
    const errors = validationResult(req);
    if (!errors.isEmpty()) {
      logger.warn('Validation failed', {
        requestId: req.id,
        errors: errors.array(),
        path: req.path,
        method: req.method
      });
      
      return res.status(400).json({
        success: false,
        error: {
          code: 'VALIDATION_ERROR',
          message: 'Request validation failed',
          details: errors.array().map(err => ({
            field: err.path,
            message: err.msg,
            value: err.value
          }))
        },
        requestId: req.id
      });
    }
    next();
  };

  // Enhanced search with security and monitoring
  searchUsers = asyncHandler(async (req, res) => {
    const startTime = Date.now();
    const { q: query, page = 1, limit = 10, sortBy = 'name', order = 'asc' } = req.query;
    
    logger.info('User search initiated', {
      requestId: req.id,
      query: query?.substring(0, 50), // Log truncated query for privacy
      page,
      limit,
      userAgent: req.get('User-Agent'),
      ip: req.ip
    });
    
    // Enhanced input validation
    if (!query || typeof query !== 'string') {
      throw new AppError('Search query is required', 400, 'MISSING_QUERY');
    }
    
    const trimmedQuery = query.trim();
    if (trimmedQuery.length < 2) {
      throw new AppError('Search query must be at least 2 characters', 400, 'QUERY_TOO_SHORT');
    }
    
    if (trimmedQuery.length > 100) {
      throw new AppError('Search query too long', 400, 'QUERY_TOO_LONG');
    }

    // Sanitize and validate pagination
    const pageNum = Math.max(1, Math.min(100, parseInt(page) || 1));
    const limitNum = Math.max(1, Math.min(50, parseInt(limit) || 10));
    const offset = (pageNum - 1) * limitNum;
    
    // Validate sort parameters
    const allowedSortFields = ['name', 'email', 'createdAt', 'lastActive'];
    const validSortBy = allowedSortFields.includes(sortBy) ? sortBy : 'name';
    const validOrder = ['asc', 'desc'].includes(order.toLowerCase()) ? order.toLowerCase() : 'asc';

    try {
      const result = await this.userService.searchUsers({
        query: trimmedQuery,
        page: pageNum,
        limit: limitNum,
        offset,
        sortBy: validSortBy,
        order: validOrder,
        requestId: req.id
      });

      const responseTime = Date.now() - startTime;
      
      logger.info('User search completed', {
        requestId: req.id,
        resultCount: result.users?.length || 0,
        totalCount: result.total,
        responseTime,
        page: pageNum,
        limit: limitNum
      });

      res.json({
        success: true,
        data: {
          users: result.users || [],
          pagination: {
            page: pageNum,
            limit: limitNum,
            total: result.total || 0,
            pages: Math.ceil((result.total || 0) / limitNum),
            hasNext: pageNum * limitNum < (result.total || 0),
            hasPrev: pageNum > 1
          },
          meta: {
            query: trimmedQuery,
            sortBy: validSortBy,
            order: validOrder,
            responseTime
          }
        },
        requestId: req.id
      });
    } catch (error) {
      logger.error('User search failed', {
        requestId: req.id,
        error: error.message,
        stack: error.stack,
        query: trimmedQuery
      });
      throw error;
    }
  });

  // Enhanced user creation with comprehensive validation
  createUser = asyncHandler(async (req, res) => {
    const { name, email, password, department, role = 'user' } = req.body;
    
    logger.info('User creation initiated', {
      requestId: req.id,
      email: email?.toLowerCase(),
      department,
      role,
      ip: req.ip
    });

    try {
      const userData = {
        name: name.trim(),
        email: email.toLowerCase().trim(),
        password, // Will be hashed by service
        department: department?.trim(),
        role,
        createdBy: req.user?.id,
        ipAddress: req.ip,
        userAgent: req.get('User-Agent')
      };

      const newUser = await this.userService.createUser(userData, req.id);
      
      logger.info('User created successfully', {
        requestId: req.id,
        userId: newUser.id,
        email: newUser.email
      });
      
      // Remove sensitive data from response
      const { password: _, ...safeUser } = newUser;
      
      res.status(201).json({
        success: true,
        message: 'User created successfully',
        data: { user: safeUser },
        requestId: req.id
      });
    } catch (error) {
      if (error.code === 'DUPLICATE_EMAIL') {
        logger.warn('Duplicate email registration attempt', {
          requestId: req.id,
          email: email?.toLowerCase(),
          ip: req.ip
        });
        
        throw new AppError(
          'An account with this email already exists',
          409,
          'DUPLICATE_EMAIL'
        );
      }
      
      logger.error('User creation failed', {
        requestId: req.id,
        error: error.message,
        stack: error.stack,
        email: email?.toLowerCase()
      });
      
      throw error;
    }
  });
}

// Enhanced rate limiting with different tiers
const createRateLimit = (windowMs, max, message) => 
  rateLimit({
    windowMs,
    max,
    message: {
      success: false,
      error: {
        code: 'RATE_LIMIT_EXCEEDED',
        message
      }
    },
    standardHeaders: true,
    legacyHeaders: false,
    skip: (req) => {
      // Skip rate limiting for admin users in non-production
      return process.env.NODE_ENV !== 'production' && req.user?.role === 'admin';
    }
  });

const searchRateLimit = createRateLimit(
  15 * 60 * 1000, // 15 minutes
  100, // requests
  'Too many search requests, please try again later'
);

const createUserRateLimit = createRateLimit(
  60 * 60 * 1000, // 1 hour
  5, // requests
  'Too many user creation attempts, please try again later'
);

// Comprehensive validation middleware
const searchValidation = [
  body('q')
    .optional()
    .isString()
    .withMessage('Query must be a string')
    .isLength({ min: 2, max: 100 })
    .withMessage('Query must be between 2 and 100 characters')
    .escape(),
  UserController.handleValidationErrors
];

const createUserValidation = [
  body('name')
    .trim()
    .isLength({ min: 2, max: 100 })
    .withMessage('Name must be between 2 and 100 characters')
    .matches(/^[a-zA-Z\s'-]+$/)
    .withMessage('Name contains invalid characters')
    .escape(),
  body('email')
    .isEmail()
    .withMessage('Please provide a valid email address')
    .normalizeEmail({
      gmail_remove_dots: false,
      gmail_remove_subaddress: false
    })
    .custom(async (email) => {
      // Check for disposable email domains
      const disposableDomains = ['tempmail.org', '10minutemail.com', 'guerrillamail.com'];
      const domain = email.split('@')[1];
      if (disposableDomains.includes(domain)) {
        throw new Error('Disposable email addresses are not allowed');
      }
      return true;
    }),
  body('password')
    .isLength({ min: 8, max: 128 })
    .withMessage('Password must be between 8 and 128 characters')
    .matches(/^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]/)
    .withMessage('Password must contain at least one uppercase letter, one lowercase letter, one number, and one special character'),
  body('department')
    .optional()
    .trim()
    .isLength({ max: 50 })
    .withMessage('Department name too long')
    .escape(),
  body('role')
    .optional()
    .isIn(['user', 'admin', 'moderator'])
    .withMessage('Invalid role specified'),
  UserController.handleValidationErrors
];

// Request ID and CORS middleware
const requestIdMiddleware = (req, res, next) => {
  req.id = crypto.randomUUID();
  res.setHeader('X-Request-ID', req.id);
  next();
};

const corsOptions = {
  origin: process.env.ALLOWED_ORIGINS?.split(',') || ['http://localhost:3000'],
  credentials: true,
  optionsSuccessStatus: 200
};

export {
  UserController,
  searchRateLimit,
  createUserRateLimit,
  searchValidation,
  createUserValidation,
  requestIdMiddleware,
  corsOptions,
  logger
};