--- a/client/src/components/Note.js Fri Jun 23 17:58:21 2017 +0200
+++ b/client/src/components/Note.js Fri Jun 23 18:01:40 2017 +0200
@@ -1,28 +1,15 @@
import React, { Component } from 'react';
-import { connect } from 'react-redux';
-import { bindActionCreators } from 'redux';
import PropTypes from 'prop-types';
import { formatTimestamp } from '../utils';
import SlateEditor from './SlateEditor';
-import * as notesActions from '../actions/notesActions';
class Note extends Component {
- state = {
- edit: false
- }
-
- enterEditMode = () => {
- const { edit } = this.state;
- if (edit) return;
- this.setState({ edit: true })
- }
-
onClickDelete = (e) => {
e.preventDefault();
e.stopPropagation();
- this.props.notesActions.deleteNote(this.props.note);
+ this.props.onDelete();
}
onClickButton = (e) => {
@@ -32,25 +19,25 @@
const html = this.refs.editor.asHtml();
const categories = this.refs.editor.asCategories();
- this.props.notesActions.updateNote(this.props.note, {
+ const data = {
plain,
raw,
html,
categories
- });
+ }
- this.setState({ edit: false })
+ this.props.onSave(this.props.note, data);
}
onClickClose = (e) => {
e.preventDefault();
e.stopPropagation();
- this.setState({ edit: false })
+ this.props.onClose();
}
renderNoteContent() {
- if (this.state.edit) {
+ if (this.props.isEditing) {
return (
<div className="note-content">
<SlateEditor ref="editor"
@@ -66,7 +53,7 @@
}
renderNoteRight() {
- if (this.state.edit) {
+ if (this.props.isEditing) {
return (
<a onClick={this.onClickClose}>
<span className="material-icons">close</span>
@@ -83,7 +70,7 @@
render() {
return (
- <div id={"note-" + this.props.note._id} className="note" onClick={ this.enterEditMode }>
+ <div id={"note-" + this.props.note._id} className="note" onClick={ this.props.onClick }>
<span className="start">{ formatTimestamp(this.props.note.startedAt) }</span>
<span className="finish">{ formatTimestamp(this.props.note.finishedAt) }</span>
{ this.renderNoteContent() }
@@ -97,17 +84,7 @@
}
Note.propTypes = {
- note: PropTypes.object.isRequired
+ note: PropTypes.object.isRequired,
};
-function mapStateToProps(state, props) {
- return props;
-}
-
-function mapDispatchToProps(dispatch) {
- return {
- notesActions: bindActionCreators(notesActions, dispatch),
- }
-}
-
-export default connect(mapStateToProps, mapDispatchToProps)(Note);
+export default Note;