react-code-smell-detector 1.2.0 → 1.3.1

package/src/detectors/security.ts

@@ -1,179 +0,0 @@
-import * as t from '@babel/types';
-import { ParsedComponent, getCodeSnippet } from '../parser/index.js';
-import { CodeSmell, DetectorConfig, DEFAULT_CONFIG } from '../types/index.js';
-
-/**
- * Detects security vulnerabilities:
- * - dangerouslySetInnerHTML usage
- * - eval() and Function() constructor
- * - innerHTML assignments
- * - Unsafe URLs (javascript:, data:)
- * - Exposed secrets/API keys
- */
-export function detectSecurityIssues(
-  component: ParsedComponent,
-  filePath: string,
-  sourceCode: string,
-  config: DetectorConfig = DEFAULT_CONFIG
-): CodeSmell[] {
-  if (!config.checkSecurity) return [];
-
-  const smells: CodeSmell[] = [];
-
-  // Detect dangerouslySetInnerHTML
-  component.path.traverse({
-    JSXAttribute(path) {
-      if (t.isJSXIdentifier(path.node.name) && 
-          path.node.name.name === 'dangerouslySetInnerHTML') {
-        const loc = path.node.loc;
-        smells.push({
-          type: 'security-xss',
-          severity: 'error',
-          message: `dangerouslySetInnerHTML is a security risk in "${component.name}"`,
-          file: filePath,
-          line: loc?.start.line || 0,
-          column: loc?.start.column || 0,
-          suggestion: 'Sanitize HTML with DOMPurify or use a safe alternative like converting to React elements',
-          codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-        });
-      }
-    },
-  });
-
-  // Detect eval() and Function() constructor
-  component.path.traverse({
-    CallExpression(path) {
-      const { callee } = path.node;
-      
-      // eval()
-      if (t.isIdentifier(callee) && callee.name === 'eval') {
-        const loc = path.node.loc;
-        smells.push({
-          type: 'security-eval',
-          severity: 'error',
-          message: `eval() is a critical security risk in "${component.name}"`,
-          file: filePath,
-          line: loc?.start.line || 0,
-          column: loc?.start.column || 0,
-          suggestion: 'Never use eval(). Parse JSON with JSON.parse() or restructure logic to avoid dynamic code execution.',
-          codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-        });
-      }
-    },
-    
-    // new Function()
-    NewExpression(path) {
-      const { callee } = path.node;
-      if (t.isIdentifier(callee) && callee.name === 'Function') {
-        const loc = path.node.loc;
-        smells.push({
-          type: 'security-eval',
-          severity: 'error',
-          message: `new Function() is equivalent to eval() and is a security risk`,
-          file: filePath,
-          line: loc?.start.line || 0,
-          column: loc?.start.column || 0,
-          suggestion: 'Avoid creating functions from strings. Restructure to use static function definitions.',
-          codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-        });
-      }
-    },
-  });
-
-  // Detect innerHTML assignments
-  component.path.traverse({
-    AssignmentExpression(path) {
-      const { left } = path.node;
-      
-      if (t.isMemberExpression(left) && t.isIdentifier(left.property)) {
-        if (left.property.name === 'innerHTML' || left.property.name === 'outerHTML') {
-          const loc = path.node.loc;
-          smells.push({
-            type: 'security-xss',
-            severity: 'warning',
-            message: `Direct ${left.property.name} assignment can lead to XSS`,
-            file: filePath,
-            line: loc?.start.line || 0,
-            column: loc?.start.column || 0,
-            suggestion: 'Use textContent for plain text, or sanitize HTML with DOMPurify',
-            codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-          });
-        }
-      }
-    },
-  });
-
-  // Detect unsafe URLs (javascript:, data:)
-  component.path.traverse({
-    JSXAttribute(path) {
-      if (!t.isJSXIdentifier(path.node.name)) return;
-      
-      const propName = path.node.name.name;
-      if (!['href', 'src', 'action'].includes(propName)) return;
-      
-      const value = path.node.value;
-      if (t.isStringLiteral(value)) {
-        const url = value.value.toLowerCase().trim();
-        
-        if (url.startsWith('javascript:')) {
-          const loc = path.node.loc;
-          smells.push({
-            type: 'security-xss',
-            severity: 'error',
-            message: `javascript: URLs are a security risk`,
-            file: filePath,
-            line: loc?.start.line || 0,
-            column: loc?.start.column || 0,
-            suggestion: 'Use onClick handlers instead of javascript: URLs',
-            codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-          });
-        }
-        
-        if (url.startsWith('data:') && propName === 'href') {
-          const loc = path.node.loc;
-          smells.push({
-            type: 'security-xss',
-            severity: 'warning',
-            message: `data: URLs in href can be a security risk`,
-            file: filePath,
-            line: loc?.start.line || 0,
-            column: loc?.start.column || 0,
-            suggestion: 'Validate and sanitize data URLs, or use blob URLs instead',
-            codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-          });
-        }
-      }
-    },
-  });
-
-  // Detect potential exposed secrets
-  const secretPatterns = [
-    { pattern: /['"](?:sk[-_]live|pk[-_]live|api[-_]?key|secret[-_]?key|access[-_]?token|auth[-_]?token)['"]\s*[:=]\s*['"][a-zA-Z0-9-_]{20,}/i, name: 'API key' },
-    { pattern: /['"](?:ghp|gho|ghu|ghs|ghr)_[a-zA-Z0-9]{36,}['"]/i, name: 'GitHub token' },
-    { pattern: /['"]AKIA[A-Z0-9]{16}['"]/i, name: 'AWS access key' },
-    { pattern: /password\s*[:=]\s*['"][^'"]{8,}['"]/i, name: 'Hardcoded password' },
-  ];
-
-  const lines = sourceCode.split('\n');
-  lines.forEach((line, index) => {
-    const lineNum = index + 1;
-    if (lineNum < component.startLine || lineNum > component.endLine) return;
-    
-    secretPatterns.forEach(({ pattern, name }) => {
-      if (pattern.test(line)) {
-        smells.push({
-          type: 'security-secrets',
-          severity: 'error',
-          message: `Potential ${name} exposed in code`,
-          file: filePath,
-          line: lineNum,
-          column: 0,
-          suggestion: 'Move secrets to environment variables (.env) and never commit them to version control',
-          codeSnippet: getCodeSnippet(sourceCode, lineNum),
-        });
-      }
-    });
-  });
-
-  return smells;
-}

package/src/detectors/typescript.ts

@@ -1,151 +0,0 @@
-import * as t from '@babel/types';
-import { ParsedComponent, getCodeSnippet } from '../parser/index.js';
-import { CodeSmell, DetectorConfig, DEFAULT_CONFIG } from '../types/index.js';
-
-/**
- * Detects TypeScript-specific code smells:
- * - Overuse of 'any' type
- * - Missing return type on functions
- * - Non-null assertion operator (!)
- * - Type assertions (as) that could be avoided
- */
-export function detectTypescriptIssues(
-  component: ParsedComponent,
-  filePath: string,
-  sourceCode: string,
-  config: DetectorConfig = DEFAULT_CONFIG
-): CodeSmell[] {
-  if (!config.checkTypescript) return [];
-  
-  // Only run on TypeScript files
-  if (!filePath.endsWith('.ts') && !filePath.endsWith('.tsx')) return [];
-
-  const smells: CodeSmell[] = [];
-
-  // Detect 'any' type usage
-  component.path.traverse({
-    TSAnyKeyword(path) {
-      const loc = path.node.loc;
-      smells.push({
-        type: 'ts-any-usage',
-        severity: 'warning',
-        message: `Using "any" type in "${component.name}"`,
-        file: filePath,
-        line: loc?.start.line || 0,
-        column: loc?.start.column || 0,
-        suggestion: 'Use a specific type, "unknown", or create an interface',
-        codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-      });
-    },
-  });
-
-  // Detect functions without return type (only in complex functions)
-  component.path.traverse({
-    FunctionDeclaration(path) {
-      // Skip if function has explicit return type
-      if (path.node.returnType) return;
-      
-      // Check if function body has return statements
-      let hasReturn = false;
-      path.traverse({
-        ReturnStatement(returnPath) {
-          if (returnPath.node.argument) {
-            hasReturn = true;
-          }
-        },
-      });
-      
-      if (hasReturn) {
-        const loc = path.node.loc;
-        smells.push({
-          type: 'ts-missing-return-type',
-          severity: 'info',
-          message: `Function "${path.node.id?.name || 'anonymous'}" missing return type`,
-          file: filePath,
-          line: loc?.start.line || 0,
-          column: loc?.start.column || 0,
-          suggestion: 'Add explicit return type: function name(): ReturnType { ... }',
-          codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-        });
-      }
-    },
-
-    ArrowFunctionExpression(path) {
-      // Only check arrow functions assigned to variables with 5+ lines
-      if (!path.node.returnType) {
-        const body = path.node.body;
-        
-        // Skip simple arrow functions (single expression)
-        if (!t.isBlockStatement(body)) return;
-        
-        // Check complexity - only flag if function is substantial
-        const startLine = path.node.loc?.start.line || 0;
-        const endLine = path.node.loc?.end.line || 0;
-        
-        if (endLine - startLine >= 5) {
-          // Check if parent is variable declarator (assigned to variable)
-          const parent = path.parent;
-          
-          if (t.isVariableDeclarator(parent) && t.isIdentifier(parent.id)) {
-            const loc = path.node.loc;
-            smells.push({
-              type: 'ts-missing-return-type',
-              severity: 'info',
-              message: `Arrow function "${parent.id.name}" missing return type`,
-              file: filePath,
-              line: loc?.start.line || 0,
-              column: loc?.start.column || 0,
-              suggestion: 'Add return type: const name = (): ReturnType => { ... }',
-              codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-            });
-          }
-        }
-      }
-    },
-  });
-
-  // Detect non-null assertion operator (!)
-  component.path.traverse({
-    TSNonNullExpression(path) {
-      const loc = path.node.loc;
-      smells.push({
-        type: 'ts-non-null-assertion',
-        severity: 'warning',
-        message: `Non-null assertion (!) bypasses type safety in "${component.name}"`,
-        file: filePath,
-        line: loc?.start.line || 0,
-        column: loc?.start.column || 0,
-        suggestion: 'Use optional chaining (?.) or proper null checks instead',
-        codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-      });
-    },
-  });
-
-  // Detect type assertions (as keyword) - these can hide type errors
-  component.path.traverse({
-    TSAsExpression(path) {
-      // Skip assertions to 'const' (used for const assertions)
-      if (t.isTSTypeReference(path.node.typeAnnotation)) {
-        const typeName = path.node.typeAnnotation.typeName;
-        if (t.isIdentifier(typeName) && typeName.name === 'const') return;
-      }
-      
-      // Skip double assertions (as unknown as Type) - already flagged by TypeScript
-      if (t.isTSAsExpression(path.node.expression)) return;
-      
-      const loc = path.node.loc;
-      smells.push({
-        type: 'ts-type-assertion',
-        severity: 'info',
-        message: `Type assertion (as) bypasses type checking in "${component.name}"`,
-        file: filePath,
-        line: loc?.start.line || 0,
-        column: loc?.start.column || 0,
-        suggestion: 'Consider using type guards or proper typing instead of assertions',
-        codeSnippet: getCodeSnippet(sourceCode, loc?.start.line || 0),
-      });
-    },
-  });
-
-  return smells;
-}

package/src/detectors/useEffect.ts

@@ -1,117 +0,0 @@
-import * as t from '@babel/types';
-import { ParsedComponent, getCodeSnippet } from '../parser/index.js';
-import { CodeSmell, DetectorConfig, DEFAULT_CONFIG } from '../types/index.js';
-
-export function detectUseEffectOveruse(
-  component: ParsedComponent,
-  filePath: string,
-  sourceCode: string,
-  config: DetectorConfig = DEFAULT_CONFIG
-): CodeSmell[] {
-  const smells: CodeSmell[] = [];
-  const { useEffect } = component.hooks;
-
-  // Check for too many useEffects
-  if (useEffect.length > config.maxUseEffectsPerComponent) {
-    smells.push({
-      type: 'useEffect-overuse',
-      severity: 'warning',
-      message: `Component "${component.name}" has ${useEffect.length} useEffect hooks (max recommended: ${config.maxUseEffectsPerComponent})`,
-      file: filePath,
-      line: component.startLine,
-      column: 0,
-      suggestion: 'Consider extracting logic into custom hooks or combining related effects',
-      codeSnippet: getCodeSnippet(sourceCode, component.startLine),
-    });
-  }
-
-  // Check each useEffect for issues
-  useEffect.forEach((effect, index) => {
-    const loc = effect.loc;
-    if (!loc) return;
-
-    // Check for empty dependency array with async operations
-    const deps = effect.arguments[1];
-    const callback = effect.arguments[0];
-
-    if (t.isArrayExpression(deps) && deps.elements.length === 0) {
-      // Empty dependency array - check if it's justified
-      let hasAsyncOperation = false;
-      let hasStateUpdate = false;
-
-      if (t.isArrowFunctionExpression(callback) || t.isFunctionExpression(callback)) {
-        const body = callback.body;
-        const checkNode = (node: t.Node) => {
-          if (t.isAwaitExpression(node)) hasAsyncOperation = true;
-          if (t.isCallExpression(node)) {
-            const callee = node.callee;
-            if (t.isIdentifier(callee) && callee.name.startsWith('set')) {
-              hasStateUpdate = true;
-            }
-          }
-        };
-
-        if (t.isBlockStatement(body)) {
-          body.body.forEach(stmt => {
-            t.traverseFast(stmt, checkNode);
-          });
-        }
-      }
-
-      if (hasAsyncOperation && hasStateUpdate) {
-        smells.push({
-          type: 'useEffect-overuse',
-          severity: 'info',
-          message: `useEffect #${index + 1} in "${component.name}" has empty deps but contains async state updates`,
-          file: filePath,
-          line: loc.start.line,
-          column: loc.start.column,
-          suggestion: 'Consider using React Query, SWR, or a custom hook for data fetching',
-          codeSnippet: getCodeSnippet(sourceCode, loc.start.line),
-        });
-      }
-    }
-
-    // Check for missing cleanup
-    if (t.isArrowFunctionExpression(callback) || t.isFunctionExpression(callback)) {
-      let hasSubscription = false;
-      let hasCleanup = false;
-
-      const checkSubscription = (node: t.Node) => {
-        if (t.isCallExpression(node) && t.isMemberExpression(node.callee)) {
-          const prop = node.callee.property;
-          if (t.isIdentifier(prop)) {
-            if (['addEventListener', 'subscribe', 'on', 'setInterval', 'setTimeout'].includes(prop.name)) {
-              hasSubscription = true;
-            }
-          }
-        }
-      };
-
-      const body = callback.body;
-      if (t.isBlockStatement(body)) {
-        body.body.forEach(stmt => {
-          t.traverseFast(stmt, checkSubscription);
-          if (t.isReturnStatement(stmt) && stmt.argument) {
-            hasCleanup = true;
-          }
-        });
-      }
-
-      if (hasSubscription && !hasCleanup) {
-        smells.push({
-          type: 'useEffect-overuse',
-          severity: 'error',
-          message: `useEffect in "${component.name}" sets up subscription but has no cleanup function`,
-          file: filePath,
-          line: loc.start.line,
-          column: loc.start.column,
-          suggestion: 'Add a cleanup function to remove event listeners/subscriptions',
-          codeSnippet: getCodeSnippet(sourceCode, loc.start.line),
-        });
-      }
-    }
-  });
-
-  return smells;
-}