--- a/client/src/components/Session.js	Mon Jun 19 11:35:27 2017 +0200
+++ b/client/src/components/Session.js	Mon Jun 19 11:56:06 2017 +0200
@@ -1,67 +1,21 @@
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import { bindActionCreators } from 'redux';
-import { Grid, Row, Col, Panel, FormGroup, ControlLabel, FormControl } from 'react-bootstrap';
+import { Grid, Row, Col } from 'react-bootstrap';
 import '../App.css';
 import Navbar from './Navbar';
 import NoteInput from './NoteInput';
 import NotesList from './NotesList';
+import SessionForm from './SessionForm';
 import * as sessionsActions from '../actions/sessionsActions';
 import * as notesActions from '../actions/notesActions';
-import _ from 'lodash';
 
 class Session extends Component {
 
-  onChange = (e) => {
-    const { name, value } = e.target;
-    const changes = { [name]: value }
-    this.onChangeThrottle(changes);
-  }
-
-  onChangeThrottle = _.debounce((changes) => {
-    this.props.sessionsActions.updateSession(this.props.currentSession, changes);
-  }, 750)
-
   componentDidMount = () => {
     this.props.notesActions.loadNotesBySession({ _id: this.props.match.params.id });
   }
 
-  renderForm() {
-
-    if (!this.props.currentSession) {
-      return (
-        <form></form>
-      )
-    }
-
-    return (
-      <form onSubmit={ e => { e.preventDefault() } }>
-        <FormGroup>
-          <ControlLabel>Title</ControlLabel>
-          <FormControl
-            name="title"
-            defaultValue={ this.props.currentSession.title }
-            onChange={ this.onChange }
-            type="text"
-            placeholder="Enter a title for this session"
-            inputRef={ ref => { this.title = ref; } }
-          />
-        </FormGroup>
-        <FormGroup>
-          <ControlLabel>Description</ControlLabel>
-          <FormControl
-            name="description"
-            componentClass="textarea"
-            defaultValue={ this.props.currentSession.description }
-            onChange={ this.onChange }
-            placeholder="Enter a description for this session"
-            inputRef={ ref => { this.description = ref; } }
-          />
-        </FormGroup>
-      </form>
-    );
-  }
-
   render() {
     return (
       <div>
@@ -70,9 +24,7 @@
           <Grid fluid className="session-notes">
             <Row>
               <Col md={3}>
-                <Panel>
-                  { this.renderForm() }
-                </Panel>
+                <SessionForm session={this.props.currentSession} />
               </Col>
               <Col md={9}>
                 <NotesList notes={this.props.notes} />