`props => props.borderRadius` should not trigger `react/destructuring-assignment`

[dexteryy]

props => <div id={props.id} /> should be considered to a stateless component, props => props.borderRadius should not

For example:

import styled from 'react-emotion'

const ButtonWrapperDiv = styled.div`
  & .s-common-button {
    border-radius: ${props => props.borderRadius}px;
    background: ${props => props.backgroundColor};
    color: ${props => props.textColor};
    &:hover {
      background: ${props => props.hoverBackgroundColor};
    }
  }

BTW, it's better to provide an option to allow one line stateless component to use props directly.

For example:

const ComonentA = props => <div id={props.id} />

or

function ComonentA(props) { return <div id={props.id} /> }

Otherwise it will be too complicated:

const ComonentA = props => { const { id } = props; return <div id={id} /> }

[ljharb]

Use destructuring:

function ComponentA({ id }) { return <div id={id} /> }

[ljharb]

Separately, what considers props => props.borderRadius an SFC? Can you elaborate?

[dexteryy]

[ljharb]

aha, thank you :-)

This is definitely a bug, as that rule should be using our component detection, and is not.

[alexzherdev]

Looks like it is now but it's not consulting the confidence level. These little components are being detected, but their confidence is 0.
I found that there is only one rule that makes use of the confidence value 🙁

[alexzherdev]

Although this test would require checking for confidence of 1 to pass
https://github.com/yannickcr/eslint-plugin-react/blob/05d781b7156fae381578eef5a8c67502e336b3ae/tests/lib/rules/destructuring-assignment.js#L231-L239

[ljharb]

If we change the detection helper itself to not fire for a confidence level of zero, do any tests fail?

[alexzherdev]

I'm seeing that Components.list() only returns those with confidence of 2, whereas Components.get(node) returns a component without consideration for the confidence.
Not sure if we need to change that. But I did go ahead and made Components.get only return the component if its confidence is at least 1, and no tests failed.

[ljharb]

That seems like it would be an improvement.