54 lines
1.6 KiB
JavaScript
54 lines
1.6 KiB
JavaScript
import React from 'react'
|
|
import { Link } from 'react-router'
|
|
|
|
import ListDetails from '../list/details'
|
|
import ListPosters from '../list/posters'
|
|
|
|
function ShowButtons(props) {
|
|
const imdbLink = `http://www.imdb.com/title/${props.show.imdb_id}`;
|
|
return (
|
|
<div className="list-details-buttons btn-toolbar">
|
|
<a type="button" className="btn btn-warning btn-sm" href={imdbLink}>
|
|
<i className="fa fa-external-link"></i> IMDB
|
|
</a>
|
|
<Link type="button" className="btn btn-primary btn-sm" to={"/shows/details/" + props.show.imdb_id}>
|
|
<i className="fa fa-external-link"></i> Details
|
|
</Link>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default class ShowList extends React.Component {
|
|
componentWillMount() {
|
|
this.props.fetchShows(this.props.showsUrl);
|
|
}
|
|
render() {
|
|
const shows = this.props.showStore.shows;
|
|
const selectedShowId = this.props.showStore.selectedImdbId;
|
|
let index = shows.map((el) => el.imdb_id).indexOf(selectedShowId);
|
|
if (index === -1) {
|
|
index = 0;
|
|
}
|
|
const selectedShow = shows[index];
|
|
return (
|
|
<div className="row" id="container">
|
|
<ListPosters
|
|
data={shows}
|
|
formModel="showStore"
|
|
controlModel="showStore.filter"
|
|
controlPlaceHolder="Filter shows..."
|
|
selectedImdbId={selectedShowId}
|
|
filter={this.props.showStore.filter}
|
|
perPage={this.props.showStore.perPage}
|
|
onClick={this.props.selectShow}
|
|
/>
|
|
{selectedShow &&
|
|
<ListDetails data={selectedShow} >
|
|
<ShowButtons show={selectedShow} />
|
|
</ListDetails>
|
|
}
|
|
</div>
|
|
);
|
|
}
|
|
}
|