"variable-name" rule for certain instances

[pmonty]

Bug Report

• TSLint version: 5.10.0
• TypeScript version: 2.7.2
• Running TSLint via: vscode

TypeScript code being linted

export const SupportForm = withFormik<IOtherProps, IFormValues>({
  handleSubmit: (values, { props }) => {
    props.supportStore.submitSupportformHandler(values);
  },
  mapPropsToValues: props => {
    return {
      message: '',
      subject: '',
    };
  },
  validationSchema: Yup.object().shape({
    message: Yup.string()
      .required('Message is required!'),
    subject: Yup.string()
      .required('Email is required!'),
  }),
})(BaseForm);

with tslint.json configuration:

{
    "extends": ["tslint:recommended", "tslint-react", "tslint-config-airbnb"],
    "rules": {
        "no-trailing-whitespace": false,
        "object-literal-shorthand": false,
        "trailing-comma": false,
        "quotemark": [true, "single", "jsx-double", "avoid-escape"],
        "jsx-no-lambda": false,
        "jsx-no-multiline-js": false,
        "jsx-wrap-multiline": false,
        "max-line-length": false,
        "variable-name": [true, "check-format", "allow-leading-underscore"],
        "ter-arrow-parens": [ true, "as-needed" ],
        "ter-indent": [ true, 2, { "SwitchCase": 1 } ],
        "import-name": false,
        "no-increment-decrement": false,
        "no-namespace": false,
        "max-classes-per-file": false
    }
}

Actual behavior

So it highlighting SupportForm saying
[tslint] variable name must be in lowerCamelCase or UPPER_CASE (variable-name)

Expected behavior

Would like to have it not complain in cases where the variable is a HoC or Functional Stateless component

[giladgray]

@pmonty you are looking for the "allow-pascal-case" option. PascalCase is the name for "camelCase with a leading uppercase letter."

[pmonty]

@giladgray If I add that option then it allows it everywhere. I need it only for certain sections like Functional components.

[OneCyrus]

we are running in to the same issue. react components should be allowed in PascalCase even when we don't allow them for general variables.

[pronebird]

I believe @giladgray didn't entirely understand the issue because the example is somewhat convoluted and doesn't give a slightest hint that it's about React.

The related issue has been reported here:
palantir/tslint-react#120