116 lines
2.7 KiB
JavaScript
116 lines
2.7 KiB
JavaScript
import React from "react"
|
|
|
|
import { OverlayTrigger, Tooltip } from "react-bootstrap"
|
|
|
|
export default function Modules(props) {
|
|
return (
|
|
<div>
|
|
<h2>Modules</h2>
|
|
{props.modules && props.modules.keySeq().map(function(value, key) {
|
|
return (
|
|
<ModulesByVideoType
|
|
key={value}
|
|
videoType={value}
|
|
data={props.modules.get(value)}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function capitalize(string) {
|
|
return string.charAt(0).toUpperCase() + string.slice(1);
|
|
}
|
|
|
|
function ModulesByVideoType(props) {
|
|
return (
|
|
<div className="col-md-6 col-xs-12">
|
|
<div className="panel panel-default">
|
|
<div className="panel-heading">
|
|
<h3 className="panel-title">
|
|
{capitalize(props.videoType)} {/* Movie or Show */}
|
|
</h3>
|
|
</div>
|
|
<div className="panel-body">
|
|
{props.data.keySeq().map(function(value, key) {
|
|
return (
|
|
<ModuleByType
|
|
key={value}
|
|
type={value}
|
|
data={props.data.get(value)}
|
|
/>
|
|
);
|
|
})}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function ModuleByType(props) {
|
|
return (
|
|
<div className="col-md-3 col-xs-6">
|
|
<h4>{props.type} {/* Detailer / Explorer / ... */}</h4>
|
|
<table className="table">
|
|
<tbody>
|
|
{props.data.map(function(value, key) {
|
|
return (
|
|
<Module
|
|
key={key}
|
|
type={key}
|
|
data={value}
|
|
/>
|
|
);
|
|
})}
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
function Module(props) {
|
|
var iconClass, prettyStatus, labelClass
|
|
|
|
switch(props.data.get("status")) {
|
|
case "ok":
|
|
iconClass = "fa fa-check-circle"
|
|
labelClass = "label label-success"
|
|
prettyStatus = "OK"
|
|
break;
|
|
case "fail":
|
|
iconClass = "fa fa-times-circle"
|
|
labelClass = "label label-danger"
|
|
prettyStatus = "Fail"
|
|
break;
|
|
case "not_implemented":
|
|
iconClass = "fa fa-question-circle"
|
|
labelClass = "label label-default"
|
|
prettyStatus = "Not implemented"
|
|
break;
|
|
default:
|
|
iconClass = "fa fa-question-circle"
|
|
labelClass = "label label-warning"
|
|
prettyStatus = "Unknown"
|
|
}
|
|
|
|
const tooltip = (
|
|
<Tooltip id={`tooltip-status-${props.name}`}>
|
|
<p><span className={labelClass}>Status: {prettyStatus}</span></p>
|
|
<p>Error: {props.data.get("error")}</p>
|
|
</Tooltip>
|
|
);
|
|
return (
|
|
<tr>
|
|
<th>{props.data.get("name")}</th>
|
|
<td>
|
|
<OverlayTrigger placement="right" overlay={tooltip}>
|
|
<span className={labelClass}>
|
|
<i className={iconClass}></i> {prettyStatus}
|
|
</span>
|
|
</OverlayTrigger>
|
|
</td>
|
|
</tr>
|
|
);
|
|
}
|