62 lines
1.7 KiB
JavaScript

import React from 'react'
export default function ListDetails(props) {
let genres;
if (props.data.genres) {
// Uppercase first genres
genres = props.data.genres.map(
(word) => word[0].toUpperCase() + word.substr(1)
).join(', ');
}
let wishlistStr = "";
if (props.data.wishlisted === true) {
wishlistStr = "Wishlisted";
}
if (props.data.tracked_episode !== null && props.data.tracked_season != null) {
let season = props.data.tracked_season;
let episode = props.data.tracked_episode;
if ((season === 0) && (episode === 0)) {
wishlistStr = "Whole show tracked";
} else {
wishlistStr = `Tracked from season ${season} episode ${episode}`;
}
}
return (
<div className="col-xs-7 col-md-4">
<div className="affix">
<h1 className="hidden-xs">{props.data.title}</h1>
<h3 className="visible-xs">{props.data.title}</h3>
{wishlistStr !== "" &&
<span className="label label-default">
<i className="fa fa-bookmark"></i> {wishlistStr}
</span>
}
<h4>{props.data.year}</h4>
{props.data.runtime &&
<p>
<i className="fa fa-clock-o"></i>
&nbsp;{props.data.runtime} min
</p>
}
{props.data.genres &&
<p>
<i className="fa fa-tags"></i>
&nbsp;{genres}
</p>
}
<p>
<i className="fa fa-star-o"></i>
&nbsp;{Number(props.data.rating).toFixed(1)}&nbsp;
{props.data.votes &&
<small>({props.data.votes} counts)</small>
}
</p>
<p className="plot">{props.data.plot}</p>
</div>
{props.children}
</div>
);
}