2017-12-11 03:19:59 +00:00
|
|
|
import React from 'react'
|
2018-05-12 18:05:23 +00:00
|
|
|
import PropTypes from 'prop-types'
|
2017-12-11 03:19:59 +00:00
|
|
|
import { connect } from 'react-redux'
|
2017-12-12 03:47:52 +00:00
|
|
|
import { EditorState } from 'draft-js'
|
2017-12-11 03:19:59 +00:00
|
|
|
|
2018-05-09 00:36:04 +00:00
|
|
|
import actions from '../actions'
|
2017-12-11 03:19:59 +00:00
|
|
|
import Content from '../components/content'
|
2017-12-16 23:17:34 +00:00
|
|
|
import { EditorWelcome } from '../components/welcome'
|
|
|
|
import LoadingSpinner from '../components/loadingSpinner'
|
2018-05-11 00:25:39 +00:00
|
|
|
import EditorSidebarContainer from './editorSidebarContainer'
|
|
|
|
import EditorContentContainer from './editorContentContainer'
|
|
|
|
import DeleteConfirmModal from '../components/deleteConfirmModal'
|
2018-05-11 01:38:44 +00:00
|
|
|
import AnnotationModal from '../components/annotationModal'
|
|
|
|
import ChooseAnnotationModal from '../components/chooseAnnotationModal'
|
2017-12-11 03:19:59 +00:00
|
|
|
|
2018-05-12 18:05:23 +00:00
|
|
|
const EditorPage = ({
|
|
|
|
notes,
|
|
|
|
currentDocument,
|
|
|
|
annotationNote,
|
|
|
|
editorState,
|
|
|
|
docType,
|
|
|
|
loadingToggle,
|
|
|
|
onDeleteConfirm,
|
|
|
|
onSubmitAnnotationClick,
|
|
|
|
selectAnnotationNote,
|
|
|
|
selectionState,
|
|
|
|
}) =>
|
2018-05-01 04:05:04 +00:00
|
|
|
<div id='joyce_reader' className='container-fluid'>
|
|
|
|
<div className="row">
|
2018-05-09 03:39:59 +00:00
|
|
|
<EditorSidebarContainer />
|
2018-05-01 04:05:04 +00:00
|
|
|
<Content>
|
|
|
|
{loadingToggle === true &&
|
|
|
|
<LoadingSpinner size={4} />
|
|
|
|
}
|
|
|
|
{(Object.keys(currentDocument).length > 0 && loadingToggle === false) &&
|
2018-05-09 03:39:59 +00:00
|
|
|
<EditorContentContainer />
|
2018-05-01 04:05:04 +00:00
|
|
|
}
|
|
|
|
{(Object.keys(currentDocument).length === 0 && loadingToggle === false) &&
|
|
|
|
<EditorWelcome />
|
|
|
|
}
|
|
|
|
</Content>
|
2017-12-11 03:19:59 +00:00
|
|
|
</div>
|
2018-05-11 00:25:39 +00:00
|
|
|
<DeleteConfirmModal onDeleteConfirm={()=>onDeleteConfirm(currentDocument.id, docType)}/>
|
2018-05-11 01:38:44 +00:00
|
|
|
<AnnotationModal annotationNote={annotationNote} />
|
|
|
|
<ChooseAnnotationModal notes={notes} annotationNote={annotationNote} onSubmitClick={()=>onSubmitAnnotationClick(annotationNote, selectionState, editorState)} selectAnnotationNote={selectAnnotationNote} />
|
2017-12-11 03:19:59 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
const mapStateToProps = state => {
|
|
|
|
return {
|
|
|
|
notes: state.notes,
|
|
|
|
currentDocument: state.currentDocument,
|
|
|
|
annotationNote: state.annotationNote,
|
2018-05-11 01:38:44 +00:00
|
|
|
editorState: state.editorState,
|
2017-12-11 03:19:59 +00:00
|
|
|
selectionState: state.selectionState,
|
2018-05-11 01:38:44 +00:00
|
|
|
docType: state.docType,
|
|
|
|
loadingToggle: state.loadingToggle,
|
2017-12-11 03:19:59 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
const mapDispatchToProps = dispatch => {
|
|
|
|
return {
|
2018-05-11 00:25:39 +00:00
|
|
|
onDeleteConfirm: (id, docType) => {
|
2018-05-09 00:36:04 +00:00
|
|
|
dispatch(actions.deleteCurrentDocument(id, docType))
|
2017-12-11 03:19:59 +00:00
|
|
|
},
|
|
|
|
selectAnnotationNote: id => {
|
2018-05-09 00:36:04 +00:00
|
|
|
dispatch(actions.selectAnnotationNote(id))
|
2017-12-11 03:19:59 +00:00
|
|
|
},
|
|
|
|
onSubmitAnnotationClick: (annotationNote, selectionState, editorState) => {
|
2018-05-09 00:36:04 +00:00
|
|
|
dispatch(actions.submitAnnotation(annotationNote, selectionState, editorState))
|
2017-12-11 03:19:59 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2018-05-12 18:05:23 +00:00
|
|
|
EditorPage.propTypes = {
|
|
|
|
notes: PropTypes.arrayOf(PropTypes.object),
|
|
|
|
currentDocument: PropTypes.object,
|
|
|
|
annotationNote: PropTypes.object,
|
|
|
|
editorState: PropTypes.object,
|
|
|
|
selectionState: PropTypes.object,
|
|
|
|
docType: PropTypes.string,
|
|
|
|
loadingToggle: PropTypes.bool,
|
|
|
|
onDeleteConfirm: PropTypes.func,
|
|
|
|
onSubmitAnnotationClick: PropTypes.func,
|
|
|
|
selectAnnotationNote: PropTypes.func,
|
|
|
|
}
|
|
|
|
|
2018-05-09 03:39:59 +00:00
|
|
|
const EditorPageContainer = connect(mapStateToProps, mapDispatchToProps)(EditorPage)
|
2017-12-11 03:19:59 +00:00
|
|
|
|
2018-05-09 03:39:59 +00:00
|
|
|
export default EditorPageContainer
|