import React, { Component } from 'react'
import { connect }            from 'react-redux'
import {bindActionCreators} from 'redux'
import {BasicSqli} from 'components'
import {VLCommonActions} from 'redux/modules/actions/VLCommon'
import {LearningCardActions} from 'redux/modules/actions/LearningCardActions'

const mapStateToProps = (state) => ({
  attack : state.attack,
  learningCardsInfo : state.learningCardState
});
const mapDispatchToProps = (dispatch) => ({
  VLCommonActions: bindActionCreators(Object.assign({}, VLCommonActions), dispatch),
  learningCardActions: bindActionCreators(Object.assign({}, LearningCardActions), dispatch)
});

export class BasicSQLiView extends Component {
  constructor (props) {
    super(props)
  }
  render() {
    // console.log('BasicSQLiView props', this.props.learningCardsInfo);
    return (
      <div>
        <BasicSqli
          attack={this.props.attack}
          learningCards={this.props.learningCardsInfo.learningCards}
          learningCardActions={this.props.learningCardActions}
          VLCommonActions={this.props.VLCommonActions}/>
      </div>
    )
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(BasicSQLiView)
