1import React, { Component } from 'react';
2import styled from 'styled-components';
3
4class Item extends React.Component {
5 constructor(props) {
6 super(props);
7 this.toggle= this.toggle.bind(this);
8 this.state = {
9 details: false
10 }
11 }
12 toggle(){
13 const currentState = this.state.details;
14 this.setState({ details: !currentState });
15 }
16
17 render() {
18 return (
19 <tr className="Item">
20 <td>{this.props.config.server}</td>
21 <td>{this.props.config.verbose}</td>
22 <td>{this.props.config.type}</td>
23 <td className={this.state.details ? "visible" : "hidden"}>PLACEHOLDER MORE INFO</td>
24 {<td><span onClick={this.toggle()}>Details</span></td>}
25 </tr>
26 )}
27}
28
29export default Item;