// // This is the layout for a service section in the main window. // It does not do anything except for arrange items using css and html. // import React from 'react' import { Button, Glyphicon } from 'react-bootstrap' export default class SectionLayout extends React.Component { static get defaultProps() {return{ icon: null, // icon name buttons: null, // button content status: null, // must be one of: on, off, unknown, wait, disabled, // starting, stopping, failure header: null, // the first line content body: null, // expanded content message: null, // alert content onExpand: null, // callback className: "", style: {} }} constructor(props) { super(props) } render() { let className = ["service-section", this.props.className].join(' ') let statusIcon = null let icon = null let buttons = null let expander = null let body = null let status = this.props.status if (status == "starting") { status = "wait" } else if (status == "stopping") { status = "wait" } else if (status == "failure") { status = "error" } if (this.props.onExpand) { let glyph = this.props.body ? 'triangle-bottom' : 'triangle-right' expander = (
) } else { expander = (
) } if (status) { statusIcon = (
) } if (this.props.icon) { icon = (
) } if (this.props.buttons) { buttons = (
{this.props.buttons}
) } if (this.props.body || this.props.message) { body = (
{this.props.message} {this.props.body}
) } return(
{expander}
{icon}
{this.props.header}
{buttons}
{body}
{statusIcon}
) } }