React type checker creator itself should not be used as a prop type

• REACT_MISUSED_CREATOR_IN_PROP_TYPES
• Error
• Medium
• react

This rule applies when a React type checker creator itself is used as a prop type.

React type checker creator is a function type, so its return value should be used as a prop type.

Type checker creators supported in React are as follows:

1. PropTypes.instanceOf()
2. PropTypes.oneOf()
3. PropTypes.oneOfType()
4. PropTypes.arrayOf()
5. PropTypes.objectOf()
6. PropTypes.shape()

When the above React type checker creator is misused, type checking for the prop is ignored and React outputs a warning message.

Note: This rule is based on React 17 API specifications.

Noncompliant Code Example

import React from 'react';
import PropTypes from 'prop-types';

export class Hello extends React.Component {
  static propTypes = {
    greetInfo: PropTypes.shape // REACT_MISUSED_CREATOR_IN_PROP_TYPES alarm because 'PropTypes.shape' is a type checker creator.
  };
  render() {
    return <div>{this.props.greetInfo.greetName}</div>;
  }
}

Compliant Code Example

import React from 'react';
import PropTypes from 'prop-types';

export class Hello extends React.Component {
  static propTypes = {
    greetInfo: PropTypes.shape({
      greetName: PropTypes.string
    })
  };
  render() {
    return <div>{this.props.greetInfo.greetName}</div>;
  }
}

Version

This rule was introduced in DeepScan 1.6.0-beta.

See

• Typechecking with PropTypes

• React Warning: type specification of prop is invalid; the type checker function must return null or an Error but returned a function. You may have forgotten to pass an argument to the type checker creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and shape all require an argument).