Remove the torrents store from the global scope

This commit is contained in:
Grégoire Delattre 2017-05-21 19:32:01 +02:00
parent 20c37e39ca
commit e3849d5fd3
2 changed files with 75 additions and 60 deletions

View File

@ -45,7 +45,7 @@ function mapStateToProps(state) {
movieStore: state.movieStore,
showStore: state.showStore,
userStore: state.userStore,
torrentStore: state.torrentStore,
torrentCount: state.torrentStore.torrents.length,
alerts: state.alerts,
}
}
@ -60,7 +60,7 @@ function Main(props) {
<NavBar
username={props.userStore.username}
router={props.router}
torrentCount={props.torrentStore.torrents.length}
torrentCount={props.torrentCount}
/>
<Alert
alerts={props.alerts}

View File

@ -1,15 +1,27 @@
import React from 'react'
import { connect } from 'react-redux'
import { bindActionCreators } from 'redux'
import { addTorrent } from '../../actions/actionCreators'
export default function TorrentList(props){
function mapStateToProps(state) {
return { torrents: state.torrentStore.torrents };
}
const mapDispatchToProps = (dipatch) =>
bindActionCreators({ addTorrent }, dipatch)
class TorrentList extends React.PureComponent {
render() {
return (
<div>
<AddTorrent func={props.addTorrent} />
<List torrents={props.torrentStore.torrents} />
<AddTorrent func={this.props.addTorrent} />
<List torrents={this.props.torrents} />
</div>
);
}
}
export default connect(mapStateToProps, mapDispatchToProps)(TorrentList);
class AddTorrent extends React.Component {
class AddTorrent extends React.PureComponent {
constructor(props) {
super(props);
this.state = { url: '' };
@ -53,8 +65,9 @@ class AddTorrent extends React.Component {
}
}
function List(props){
if (props.torrents.length === 0) {
class List extends React.PureComponent {
render() {
if (this.props.torrents.length === 0) {
return (
<div className="row">
<div className="col-xs-12 col-md-12">
@ -70,7 +83,7 @@ function List(props){
<div className="row">
<div className="col-xs-12 col-md-12">
<h3>Torrents</h3>
{props.torrents.map(function(el, index) {
{this.props.torrents.map(function(el, index) {
return (
<Torrent key={index} data={el} />
);
@ -79,26 +92,27 @@ function List(props){
</div>
);
}
}
function Torrent(props){
const done = props.data.is_finished;
class Torrent extends React.PureComponent {
render() {
const done = this.props.data.is_finished;
var progressStyle = 'progress-bar progress-bar-warning';
if (done) {
progressStyle = 'progress-bar progress-bar-success';
}
var percentDone = props.data.percent_done;
var percentDone = this.props.data.percent_done;
const started = (percentDone !== 0);
if (started) {
percentDone = Number(percentDone).toFixed(1) + '%';
}
var downloadedSize = prettySize(props.data.downloaded_size);
var totalSize = prettySize(props.data.total_size);
var downloadRate = prettySize(props.data.download_rate) + "/s";
var downloadedSize = prettySize(this.props.data.downloaded_size);
var totalSize = prettySize(this.props.data.total_size);
var downloadRate = prettySize(this.props.data.download_rate) + "/s";
return (
<div className="panel panel-default">
<div className="panel-heading">{props.data.name}</div>
<div className="panel-heading">{this.props.data.name}</div>
<div className="panel-body">
{started &&
<div className="progress progress-striped">
@ -120,6 +134,7 @@ function Torrent(props){
</div>
);
}
}
function prettySize(fileSizeInBytes) {
var i = -1;