import React from 'react';
import Ticket from './TicketNotification/Ticket.js';
import './Notification.scss';
import Modal from 'react-modal';
import TripClosureNotification from './TripClosureNotification/TripClosureNotification';
//import Modal from '../../common/modal/modal'


export default class Notifications extends React.Component{

	constructor(props) {
        debugger;
		super(props);
		this.state = {modalOpen: true};
	}

    componentWillReceiveProps(){
        debugger;
        var props = this.props;
    }

	componentDidMount(){
    }

    handleOnClose(){
	    console.log('close', this);
	    // this.setState({modalOpen: false});
	    this.props.onModalClose();
    }

    render(){

    	debugger;
    	const props = this.props;
        let data = props.notificationsArray;
        let noData = (props.notificationsArray.length === 0);
        debugger


    	return (<div className="notification-body-handler">
                    <Modal
                        isOpen={true}
                        content-label="no label"
                        portalClassName="notification-body-handler"
                        onRequestClose={this.handleOnClose.bind(this)}
                    >
                        {
                            !noData ?
                                (
                                    data.map((alert) => {
                                        return (
                                                (alert.alertType === "ticket")?
                                                    <Ticket {...props}  ticketData={alert} onModalOpen = {this.props.onModalOpen}/>
                                                :
                                                    (
                                                        (alert.alertType === "tripClosure")?
                                                            <TripClosureNotification
                                                                notificationData = {alert}
                                                                tripClosureFields = {props.tripClosureFields}
                                                                onNotificationClick={this.props.onNotificationClick?this.props.onNotificationClick:null}
                                                                onModalClose={this.props.onModalClose}
                                                            />
                                                            :(alert.alertType === 'tds') ?
                                                            <TripClosureNotification
                                                                notificationData = {alert}
                                                                tripClosureFields = {props.tdsFields}
                                                                onNotificationClick={this.props.onNotificationClick?this.props.onNotificationClick:null}
                                                                onModalClose={this.props.onModalClose}
                                                            /> : null
                                                    )
                                        )
                                    })
                                )

                                :
                                (
                                    <div className="no-data"> You do not have any notifications !! </div>
                                )
                        }
                    </Modal>
                </div>
                
    		);

    	}
    }	

    