Eslint-plugin-react: ES6 React Map Prop Validation

[Palgie]

In the below example I receive three missing in props validation for products.title products and products.description however it feels like these aren't actually needed to be explicitly declared.

import radium from 'radium';
import React, { Component, PropTypes } from 'react';
import Button from '../../containers/buttonContainer';
import styles from './ProductsList.styles.js';

class ProductsList extends Component {

  static propTypes = {
    model: PropTypes.object.isRequired,
  };

  renderListItem({ title, description }) {
    return (
      <div style={[styles.base]}>
        <a href="#">{title}</a>
        <p>{description}</p>
      </div>
    );
  }

  render() {
    return (
      <div id="productsListContainer">
        <Button kind="primary">Primary</Button>
        <Button kind="secondary">Secondary</Button>
        <Button kind="warning">Warning</Button>
        <ul>
          {this.props.model.products.map(this.renderListItem)}
        </ul>
      </div>
    );
  }
}

export default radium(ProductsList);

Is this error correct I'm getting correct?

eslint-plugin-react ^4.2.3

[ljharb]

Of course they need to be explicitly declared. However, why not pass products directly? You don't want to be providing too much access/responsibility to components.

[Palgie]

@ljharb I shall and agreed on the responsibility comment this is a WIP or POC component that's getting trashed.

Excuse any naivety but why is explicit type declaration needed when this.props.model is defined as an object?

[Palgie]

Closing. Just found the answer in React.PropTypes.shape. Thanks @ljharb.

[ljharb]

@Palgie it should instead be defined as a shape with every referenced property explicitly denoted with a PropType.