Init pull from other user's orbitDBs, Move orbitDB interactions to TransactionsMonitorContainer

src/components/NewPost.js

@@ -16,7 +16,6 @@ class NewPost extends Component {
         this.handleInputChange = this.handleInputChange.bind(this);
         this.handlePreviewToggle = this.handlePreviewToggle.bind(this);
         this.validateAndPost = this.validateAndPost.bind(this);
-        this.pushToDatabase = this.pushToDatabase.bind(this);
 
         this.newPostOuterRef = React.createRef();
 
@@ -40,22 +39,16 @@ class NewPost extends Component {
         }
 
         this.props.store.dispatch(
-            createPost(this.props.topicID, ((returnData) => {
-                this.topicIDFetched = returnData.topicID;
-                this.postIDFetched = returnData.postID;
-                this.pushToDatabase();
-            }))
+            createPost(this.props.topicID,
+                {
+                    postSubject: this.state.postSubjectInput,
+                    postMessage: this.state.postContentInput
+                }
+            )
         );
         this.props.onPostCreated();
     }
 
-    async pushToDatabase() {
-        await this.props.orbitDB.postsDB.put(this.postIDFetched, {
-            subject: this.state.postSubjectInput,
-            content: this.state.postContentInput
-        });
-    }
-
     handleInputChange(event) {
         this.setState({[event.target.name]: event.target.value});
     }

src/components/Post.js

