60 lines
1.6 KiB
JavaScript
60 lines
1.6 KiB
JavaScript
import React from "react"
|
|
|
|
export default function Stats(props) {
|
|
return (
|
|
<div>
|
|
<h2 className="hidden-xs">Stats</h2>
|
|
<Stat
|
|
name="Movies"
|
|
count={props.stats.get("movies_count")}
|
|
torrentCount={props.stats.get("movies_torrents_count")}
|
|
torrentCountById={props.stats.get("movies_torrents_count_by_id")}
|
|
/>
|
|
<Stat
|
|
name="Shows"
|
|
count={props.stats.get("shows_count")}
|
|
torrentCount={props.stats.get("episodes_torrents_count")}
|
|
torrentCountById={props.stats.get("shows_torrents_count_by_id")}
|
|
/>
|
|
<Stat
|
|
name="Episodes"
|
|
count={props.stats.get("episodes_count")}
|
|
torrentCount={props.stats.get("episodes_torrents_count")}
|
|
torrentCountById={props.stats.get("episodes_torrents_count_by_id")}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function Stat(props) {
|
|
return (
|
|
<div className="col-xs-4">
|
|
<div className="panel panel-default">
|
|
<div className="panel-heading">
|
|
<h3 className="panel-title">
|
|
{props.name}
|
|
<span className="label label-info pull-right">{props.count}</span>
|
|
</h3>
|
|
</div>
|
|
<div className="panel-body">
|
|
<TorrentsStat data={props} />
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function TorrentsStat(props) {
|
|
if (props.data.torrentCount === undefined) {
|
|
return (<span>No torrents</span>);
|
|
}
|
|
|
|
const percentage = Math.floor((props.data.torrentCountById * 100) / props.data.count);
|
|
return (
|
|
<span>
|
|
{percentage}% with torrents
|
|
<small> - {props.data.torrentCount} total</small>
|
|
</span>
|
|
);
|
|
}
|