import React, {Component} from 'react';
import {connect} from 'react-redux';
import {cartTexts} from '../../../constants/cartConstants';
import {setDialogOpenFlag, setDialogContent} from '../../../actions/dialog/dialogActions';
import BidsList from './BidsList.jsx';
import '../style/PacakgeBids.css';

class PackageBids extends Component {
    constructor(props){
        super(props);

        this.openDialog = this.openDialog.bind(this);
    }

    openDialog(){
        const dialogContent = {
            header: cartTexts.labels.AVAILABLE_BIDS,
            TagName: BidsList,
            class: 'bid-dialog',
            hasCloseIcon: true,
            params: {
                bids: this.props.bids,
                idCart: this.props.idCart,
                idSelectedBid: this.props.idSelectedBid
            }
        };

        this.props.dispatch(setDialogOpenFlag(true));
        this.props.dispatch(setDialogContent(dialogContent));
    }

    render() {
        const {bids} = this.props;
        return (
            <div id="cart-bids" className="cart-bids ">
                {
                    bids && bids.length > 0 &&
                    <span onClick={this.openDialog} className="cart-bids-text">
                        {cartTexts.labels.BID_AVAILABLE}
                        {' '}<span className="fa fa-arrow-circle-left"></span>
                    </span>
                }
        </div>);
    }
}

export default connect()(PackageBids);
