import React from "react";
import { Link } from "react-router-dom";
import localImgLoad from "../../lib/localImgLoad";

export default function HomeBannerOffersCard(props) {
    console.log("HomeBannerOffersCard-> ##->",props)
    const link_result = "/" + props.itemData.link_path;
    var imgUrl = props.itemData.banner; //  ? this.state.nextImgSrc : this.state.song.imgSrc;
    console.log("IMAGE FOR BANNER->",imgUrl);
    var divStyle = {
        backgroundImage: 'url(' + imgUrl + ')'
    }
    var linkDivStyle = "item w-full block group banner-630-340 " + divStyle;


    return (
        <Link
            to={link_result}
            className={linkDivStyle}
        >
            <div className="flex flex-col justify-between h-full">
                <div className="content flex justify-between items-center mb-5">
                    <div className="siderCardHeader">
                        <h1 className="text-2xl font-bold text-dark-gray dark:text-white tracking-wide">
                            <>{props.itemData.title}</>
                        </h1>
                    </div>
                    {/*<SelectBox datas={filterDatas} action={dataSetHandler} />*/}
                </div>
                <div className="h-[233px]">
                    <div className="siderCardDescription">
                       {props.itemData.description}
                    </div>
                    <div className="siderCardButton">
                        [BUTTON HERE]
                    </div>
                </div>

            </div>
        </Link>
    );
}