import React from 'react';
const {decodeEntities} = wp.htmlEntities;
const {__} = wp.i18n;

class FeaturedImage extends React.Component {
	render() {
		const {post, attributes} = this.props;

		if (attributes.displayPostImage) {
			let img_url = null;
			if (
				undefined !== post.fbg_featured_image_src &&
				attributes.imgSize &&
				post.fbg_featured_image_src[attributes.imgSize]
			) {
				var src = post.fbg_featured_image_src[attributes.imgSize];
				img_url = src[0];
			} else if (attributes.layout === 'text-over') {
				img_url = fgb_blocks_info.default_post_image;
			}
			if (!img_url) {
				img_url = fgb_blocks_info.plugin_url + 'assets/images/no-image.jpg';
			}
			if (img_url) {
				return (
					<div className="flo-block-post-list__image">
						<a href={post.link} rel="noopener noreferrer">
							<img
								src={img_url}
								alt={
									decodeEntities(post.title.rendered.trim()) || __('(Untitled)')
								}
							/>
						</a>
					</div>
				);
			} else {
				return null;
			}
		} else {
			return null;
		}
	}
}

export default FeaturedImage;
