61 lines
2.0 KiB
JavaScript
61 lines
2.0 KiB
JavaScript
import React from 'react'
|
|
import { connect } from 'react-redux'
|
|
import { bindActionCreators } from 'redux'
|
|
import { selectShow, addShowToWishlist,
|
|
deleteShowFromWishlist, getShowDetails } from '../../actions/shows'
|
|
|
|
import ListDetails from '../list/details'
|
|
import ListPosters from '../list/posters'
|
|
import ShowButtons from './listButtons'
|
|
|
|
function mapStateToProps(state) {
|
|
return { showsStore: state.showsStore };
|
|
}
|
|
const mapDispatchToProps = (dispatch) =>
|
|
bindActionCreators({ selectShow, addShowToWishlist,
|
|
deleteShowFromWishlist, getShowDetails }, dispatch)
|
|
|
|
class ShowList extends React.Component {
|
|
render() {
|
|
const shows = this.props.showsStore.shows;
|
|
const selectedShowId = this.props.showsStore.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}
|
|
type="shows"
|
|
formModel="showsStore"
|
|
filterControlModel="showsStore.filter"
|
|
filterControlPlaceHolder="Filter shows..."
|
|
exploreOptions={this.props.showsStore.exploreOptions}
|
|
selectedImdbId={selectedShowId}
|
|
filter={this.props.showsStore.filter}
|
|
perPage={this.props.showsStore.perPage}
|
|
onClick={this.props.selectShow}
|
|
router={this.props.router}
|
|
params={this.props.params}
|
|
loading={this.props.showsStore.loading}
|
|
/>
|
|
{selectedShow &&
|
|
<ListDetails data={selectedShow} >
|
|
<ShowButtons
|
|
show={selectedShow}
|
|
deleteFromWishlist={this.props.deleteShowFromWishlist}
|
|
addToWishlist={this.props.addShowToWishlist}
|
|
getDetails={this.props.getShowDetails}
|
|
fetching={this.props.showsStore.getDetails}
|
|
/>
|
|
</ListDetails>
|
|
}
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
export default connect(mapStateToProps, mapDispatchToProps)(ShowList);
|