add willreceiveprops to handle async call to get fragments

app/components/BookBuilder/BookBuilder.jsx

@@ -32,6 +32,8 @@ export class BookBuilder extends React.Component {
     const { actions, book } = this.props
     const { getCollections, getFragments, getTeams, getUsers } = actions
 
+    console.log('props', this.props)
+
     getUsers().then(
       () => getTeams()
     ).then(
@@ -41,23 +43,24 @@ export class BookBuilder extends React.Component {
       }
     ).then(
       () => {
-        console.log(book.id)
-        if (book.id) getFragments(book)
+        if (book.id) {
+          console.log('has book id')
+          getFragments(book)
+        }
       }
     )
   }
 
-  // componentWillReceiveProps (nextProps) {
-  //   const { actions, book } = nextProps
-  //   const { getFragments } = actions
-  //   //
-  //   console.log(book)
-  //   console.log(this.props)
-  //   //
-  //   // if (book.id && book.id !== this.props.id) {
-  //   //   // getFragments(book)
-  //   // }
-  // }
+  componentWillReceiveProps (nextProps) {
+    console.log('next', nextProps)
+    const { actions, book } = nextProps
+    const { getFragments } = actions
+
+    if (book.id && book.id !== this.props.book.id) {
+      console.log('here')
+      getFragments(book)
+    }
+  }
 
   componentDidMount () {
     // I'm using the ref inside the render function it was created in
@@ -252,12 +255,12 @@ BookBuilder.propTypes = {
 }
 
 function mapStateToProps (state, ownProps) {
+  console.log(state)
+
   let book = _.find(state.collections, function (c) {
     return c.id === ownProps.params.id
   })
 
-  console.log(state)
-
   let chapters = _.sortBy(_.filter(state.fragments, function (f) {
     return f.book === book.id && f.id && !f.deleted
   }), 'index')