Introduce adding note on "enter" key.
--- a/client/src/components/NoteInput.js Tue Jun 20 16:08:12 2017 +0200
+++ b/client/src/components/NoteInput.js Tue Jun 20 17:54:02 2017 +0200
@@ -1,12 +1,11 @@
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
-import { Form, FormControl, Button, Label, Row, Col, Panel } from 'react-bootstrap';
+import { Form, FormControl, Button, Label } from 'react-bootstrap';
import moment from 'moment';
import PropTypes from 'prop-types';
import SlateEditor from './SlateEditor';
-import Clock from './Clock'
import * as notesActions from '../actions/notesActions';
class NoteInput extends Component {
@@ -67,19 +66,9 @@
render() {
return (
<Form>
- <Panel>
- <Row>
- <Col md={6}>
- { this.renderTiming() }
- </Col>
- <Col md={6} className="text-right">
- <Clock />
- </Col>
- </Row>
- </Panel>
<div className="editor">
<div className="editor-left">
- <SlateEditor ref="editor" onChange={this.onEditorChange} />
+ <SlateEditor ref="editor" onChange={this.onEditorChange} onEnterKeyDown={this.onAddNoteClick} />
</div>
<div className="editor-right">
<FormControl
--- a/client/src/components/SlateEditor.js Tue Jun 20 16:08:12 2017 +0200
+++ b/client/src/components/SlateEditor.js Tue Jun 20 17:54:02 2017 +0200
@@ -196,6 +196,15 @@
*/
onKeyDown = (e, data, state) => {
+
+ if (data.key === 'enter') {
+ if (typeof this.props.onEnterKeyDown === 'function') {
+ e.preventDefault();
+ this.props.onEnterKeyDown();
+ return state;
+ }
+ }
+
if (!data.isMod) return
let mark