{
  "context": "This evaluation assesses the engineer's ability to implement a React class component using proper TypeScript typing. It focuses on their understanding of Component/PureComponent base classes, class component state management, lifecycle methods, and optimization patterns specific to class-based React development.",
  "type": "weighted_checklist",
  "checklist": [
    {
      "name": "Component Class Definition",
      "description": "Uses React.Component or React.PureComponent as the base class with proper TypeScript generic parameters for props and state (e.g., extends React.Component<Props, State> or extends React.PureComponent<Props, State>)",
      "max_score": 15
    },
    {
      "name": "Props Interface",
      "description": "Defines a proper TypeScript interface for component props that includes the products array with correct Product type",
      "max_score": 10
    },
    {
      "name": "State Interface",
      "description": "Defines a proper TypeScript interface for component state that includes sortColumn, sortDirection, nameFilter, and categoryFilter (or equivalent state properties)",
      "max_score": 10
    },
    {
      "name": "State Initialization",
      "description": "Initializes state correctly either in the constructor or using class property syntax with appropriate default values for all state properties",
      "max_score": 10
    },
    {
      "name": "setState Usage",
      "description": "Uses this.setState() method correctly to update component state when handling sort operations and filter changes, ensuring immutability",
      "max_score": 15
    },
    {
      "name": "PureComponent Optimization",
      "description": "Uses React.PureComponent as the base class OR implements shouldComponentUpdate() lifecycle method to prevent unnecessary re-renders through shallow comparison",
      "max_score": 15
    },
    {
      "name": "Event Handlers",
      "description": "Implements event handler methods (e.g., handleSort, handleNameFilter, handleCategoryFilter) as class methods, properly bound to the component instance (using arrow functions or bind)",
      "max_score": 10
    },
    {
      "name": "Render Method",
      "description": "Implements the render() method that returns JSX, computes filtered and sorted data within render or helper methods, and displays the table structure",
      "max_score": 10
    },
    {
      "name": "Lifecycle Methods",
      "description": "Uses appropriate lifecycle methods if needed (e.g., componentDidMount, componentDidUpdate, getDerivedStateFromProps) for initialization or side effects, or correctly omits them if not needed",
      "max_score": 5
    }
  ]
}