{"record":{"id":"0546f7708f6bf7c8","repo":"oxc-project/oxc","slug":"class-component-should-be-written-as-a-function-co","errorCode":null,"errorMessage":"Class component should be written as a function component.","messagePattern":"Class component should be written as a function component\\.","errorType":"validation","errorClass":"OxcDiagnostic","httpStatus":null,"severity":"error","filePath":"crates/oxc_linter/src/rules/react/prefer_function_component.rs","lineNumber":20,"sourceCode":"use serde::Deserialize;\n\nuse oxc_ast::{\n    AstKind,\n    ast::{Class, ClassElement},\n};\nuse oxc_diagnostics::OxcDiagnostic;\nuse oxc_macros::declare_oxc_lint;\nuse oxc_span::Span;\n\nuse crate::{\n    AstNode,\n    context::{ContextHost, LintContext},\n    rule::{DefaultRuleConfig, Rule},\n    utils::{expression_contains_jsx, function_contains_jsx, is_es6_component},\n};\n\nfn prefer_function_component_diagnostic(span: Span) -> OxcDiagnostic {\n    OxcDiagnostic::warn(\"Class component should be written as a function component.\")\n        .with_help(\"Convert the class component to a function component.\")\n        .with_note(\"See https://react.dev/reference/react/Component#migrating-a-simple-component-from-a-class-to-a-function\")\n        .with_label(span)\n}\n\n#[derive(Debug, Clone, JsonSchema, Deserialize)]\n#[serde(rename_all = \"camelCase\", default, deny_unknown_fields)]\npub struct PreferFunctionComponent {\n    /// If `true`, error boundary classes (those implementing `componentDidCatch`\n    /// or `static getDerivedStateFromError`) are allowed as class components.\n    ///\n    /// This is because these classes are not easily converted to function components,\n    /// and so they are exempted from this rule by default.\n    allow_error_boundary: bool,\n    /// If `true`, classes that contain JSX but do not extend `Component` or\n    /// `PureComponent` are allowed.\n    allow_jsx_utility_class: bool,\n}","sourceCodeStart":2,"sourceCodeEnd":38,"githubUrl":"https://github.com/oxc-project/oxc/blob/e1e7af627c8843ab64044ed466b128fcc21a035b/crates/oxc_linter/src/rules/react/prefer_function_component.rs#L2-L38","documentation":"Raised by react/prefer_function_component when a class component (a class extending React.Component/PureComponent that renders JSX, detected via function_contains_jsx/expression_contains_jsx heuristics) is encountered. At the throw site the component carries no instance features that require a class (the rule targets classes that only render), and the project style mandates function components; classes also block hooks and add overhead. prefer_function_component_diagnostic fires from run() on each qualifying class node.","triggerScenarios":"Thrown at crates/oxc_linter/src/rules/react/prefer_function_component.rs:20 when the library encounters an invalid state.","commonSituations":"See trigger scenarios.","solutions":["Convert the class to a function component using hooks where needed.","Disable the rule for classes that will gain lifecycle logic later."],"exampleFix":null,"handlingStrategy":"validation","validationCode":null,"typeGuard":null,"tryCatchPattern":null,"preventionTips":[],"tags":[],"backgroundTag":null,"analyzedSha":"e1e7af627c8843ab64044ed466b128fcc21a035b","analyzedAt":"2026-08-20T07:01:07.079Z","contentChangedAt":"2026-08-20T07:01:07.079Z","schemaVersion":2},"datasetVersion":"2026-09-14T00:17:10.932Z"}