no-unused-prop-types false errors

[cristian-sima]

For this code:

type renderInputPropTypes = {
  input: any;
  label: string;
  autoFocus?: boolean;
  meta: {
    touched: boolean;
    error?: string;
  }
};

// --- end types

import { Field, reduxForm } from "redux-form/immutable";
import React from "react";

const renderInput = ({
  input,
  label,
  autoFocus,
  meta: { touched, error },
} : renderInputPropTypes) => {

  return (
    {'... here I use all the props'}
  );
}

I use this plugin to convert the FlowJS types to React Prop Types:

When I run eslint I get:

W:\go-workspace\src\github.com\cristian-sima\cube\client\components\Account\ChangePassword\Form.jsx
  10:14  error  'meta.touched' PropType is defined but prop is never used  react/no-unused-prop-types
  11:13  error  'meta.error' PropType is defined but prop is never used    react/no-unused-prop-types

I got the same problem for every property of an object when I define it as objects, even if I really use the props

[rhalff]

Have a similar problem in a different context, when this.props is destructured it does not detect the property.

import React, { Component, PropTypes } from 'react'

export default class MenuSlice extends Component {
  static propTypes = {
    positions: PropTypes.shape({
      IconX: PropTypes.number.isRequired,
    }).isRequired
  }

  renderLabel() {
    const { positions } = this.props

    const sliceIconTextOptions = {
      x: positions.IconX // not detected
      // x: this.props.positions.IconX (validates correctly)
    }

    return (
      <div {...sliceIconTextOptions} />
    )
  }

  render() {
    return (
      <div>
        {this.renderLabel()}
      </div>
    )
  }
}

[MoOx]

I just enabled this rule and I am getting a lot of false alarms.

[nwikstrand]

Same here:

'bar.baz' PropType is defined but prop is never used react/no-unused-prop-types

Failing example with deconstructed props:

const Foo = ({ bar }) => (
  <div>
    {bar.baz}
  </div>
);

Foo.propTypes = {
  bar: React.PropTypes.shape({
    baz: React.PropTypes.string,
  }),
};

Working example with non deconstructed props:

const Foo = (props) => (
  <div>
    {props.bar.baz}
  </div>
);

Foo.propTypes = {
  bar: React.PropTypes.shape({
    baz: React.PropTypes.string,
  }),
};

[EvHaus]

The no-unused-prop-types rule does not support shape props at the moment as such detection is very difficult. If you use shape props, I recommend setting the skipShapeProps option to true on the rule.

Duplicate of #819. Will track further discussion of shape props there.