import { h, Component } from 'preact'
import { bindActionCreators } from 'redux'
import { connect } from 'react-redux'

class TaskList extends Component {
  constructor(props){
    super()
  }
  render(){
    const { title, tasks } = this.props
    let time = 0
	  const taskList = tasks.map(task => {
	    const eta = (time + (task.epochs) * 180 / 60) + " min."
	    time += (task.epochs) * 180 / 60
	    let dataset_type, dataset_name 
	    if (task.dataset.indexOf('/') !== -1) {
	    	[dataset_type, dataset_name] = task.dataset.split('/')
	    } else {
	    	dataset_name = task.dataset
	    }
	   	return (
		   	<div class='row'>
	        <div class='activity'>{task.activity} {task.library} {dataset_type}</div>
	        <div class='dataset'>{dataset_name}</div>
	        <div class='epochs'>{task.epochs} ep.</div>
	        <div class='eta'>{eta}</div>
		   	</div>
	   	)
	  })
	  return (
	  	<div class='taskList rows'>
	  		{taskList}
	  	</div>
  	)
  }
}

const mapStateToProps = state => ({
})

const mapDispatchToProps = (dispatch, ownProps) => ({
  // actions: bindActionCreators(liveActions, dispatch)
})

export default connect(mapStateToProps, mapDispatchToProps)(TaskList)