Introduce adding note on "enter" key.
authorAlexandre Segura <mex.zktk@gmail.com>
Tue, 20 Jun 2017 17:54:02 +0200
changeset 64 aecde527900a
parent 63 4088f8dc6b52
child 65 14989b339e5d
Introduce adding note on "enter" key.
client/src/components/NoteInput.js
client/src/components/SlateEditor.js
--- 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