import React from 'react';
import * as ObjUtils from '../../UtilitiesFunctions/objectUtilities';
import Tooltip from '../Tooltip/Tooltip';
import {hostUrls} from '../editAlert/constants';





export default class CommentHistory extends React.Component{

    constructor(props) {
        super(props);
        this.state = {commentHistory: props.commentHistory};
    }

    fileType = (url) => {
        let extension = url.substr(url.length - 3);
        return extension.toLowerCase();
    }

    componentWillReceiveProps(nextProps) {
        if(!ObjUtils.checkDeepEquals(this.props, nextProps)){
            this.setState({
                commentHistory: nextProps.commentHistory
            });
        }

    }


    render(){
        const props = this.props;
        debugger
        return (
            <div>
                {
                    this.state.commentHistory.map((data, i) => {
                        let tooltipText = data.title + "-" + data.department + "-" + data.contactNumber;
                        return (
                            <div className="comment" key={i}>
                                <Tooltip
                                    hoverElement={data.name}
                                    tooltipText={tooltipText}
                                    label={data.name}
                                    className="name-initial"
                                />
                                <div className="comment-data-container">
                                    {
                                        (data.type === "Comment") ?
                                            <p className="comment-content">{data.message}</p>
                                            :
                                            <div className="comment-img-container">
                                                <a href={data.url} target="_blank">
                                                    {
                                                        (this.fileType(data.url) !== 'pdf') ?
                                                            <img src={data.url} className="comment-img"/>
                                                            :
                                                            <img src='https://s3-ap-southeast-1.amazonaws.com/ticketing-documents-prod/1234/pdfIcon.png' // TODO Replace this url with constants{`${hostUrls.CdnUrl}/images/pdf-Icon.png`}
                                                                 className="comment-img"/>
//                                                                                    <i className="material-icons">&#xE415;</i>
                                                    }
                                                </a>
                                                <p className="comment-attachment-label">{data.documentName}</p>
                                            </div>
                                    }
                                    <p className="comment-time">{ObjUtils.dateFormatter(data.timestamp, 'DD MMM, YYYY hh:mm A')}</p>
                                </div>
                            </div>
                        )
                    })
                }
            </div>
        );
    }
}


