1 files changed, 15 insertions, 6 deletions
diff --git a/animism-align/frontend/app/views/paragraph/containers/paragraphEditor.container.js b/animism-align/frontend/app/views/paragraph/containers/paragraphEditor.container.js
index c031d8a..aba9cca 100644
--- a/animism-align/frontend/app/views/paragraph/containers/paragraphEditor.container.js
+++ b/animism-align/frontend/app/views/paragraph/containers/paragraphEditor.container.js
@@ -21,6 +21,16 @@ class ParagraphEditor extends Component {
     this.handleCloseParagraphForm = this.handleCloseParagraphForm.bind(this)
     this.updateSelectedParagraph = this.updateSelectedParagraph.bind(this)
   }
+
+  componentDidMount() {
+    actions.transcript.buildParagraphs()
+  }
+
+  componentDidUpdate(prevProps) {
+    if (this.props.paragraph !== prevProps.paragraph) {
+      actions.transcript.buildParagraphs()
+    }
+  }
   
   handleAnnotationClick(e, paragraph, annotation){
     actions.audio.seek(annotation.start_ts)
@@ -46,12 +56,13 @@ class ParagraphEditor extends Component {
   }
 
   render() {
-    // const { media } = this.props
-    const { paragraphs, selectedParagraph, selectedParagraphOffset } = this.state
+    const { paragraphs } = this.props
+    const { selectedParagraph, selectedParagraphOffset } = this.state
     return (
       <div className='paragraphs'>
         <div className='content'>
           <ParagraphList
+            paragraphs={paragraphs}
             paragraphElementLookup={paragraphElementLookup}
             selectedParagraph={selectedParagraph}
             onAnnotationClick={this.handleAnnotationClick}
@@ -72,10 +83,8 @@ class ParagraphEditor extends Component {
 }
 
 const mapStateToProps = state => ({
-  // paragraph: state.paragraph.index,
-  // annotation: state.annotation.index,
-  // audio: state.audio,
-  // media: state.media.index,
+  paragraph: state.paragraph.index,
+  paragraphs: state.paragraph.paragraphs,
 })
 
 const mapDispatchToProps = dispatch => ({