import Link from 'next/link';
import AudioPlayer from "react-h5-audio-player";
import 'react-h5-audio-player/lib/styles.css';

const LatestEpisodes = ({ episodedata, config }) => (
    <div className="featured_episodes">
        <h1>Latest Episodes</h1>
        <ul className="no-style">
        {episodedata.episodes.map((episode) =>(
            <li className="col-xs-12 col-md-4 col-lg-4">
                <div className="show_block">
                    <div className="feature_show_title">
                        <Link href={"/podcasts/shows/"+episode.show_slug} >
                            {episode.show}
                        </Link>
                    </div>
                    <div className="ep-title">{episode.title}</div>
                    <AudioPlayer
                        src={config.audio_path + episode.audio_mp3}
                        />
                </div>
            </li>
        ))}
        </ul>

    </div>
);

export default LatestEpisodes