no-unused-props

Full Name in eslint-plugin-react-x

react-x/no-unused-props

Full Name in @eslint-react/eslint-plugin

@eslint-react/no-unused-props

Description

Warns about unused component prop declarations.

Unused props increase maintenance overhead and may mislead consumers of the component into thinking the prop is required or meaningful, even when it has no effect.

This is the TypeScript-only version of eslint-plugin-react/no-unused-prop-types. In contrast to the original rule, this rule

doesn't support the legacy propTypes syntax
combines the used props of one type definition declared by multiple components

Examples

Failing

interface Props {
  abc: string; // used
  hello: string; // NOT used
}

function Component(props: Props) {
  const { abc } = props; // `hello` isn't accessed from `props`
  return null;
}

Passing

interface Props {
  abc: string; // used
  hello: string; // used
}

function Component(props: Props) {
  const { abc, hello } = props;
  return null;
}

interface Props {
  abc: string; // used by Component1
  hello: string; // used by Component2
}

function Component1({ abc }: Props) {
  return null;
}

function Component2({ hello }: Props) {
  return null;
}

Description

Examples

Failing

Passing

Implementation

See Also

On this page