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

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

class VLLevelsView extends Component {
	constructor (props) {
		super(props);
	}

	componentDidMount() {
		let requestObject = {
			vlqSetId : 1	//hardcoded setId
		}
		this.props.VLCommonActions.getVLQIdsForVLQSetAPI(requestObject)
	}

	render() {
		return (
			<div>
				<div className="spinner absolute"><img className="loading-icon" src='/images/Loading.png'/></div>

				<VLLevelsList 
					vlLevels={this.props.attack.vlLevels}/>
			</div>
		);
	}
}

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