Fix topics and posts not loading bug, Add click listener for new posts in sidebar messages

app/src/components/Post.js

@@ -127,7 +127,7 @@ class Post extends Component {
                                                 primaryColor="#b2e8e6" secondaryColor="#00b5ad" >
                                                     <rect x="0" y="0" rx="3" ry="3" width="75" height="5.5" />
                                                 </ContentLoader>
-                                                : 'Subject:' + this.state.postSubject
+                                                : 'Subject: ' + this.state.postSubject
                                                 }
                                             </strong>
                                         </span>

app/src/components/PostList.js

@@ -12,24 +12,37 @@ class PostList extends Component {
         super(props);
 
         this.getBlockchainData = this.getBlockchainData.bind(this);
-        this.dataKeys = [];
+
+        this.state = {
+            dataKeys: []
+        }
     }
 
     getBlockchainData(){
         if (this.props.drizzleStatus['initialized']){
+            let dataKeysShallowCopy = this.state.dataKeys.slice();
+            let fetchingNewData = false;
+
             this.props.postIDs.forEach( postID => {
-                if (!this.dataKeys[postID]) {
-                    this.dataKeys[postID] = drizzle.contracts[contract].methods[getPostMethod].cacheCall(postID);
+                if (!this.state.dataKeys[postID]) {
+                    dataKeysShallowCopy[postID] = drizzle.contracts[contract].methods[getPostMethod].cacheCall(postID);
+                    fetchingNewData = true;
                 }
             })
+
+            if (fetchingNewData){
+                this.setState({
+                    dataKeys: dataKeysShallowCopy
+                });
+            }
         }
     }
 
     render() {
         const posts = this.props.postIDs.map((postID, index) => {
             return (<Post
-                postData={(this.dataKeys[postID] && this.props.contracts[contract][getPostMethod][this.dataKeys[postID]])
-                    ? this.props.contracts[contract][getPostMethod][this.dataKeys[postID]]
+                postData={(this.state.dataKeys[postID] && this.props.contracts[contract][getPostMethod][this.state.dataKeys[postID]])
+                    ? this.props.contracts[contract][getPostMethod][this.state.dataKeys[postID]]
                     : null}
                 avatarUrl={""}
                 postIndex={index}

app/src/components/TopicList.js

@@ -12,24 +12,37 @@ class TopicList extends Component {
         super(props);
 
         this.getBlockchainData = this.getBlockchainData.bind(this);
-        this.dataKeys = [];
+
+        this.state = {
+            dataKeys: []
+        }
     }
 
     getBlockchainData(){
         if (this.props.drizzleStatus['initialized']){
+            let dataKeysShallowCopy = this.state.dataKeys.slice();
+            let fetchingNewData = false;
+
             this.props.topicIDs.forEach( topicID => {
-                if (!this.dataKeys[topicID]) {
-                    this.dataKeys[topicID] = drizzle.contracts[contract].methods[getTopicMethod].cacheCall(topicID);
+                if (!this.state.dataKeys[topicID]) {
+                    dataKeysShallowCopy[topicID] = drizzle.contracts[contract].methods[getTopicMethod].cacheCall(topicID);
+                    fetchingNewData = true;
                 }
             })
+
+            if (fetchingNewData){
+                this.setState({
+                    dataKeys: dataKeysShallowCopy
+                });
+            }
         }
     }
 
     render() {
-        const topics = this.props.topicIDs.map((topicID) => {
+        const topics = this.props.topicIDs.map( topicID => {
             return (<Topic
-                topicData={(this.dataKeys[topicID] && this.props.contracts[contract][getTopicMethod][this.dataKeys[topicID]])
-                    ? this.props.contracts[contract][getTopicMethod][this.dataKeys[topicID]]
+                topicData={(this.state.dataKeys[topicID] && this.props.contracts[contract][getTopicMethod][this.state.dataKeys[topicID]])
+                    ? this.props.contracts[contract][getTopicMethod][this.state.dataKeys[topicID]]
                     : null}
                 topicID={topicID}
                 key={topicID} />)

app/src/containers/TransactionsMonitorContainer.js

@@ -39,6 +39,14 @@ class RightSideBar extends Component {
                             );
                             this.handleMessageDismiss(null, index);
                             break;
+                        case 'PostCreated':
+                            this.props.history.push("/topic/" +
+                                this.props.transactions[transactionHash].receipt.events.PostCreated.returnValues.topicID +
+                                "/" +
+                                this.props.transactions[transactionHash].receipt.events.PostCreated.returnValues.postID
+                            );
+                            this.handleMessageDismiss(null, index);
+                            break;
                         default:
                             this.handleMessageDismiss(null, index);
                             break;