@@ -26,9 +26,22 @@ class Post extends Component {
     async fetchPost(postID) {
         this.orbitPostDataFetchStatus = "fetching";
 
-        var som = this.props.orbitDB.postsDB.get(postID);
-        if (som){
-            this.orbitPostData = som;
+        if (this.props.blockchainData[0].returnData[1] === this.props.user.address) {
+            this.orbitPostData = this.props.orbitDB.postsDB.get(postID);
+        } else {
+            const fullAddress = "/orbitdb/" + this.props.blockchainData[0].returnData[0] + "/posts";
+            const store = await this.props.orbitDB.orbitdb.keyvalue(fullAddress);
+            await store.load();
+
+            let localOrbitData =  store.get(postID);
+            if (localOrbitData) {
+                this.orbitPostData = localOrbitData;
+            } else {
+                // Wait until we have received something from the network
+                store.events.on('replicated', () => {
+                    this.orbitPostData = store.get(postID);
+                })
+            }
         }
         this.orbitPostDataFetchStatus = "fetched";
     }

src/components/Topic.js

@@ -21,21 +21,23 @@ class Topic extends Component {
         this.topicSubjectFetchStatus = "fetching";
 
         if (this.props.blockchainData[0].returnData[1] === this.props.user.address) {
-            let som = this.props.orbitDB.topicsDB.get(topicID);
-            this.topicSubject = som['subject'];
+            let orbitData = this.props.orbitDB.topicsDB.get(topicID);
+            this.topicSubject = orbitData['subject'];
             this.topicSubjectFetchStatus = "fetched";
         } else {
-            const fullAddress = "/orbitdb" + this.props.blockchainData[0].returnData[0] + "/topics";
+            const fullAddress = "/orbitdb/" + this.props.blockchainData[0].returnData[0] + "/topics";
             const store = await this.props.orbitDB.orbitdb.keyvalue(fullAddress);
-
-            /*store.events.on('replicated', () => {
-              const result = store.iterator({ limit: -1 }).collect().map(e => e.payload.value)
-              console.log(result.join('\n'))
-            })*/
-
             await store.load();
-            let som = store.get(topicID);
-            this.topicSubject = som['subject'];
+
+            let localOrbitData =  store.get(topicID);
+            if (localOrbitData) {
+                this.topicSubject = localOrbitData['subject'];
+            } else {
+                // Wait until we have received something from the network
+                store.events.on('replicated', () => {
+                    this.topicSubject = store.get(topicID)['subject'];
+                })
+            }
             this.topicSubjectFetchStatus = "fetched";
         }
     }

src/components/WithBlockchainData.js

@@ -44,9 +44,9 @@ class WithBlockchainData extends Component {
         );
     }
 
-    componentDidUpdate(){
-        for (var i = 0; i < this.callsInfo.length; ++i){
+    componentWillUpdate(){
         let currentDrizzleState = this.drizzle.store.getState();
+        for (var i = 0; i < this.callsInfo.length; ++i){
             let dataFetched = (currentDrizzleState
                 .contracts[this.callsInfo[i].contract][this.callsInfo[i].method][this.dataKeys[i]]);
             if (dataFetched && dataFetched.value !== this.state.blockchainData[i].returnData){

src/containers/StartTopicContainer.js

@@ -14,7 +14,6 @@ class StartTopic extends Component {
         this.handleInputChange = this.handleInputChange.bind(this);
         this.handlePreviewToggle = this.handlePreviewToggle.bind(this);
         this.validateAndPost = this.validateAndPost.bind(this);
-        this.pushToDatabase = this.pushToDatabase.bind(this);
 
         this.state = {
             topicSubjectInput: '',
@@ -22,8 +21,7 @@ class StartTopic extends Component {
             topicSubjectInputEmptySubmit: false,
             topicMessageInputEmptySubmit: false,
             previewEnabled: false,
-            previewDate: "",
-            creatingTopic: false
+            previewDate: ""
         };
     }
 
@@ -37,27 +35,14 @@ class StartTopic extends Component {
         }
 
         this.props.store.dispatch(
-            createTopic(((returnData) => {
-                this.topicIDFetched = returnData.topicID;
-                this.postIDFetched = returnData.postID;
-                this.pushToDatabase();
-                this.props.router.push("/topic/" + this.topicIDFetched);
-            }))
-        );
-        this.setState({
-            'creatingTopic': true
-        });
+            createTopic(
+                {
+                    topicSubject: this.state.topicSubjectInput,
+                    topicMessage: this.state.topicMessageInput
                 }
-
-    async pushToDatabase() {
-        await this.props.orbitDB.topicsDB.put(this.topicIDFetched, {
-            subject: this.state.topicSubjectInput
-        });
-
-        await this.props.orbitDB.postsDB.put(this.postIDFetched, {
-            subject: this.state.topicSubjectInput,
-            content: this.state.topicMessageInput
-        });
+            )
+        );
+        this.context.router.push("/home");
     }
 
     handleInputChange(event) {
@@ -90,14 +75,6 @@ class StartTopic extends Component {
         var previewEditText = this.state.previewEnabled ? "Edit" : "Preview";
         return (
             <div>
-                {/*this.state.creatingTopic && <div id="overlay">
-                        <div id="overlay-content">
-                            <p><i className="fas fa-spinner fa-3x fa-spin"></i></p>
-                            <br/>
-                            {this.transactionProgressText}
-                        </div>
-                    </div>*/
-                }
                 {this.state.previewEnabled &&
                     <NewTopicPreview
                         date={this.state.previewDate}
@@ -152,8 +129,6 @@ StartTopic.contextTypes = {
 
 const mapStateToProps = state => {
     return {
-        transactions: state.transactions,
-        transactionStack: state.transactionStack,
         orbitDB: state.orbitDB,
         user: state.user
     }

src/containers/TopicContainer.js

@@ -30,7 +30,25 @@ class Topic extends Component {
     }
 
     async fetchTopicSubject(orbitDBAddress) {
-        var orbitData =this.props.orbitDB.topicsDB.get(this.state.topicID);
+        let orbitData;
+        if (this.props.blockchainData[0].returnData[1] === this.props.user.address) {
+            orbitData = this.props.orbitDB.topicsDB.get(this.state.topicID);
+        } else {
+            const fullAddress = "/orbitdb/" + orbitDBAddress + "/topics";
+            const store = await this.props.orbitDB.orbitdb.keyvalue(fullAddress);
+            await store.load();
+
+            let localOrbitData = store.get(this.state.topicID);
+            if (localOrbitData) {
+                orbitData = localOrbitData;
+            } else {
+                // Wait until we have received something from the network
+                store.events.on('replicated', () => {
+                    orbitData = store.get(this.state.topicID);
+                })
+            }
+        }
+
         this.props.store.dispatch(hideProgressBar());
         this.setState({
             'topicSubject': orbitData['subject'],

src/containers/TransactionsMonitorContainer.js

@@ -11,6 +11,8 @@ class RightSideBar extends Component {
         super(props);
 
         this.handleMessageDismiss = this.handleMessageDismiss.bind(this);
+        this.updateTransactions = this.updateTransactions.bind(this);
+        this.completeWithOrbitInteractions = this.completeWithOrbitInteractions.bind(this);
 
         this.drizzle = context.drizzle;
         this.transactionsStackIds = [];
@@ -76,7 +78,11 @@ class RightSideBar extends Component {
         return (transactionMessages);
     }
 
-    componentDidUpdate(){
+    componentDidUpdate(){ //Maybe change to componentWillReceiveProps()
+        this.updateTransactions();
+    }
+
+    updateTransactions(){
         for (var index = 0; index < this.props.transactionsQueue.length; ++index) {
             let transaction = this.props.transactionsQueue[index];
 
@@ -102,7 +108,7 @@ class RightSideBar extends Component {
                 if (this.props.transactionStack[this.transactionsStackIds[index]]){
                     /*      User confirmed the transaction       */
 
-                    //Gets transaciton's hash
+                    //Gets transaction's hash
                     this.transactionsTxHashes[index] = (this.props
                         .transactionStack[this.transactionsStackIds[index]]);
                     this.props.store.dispatch(updateTransaction(index, {
@@ -129,9 +135,8 @@ class RightSideBar extends Component {
                     this.setState({
                         transactionsCompletionTime: transactionsCompletionTimeShallowCopy
                     });
-                    if (this.props.transactionsQueue[index].callback){
-                        this.props.transactionsQueue[index].callback(data);
-                    }
+
+                    this.completeWithOrbitInteractions(this.props.transactionsQueue[index], data);
                 } else if (this.props.transactions[this.transactionsTxHashes[index]]
                     .status === "error"){
                     /*      Transaction failed to complete      */
@@ -146,11 +151,32 @@ class RightSideBar extends Component {
                     this.setState({
                         transactionsCompletionTime: transactionsCompletionTimeShallowCopy
                     });
-                    if (this.props.transactionsQueue[index].callback){
-                        this.props.transactionsQueue[index].callback(null);
+                    //TODO handle this gracefully
+                }
             }
         }
     }
+
+    async completeWithOrbitInteractions(transaction, returnData){
+        switch (transaction.event){
+            case 'TopicCreated':
+                await this.props.orbitDB.topicsDB.put(returnData.topicID, {
+                    subject: transaction.userInputs.topicSubject
+                });
+
+                await this.props.orbitDB.postsDB.put(returnData.postID, {
+                    subject: transaction.userInputs.topicSubject,
+                    content: transaction.userInputs.topicMessage
+                });
+                break;
+            case 'PostCreated':
+                await this.props.orbitDB.postsDB.put(returnData.postID, {
+                    subject: transaction.userInputs.postSubject,
+                    content: transaction.userInputs.postMessage
+                });
+                break;
+            default:
+                break; //This transaction doesn't need a DB interaction to complete
         }
     }
 }
@@ -161,6 +187,7 @@ RightSideBar.contextTypes = {
 
 const mapStateToProps = state => {
     return {
+        orbitDB: state.orbitDB,
         transactionsQueue: state.transactionsQueue.transactions,
         transactions: state.transactions,
         transactionStack: state.transactionStack

src/redux/actions/transactionsMonitorActions.js

@@ -11,13 +11,13 @@ export function updateUsername(newUsername, callback){
                 contract: 'Forum',
                 method: 'updateUsername',
                 params: [newUsername],
-                event: 'UsernameUpdated',
+                event: 'UsernameUpdated'
             },
         callback: callback
     };
 }
 
-export function createTopic(callback){
+export function createTopic(userInputs){
     return {
         type: INIT_TRANSACTION,
         transactionDescriptor:
@@ -25,13 +25,13 @@ export function createTopic(callback){
                 contract: 'Forum',
                 method: 'createTopic',
                 params: [],
-                event: 'TopicCreated',
+                event: 'TopicCreated'
             },
-        callback: callback
+        userInputs: userInputs
     };
 }
 
-export function createPost(topicID, callback){
+export function createPost(topicID, userInputs){
     return {
         type: INIT_TRANSACTION,
         transactionDescriptor:
@@ -39,9 +39,9 @@ export function createPost(topicID, callback){
                 contract: 'Forum',
                 method: 'createPost',
                 params: [topicID],
-                event: 'PostCreated',
+                event: 'PostCreated'
             },
-        callback: callback
+        userInputs: userInputs
     };
 }
 

src/redux/reducer/transactionsMonitorReducer.js

@@ -15,7 +15,7 @@ const transactionsReducer = (state = initialState, action) => {
                 params: action.transactionDescriptor.params,
                 event: action.transactionDescriptor.event,
                 returnData: null,
-                callback: action.callback
+                userInputs: action.userInputs
             });
             return {
                 transactions: transactionsShallowCopy

src/util/orbit.js

@@ -19,7 +19,7 @@ const ipfsOptions = {
                 //
                 // Websocket:
                 // '/dns4/ws-star-signal-2.servep2p.com/tcp/443//wss/p2p-websocket-star',
-                // '/dns4/ws-star.discovery.libp2p.io/tcp/443/wss/p2p-websocket-star',
+                 '/dns4/ws-star.discovery.libp2p.io/tcp/443/wss/p2p-websocket-star',
                 // Local signal server
                 //'/ip4/127.0.0.1/tcp/4711/ws/p2p-websocket-star'
                 //