agentsqripts/cli/temp-ui-test.jsx

Comprehensive static code analysis toolkit for identifying technical debt, security vulnerabilities, performance issues, and code quality problems

      import React from 'react';
      
      function ProblematicComponent() {
        return (
          <div>
            {/* Missing alt text - accessibility issue */}
            <img src="logo.png" />
            
            {/* Non-semantic button - UI issue */}
            <div onClick={() => alert('clicked')}>Click me</div>
            
            {/* Poor color contrast */}
            <p style={{color: '#ccc', backgroundColor: '#ddd'}}>Hard to read text</p>
            
            {/* Missing form labels */}
            <input type="text" placeholder="Enter name" />
            <input type="email" placeholder="Enter email" />
            
            {/* Inconsistent spacing */}
            <button style={{margin: '5px'}}>Button 1</button>
            <button style={{margin: '10px'}}>Button 2</button>
            <button style={{margin: '8px'}}>Button 3</button>
            
            {/* Ambiguous icon without text */}
            <button>⚙️</button>
          </div>
        );
      }