import React from 'react';
import * as actions from './actions.js';
import { connect } from 'react-redux';
import ReactDatetime from 'react-datetime';

class EndsOnDateTimeWidget extends React.Component {
    render() {
        var yesterday = ReactDatetime.moment().subtract( 1, 'day' );
        var valid = function( current ){
            return current.isAfter( yesterday );
        };
        return (
            <div className="EndsOnDateTimeWidget">
            	<ReactDatetime
                    inputProps ={
                        {
                            placeholder : 'Select date & time to end notification',
                            readOnly : true
                        }
                    }
                    className = 'DatePicker'
                    open = {false}
                    onChange = {(val)=>this.props.handleChangeEndsOnParticularDateTime(val)}
                    value = {this.props.endTimestamp?(new Date(parseInt(this.props.endTimestamp))):null}
                    isValidDate={ valid }
                />
            </div>
        );
    }
};

const mapStateToProps = (state) =>{
    console.log("****** EndsOnDateTimeWidget.js state:", state);
    return {
        endTimestamp : state.get('whenReducer').get('formData').get('endTimestamp')
    }
}

export default connect(mapStateToProps,actions)(EndsOnDateTimeWidget);