react/prop-types false positive when using props to access array element

[Justkant]

Hi everything is here:

[ljharb]

I don't see the propTypes for Setup?

also, please provide code in text form, instead of screenshots :-)

[Justkant]

Hi,

1. I understand that you prefere text instead of screenshots. It was just for saving time at work.

2. You have no need to see the propTypes for Setup because this is not the problem.

3. As you can see in the screenshot Left & Right are both destructured from steps not from props.

Code:

const steps = [
  {
    Left: Component1,
    Right: Component2,
  },
];

const Setup = props => {
  const { Left, Right } = steps[props.current];
  return (
    <div className={style.container}>
      <Left {...props} />
      <Right {...props} />
    </div>
  );
};

Setup.propTypes = {
  current: PropTypes.number.isRequired,
};

[Justkant]

Tomorrow, I'll try this:

const Setup = props => {
  const current = props.current;
  const { Left, Right } = steps[current];
  return (
    <div className={style.container}>
      <Left {...props} />
      <Right {...props} />
    </div>
  );
};

To confirm that the problem occurs when using some props as an index key and destructuring.

[ljharb]

I definitely think that const { current } = props; will fix it, but thanks, I think this makes the bug clear :-)