- render() {
- return (
- <div>
- <span id="status_clds" className="status_title">Status:
- <span className="status"> TestStatus </span>
- </span>
-
- <div className="status_table">
- <Table striped hover>
- <thead>
- <tr>
- <th><span align="left" className="text">ComponentState</span></th>
- <th><span align="left" className="text">Description</span></th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td className="row_30_per">long test State</td>
- <td className="row_70_per">test description very very very long description</td>
- </tr>
- </tbody>
- </Table>
- </div>
- </div>
- );
- }
+ state = {
+ loopCache: new LoopCache({}),
+ }
+
+ constructor(props) {
+ super(props);
+ this.renderStatus = this.renderStatus.bind(this);
+ this.state.loopCache = props.loopCache;
+ }
+
+
+ renderStatus() {
+ if (this.state.loopCache.getComponentStates() != null) {
+ return Object.keys(this.state.loopCache.getComponentStates()).map((key) => {
+ console.debug("Adding status for: ",key);
+ var res={}
+ res[key]=this.state.loopCache.getComponentStates()[key];
+ return (<TableRow statusRow={{'componentName':key,'stateName':this.state.loopCache.getComponentStates()[key].componentState.stateName,'description':this.state.loopCache.getComponentStates()[key].componentState.description}} />)
+ })
+
+ }
+ }
+
+ shouldComponentUpdate(nextProps, nextState) {
+ return this.state.loopCache !== nextState.loopCache;
+ }
+
+ componentWillReceiveProps(newProps) {
+ this.setState({
+ loopCache: newProps.loopCache,
+ });
+ }
+
+ render() {
+ return (
+ <LoopStatusViewDivStyled>
+ <label>Loop Status: {this.state.loopCache.getComputedState()}
+ </label>
+
+ <div >
+ <TableStyled striped hover variant responsive>
+ <thead>
+ <tr>
+ <th><span align="left">Component Name</span></th>
+ <th><span align="left">Component State</span></th>
+ <th><span align="right">Description</span></th>
+ </tr>
+ </thead>
+ <tbody>
+ {this.renderStatus()}
+ </tbody>
+ </TableStyled>
+ </div>
+ </LoopStatusViewDivStyled>
+ );
+ }