--- a/client/src/components/SessionForm.js Thu Aug 03 17:33:00 2017 +0200
+++ b/client/src/components/SessionForm.js Thu Aug 03 19:11:06 2017 +0200
@@ -1,17 +1,18 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
-import { Panel, FormGroup, ControlLabel, FormControl } from 'react-bootstrap';
-import GroupForm from './GroupForm';
+import { Panel, FormGroup, ControlLabel, FormControl, Collapse } from 'react-bootstrap';
import '../App.css';
import * as sessionsActions from '../actions/sessionsActions';
import * as authActions from '../actions/authActions';
import _ from 'lodash';
+import './SessionForm.css';
class SessionForm extends Component {
state = {
- createGroup: false
+ createGroup: false,
+ protocolOpen: false
}
onChange = (e) => {
@@ -38,6 +39,13 @@
}
}
+ toggleProtocol = (e) => {
+ e.preventDefault();
+ this.setState({
+ protocolOpen: !this.state.protocolOpen
+ });
+ }
+
render() {
if (!this.props.currentSession) {
@@ -71,18 +79,13 @@
</FormGroup>
<FormGroup>
<ControlLabel>Group</ControlLabel>
- <FormControl
- name="group"
- componentClass="select"
- value={ this.props.group ? this.props.group.get('name') : '' }
- onChange={ this.onGroupChange }>
- { this.props.groups.map((group, key) =>
- <option key={ key } value={ group.get('name') }>{ group.get('name') }</option>
- ) }
- </FormControl>
+ <p>{this.props.currentSession.group}</p>
</FormGroup>
- <FormGroup>
- <GroupForm session={this.props.session} />
+ <FormGroup>
+ <ControlLabel onClick={this.toggleProtocol}>Protocol {this.state.protocolOpen?<span className="material-icons protocol-toggle"></span>:<span className="material-icons protocol-toggle"></span>}</ControlLabel>
+ <Collapse in={this.state.protocolOpen}>
+ <pre>{JSON.stringify(this.props.currentSession.protocol, null, 2)}</pre>
+ </Collapse>
</FormGroup>
</form>
</Panel>