
import React from 'react';
import { Col ,Row , Input} from 'react-materialize';
import Modularity from 'modularity-front';
import Menu from '@material-ui/core/Menu';
import { FormControl, Select, InputLabel, MenuItem } from '@material-ui/core/';
import { withStyles } from '@material-ui/core/styles';
import './Filter.css';


const Module = Modularity.Module;



class DropDownFilter extends Modularity.Module {
	constructor(props){
		super(props);
	    this.state = {
	      ...props.filter,
	      value: this.getFilterValue() || props.filter.value || ''
	    }
	}

	getFilterValue() {
		let options = this.filter.value.options;
		let array = Object.keys(options || {});
    	for (var key in array) {
    		if(options[array[key]] === this.props.defaultValue) {
	    		return array[key];
    		}
    	}
    	return false;
	}


	checkFilter = (e) =>{
		let values = [e.target.value];
		
		this.setState({value:e.target.value});
		this.Filters.set({...this.state,values});
		console.log("sss",this.Filters)
  	}

	render(){
		let options;
		if(this.filter.value.length) { // if array make labels and values same
	        let array = this.filter.value.options;
	        options = array.map((option,index)=> <MenuItem  value={option} key={index}>{option}</MenuItem>)
	    } else { // if json make values the keys of json and labels the values of json
	        let array = Object.keys(this.filter.value.options || {})
	        options = array.map((key,index)=> <MenuItem  value={key} key={index}>{this.filter.value.options[key]}</MenuItem>)
	    }
		return(
			<div className="flex-item">
         		<FormControl style={{
				    minWidth: 120,
				    width: "100%",
				    marginBottom: 8
				  }}>
			        <InputLabel >{this.filter.value.name}</InputLabel>
			        <Select value={this.state.value} onChange={(e) => this.checkFilter(e)}>
			        	{!this.filter.value.required && <MenuItem value="None">None</MenuItem>}
		           		{options}
		          	</Select>
        		</FormControl>
	    	</div>
		)
	}
}

DropDownFilter.Inputs = {
      filter:{
        type:Module.Types.Object,

      }
}

DropDownFilter.Outputs = {
      Filters:{

      }
}
DropDownFilter.Category = 'sxoinas'



export default DropDownFilter;
