React Component Architecture Diagnosis

Overview

Run a deep health check on a single React component across 7 dimensions and output a structured diagnosis report.

Workflow

1. Locate the component → read ALL source files (including subdirectories). Real defects often
   hide in sub-files (hooks/utils); skipping any file means missing them
2. Summarize the responsibility → state in one sentence what the component does
3. Score each dimension → answer the core question + score + find code evidence
4. Cross-check → revisit every dimension and fill in missed concrete issues
5. Apply the template → scorecard + highlights + recommendations

One principle runs through the whole flow: report only problems that can be found by reading code line by line, never surface-level structural judgments a directory scan would produce. The full set of principles is in "Diagnosis Principles" at the end.