import { Actions as KafkaActions } from 'redux-lenses-streaming';

class Connect extends React.Component {

...

onConnectClick() {
    const { connection } = this.props;
    const { authRequired } = this.state;

    if (connection) {
      this.props.disconnect();
    } else if (authRequired) {
      const options = {
        host: this.props.host,
        clientId: this.props.clientId,
        user: this.props.user,
        password: this.props.password,
      };
      this.props.connect(options);
    } else {
      const options = {
        host: this.props.host,
        clientId: this.props.clientId,
      };
      this.props.connect(options);
    }
  }

  onLogin() {
    const options = {
      user: this.props.user,
      password: this.props.password,
    };
    this.props.login(options);
  }
}

const mapDispatchToProps = dispatch => ({
  connect: (option) => {
    dispatch(KafkaActions.connect(option));
  },
  disconnect: () => {
    dispatch(KafkaActions.disconnect());
  },
  login: (option) => {
    dispatch(KafkaActions.login(option));
  },
});

export default connect(mapStateToProps, mapDispatchToProps)(Connect);