import React, { Component } from 'react';

import {removeOtherComponentOptions} from 'utils/ioty'

export default class ComponentsList extends Component {

	constructor (props) {
		super (props);
		this.componentSelectionHandler = this.componentSelectionHandler.bind(this);
	}

	componentSelectionHandler (e) {
		// this.props.IoTyActions.selectComponent(e.target.value);
		// console.log(e.target.value);
		removeOtherComponentOptions(e.target.value, this.props.newCircuitData)
	}
	render() {
		let renderComponentSelectionBox = [];
		let {components, disabled} = this.props;
		if (typeof components !== undefined && components !== null) {
			renderComponentSelectionBox = components.map(function (component, index) {
				return (
					<option value={component.componentId} key={index}>{component.componentName}</option>
				);
			}, this);
		}
		return (
			<select onChange={this.componentSelectionHandler} disabled={disabled}>
				<option value='IoTyvLabcomponent' key='defaultValue0'>components</option>
				{renderComponentSelectionBox}
			</select>
		);
	}
}
