TypeScript, redux-form and connect

Question

First of all, I am very new to TS, React, and Redux, so sorry if this is an obvious question.

I am trying to modify this example to get a form to upload some information. It uses redux-form .

I'm trying to figure out how to call connectand redux-format the same time when the export component. Now it looks like this:

class UserForm extends React.Component<IUserProps, void> { .. }

export default ReduxForm.reduxForm({
  form: 'user',
  fields: [
    'userName',
    'password',
    'firstName',
    'lastName',
    'email'
  ],
  validate: UserForm.validate,
})(UserForm);

Examples that I saw without TS look like this:

class MyForm extends Component {}
MyForm = reduxForm(config)(MyForm)
MyForm = connect(mapStateToProps, mapDispatchToProps)(MyForm)
export default MyForm

But if I try to do the same in TS, I get error TS2300: duplicate identifier.

I also tried using a decorator @connect, but I could not get it to work (or find any working example on the Internet).

Answer 1

?

class UserForm extends React.Component<IUserProps, void> { .. }

export default connect(mapStateToProps,mapDispatchToProps) 
    (ReduxForm.reduxForm({
  form: 'user',
  fields: [
    'userName',
    'password',
    'firstName',
    'lastName',
    'email'
  ],
  validate: UserForm.validate,
})(UserForm));

Answer 2

, any

connect(mapStateToProps, mapDispatchToProps)(MyForm as any)