Major improvements (Orbit, Topic.js, LoadingContainer vol.2

app/src/components/Topic.js

@@ -67,7 +67,7 @@ class Topic extends Component {
 }
 
 Topic.propTypes = {
-  user: PropTypes.object.isRequired,
+  userAddress: PropTypes.string.isRequired,
   history: PropTypes.object.isRequired,
   //TODO: topicData: GetTopicResult.isRequired,
   orbitDB: PropTypes.object.isRequired,

app/src/components/TopicList.js

@@ -77,11 +77,10 @@ class TopicList extends Component {
         )
       }
 
-      return(
+      return (<div key={topicID}>TODO: Loading UI/fetching needs to be changed (?)</div>);
-        <div>TODO: Add a loading thingy</div>
-      )
     });
 
+    //TODO: Return loading indicator instead of topics when not fully loaded (?)
     return (
       <div className="topics-list">
         {topics.slice(0).reverse()}
@@ -91,7 +90,7 @@ class TopicList extends Component {
 }
 
 TopicList.propTypes = {
-  topicIDs: PropTypes.arrayOf(PropTypes.string).isRequired,
+  topicIDs: PropTypes.arrayOf(PropTypes.number).isRequired,
   contracts: PropTypes.PropTypes.objectOf(PropTypes.object).isRequired,
   drizzleStatus: PropTypes.object.isRequired
 };

app/src/containers/LoadingContainer.js

@@ -18,14 +18,12 @@ class LoadingContainer extends Component {
             <div className="pure-u-1-1">
               <img src={ethereum_logo} alt="ethereum_logo" height="50"/>
               <p><strong>This browser has no connection to the Ethereum network.</strong></p>
-              <p>
+              Please make sure that:
-                Please make sure that:
+              <ul>
-                <ul>
+                <li>You use MetaMask or a dedicated Ethereum browser (e.g. Mist or Parity)</li>
-                  <li>You use MetaMask or a dedicated Ethereum browser (e.g. Mist or Parity)</li>
+                <li>They are pointed to the correct network</li>
-                  <li>They are pointed to the correct network</li>
+                <li>Your account is unlocked and the app has the rights to access it</li>
-                  <li>Your account is unlocked and the app has the rights to access it</li>
+              </ul>
-                </ul>
-              </p>
             </div>
           </div>
         </main>
@@ -80,7 +78,7 @@ class LoadingContainer extends Component {
           <div>
             <div>
               <img src={orbitdb_logo} alt="orbitdb_logo" height="50"/>
-              <p><strong>Initializing OrbitDB...</strong></p>
+              <p><strong>Preparing OrbitDB...</strong></p>
             </div>
           </div>
         </main>

app/src/containers/UsernameFormContainer.js

@@ -8,6 +8,8 @@ import { drizzle } from '../index';
 import { createDatabases } from '../utils/orbitUtils';
 import { updateUsername } from '../redux/actions/transactionsActions';
 
+import { DATABASES_CREATED, updateDatabases } from '../redux/actions/orbitActions';
+
 const contract = 'Forum';
 const checkUsernameTakenMethod = 'isUserNameTaken';
 const signUpMethod = 'signUp';
@@ -77,18 +79,30 @@ class UsernameFormContainer extends Component {
       this.setState({
         signingUp: true
       });
-      const orbitdbInfo = await createDatabases();
+      const {
+        identityId,
+        identityPublicKey,
+        identityPrivateKey,
+        orbitdb,
+        orbitPublicKey,
+        orbitPrivateKey,
+        topicsDB,
+        postsDB
+      } = await createDatabases();
+      dispatch(
+        updateDatabases(DATABASES_CREATED, orbitdb, topicsDB, postsDB),
+      );
       this.stackId = drizzle.contracts[contract].methods[signUpMethod].cacheSend(
         ...[
           usernameInput,
-          orbitdbInfo.identityId,
+          identityId,
-          orbitdbInfo.identityPublicKey,
+          identityPublicKey,
-          orbitdbInfo.identityPrivateKey,
+          identityPrivateKey,
-          orbitdbInfo.orbitId,
+          orbitdb.id,
-          orbitdbInfo.orbitPublicKey,
+          orbitPublicKey,
-          orbitdbInfo.orbitPrivateKey,
+          orbitPrivateKey,
-          orbitdbInfo.topicsDB,
+          topicsDB,
-          orbitdbInfo.postsDB
+          postsDB
         ], {
           from: account
         },
@@ -201,7 +215,6 @@ UsernameFormContainer.propTypes = {
   transactionStack: PropTypes.array.isRequired,
   transactions: PropTypes.array.isRequired,
   contracts: PropTypes.array.isRequired,
-  hasSignedUp: PropTypes.object.isRequired,
   user: PropTypes.object.isRequired
 };
 

app/src/redux/actions/orbitActions.js

@@ -1,7 +1,6 @@
 const IPFS_INITIALIZED = 'IPFS_INITIALIZED';
 const DATABASES_CREATED = 'DATABASES_CREATED';
 const DATABASES_LOADED = 'DATABASES_LOADED';
-const DATABASES_NOT_READY = 'DATABASES_NOT_READY';
 const ADD_PEER_DATABASE = 'ADD_PEER_DATABASE';
 const PEER_DATABASE_ADDED = 'PEER_DATABASE_ADDED';
 const UPDATE_PEERS = 'UPDATE_PEERS';
@@ -27,7 +26,6 @@ function addPeerDatabase(fullAddress) {
 
 export { DATABASES_CREATED,
   DATABASES_LOADED,
-  DATABASES_NOT_READY,
   IPFS_INITIALIZED,
   UPDATE_PEERS,
   ADD_PEER_DATABASE,

app/src/redux/reducers/orbitReducer.js

@@ -1,7 +1,6 @@
 import {
   DATABASES_CREATED,
   DATABASES_LOADED,
-  DATABASES_NOT_READY,
   IPFS_INITIALIZED, UPDATE_PEERS, PEER_DATABASE_ADDED, ORBIT_INIT
 } from '../actions/orbitActions';
 
@@ -42,6 +41,8 @@ const orbitReducer = (state = initialState, action) => {
         orbitdb: null,
         topicsDB: null,
         postsDB: null,
+        pubsubPeers: {topicsDBPeers:[], postsDBPeers:[]},
+        peerDatabases: [],
         id: null
       };
     case PEER_DATABASE_ADDED:

app/src/redux/sagas/orbitSaga.js

@@ -19,7 +19,7 @@ import { ACCOUNTS_FETCHED } from '../actions/drizzleActions';
 let latestAccount;
 
 function* getOrbitDBInfo() {
-  yield put({
+  yield put.resolve({
     type: ORBIT_INIT, ...[]
   });
   const account = yield call(getCurrentAccount);
@@ -82,18 +82,24 @@ function* addPeerDatabase(action) {
 }
 
 //Keeps track of currently connected pubsub peers in Redux store (for debugging purposes)
+//Feel free to disable it anytime
 function* updatePeersState() {
   const orbit = yield select(state => state.orbit);
   if(orbit.ready){
-    const topicsDBAddress = orbit.topicsDB.address.toString();
+    // This try is here to ignore concurrency errors that arise from times to times
-    const postsDBAddress = orbit.postsDB.address.toString();
+    try{
-    const topicsDBPeers = yield call(orbit.ipfs.pubsub.peers, topicsDBAddress);
+      const topicsDBAddress = orbit.topicsDB.address.toString();
-    const postsDBPeers = yield call(orbit.ipfs.pubsub.peers, postsDBAddress);
+      const postsDBAddress = orbit.postsDB.address.toString();
-    if(!isEqual(topicsDBPeers.sort(), orbit.pubsubPeers.topicsDBPeers.sort()) ||
+      const topicsDBPeers = yield call(orbit.ipfs.pubsub.peers, topicsDBAddress);
-      !isEqual(postsDBPeers.sort(), orbit.pubsubPeers.postsDBPeers.sort())){
+      const postsDBPeers = yield call(orbit.ipfs.pubsub.peers, postsDBAddress);
-      yield put({
+      if(!isEqual(topicsDBPeers.sort(), orbit.pubsubPeers.topicsDBPeers.sort()) ||
-        type: UPDATE_PEERS, topicsDBPeers, postsDBPeers
+        !isEqual(postsDBPeers.sort(), orbit.pubsubPeers.postsDBPeers.sort())){
-      });
+        yield put({
+          type: UPDATE_PEERS, topicsDBPeers, postsDBPeers
+        });
+      }
+    } catch (e) {
+      // No need to catch anything
     }
   }
 }

app/src/utils/orbitUtils.js

@@ -3,7 +3,7 @@ import Keystore from 'orbit-db-keystore';
 import path from 'path';
 import IPFS from 'ipfs';
 import store from '../redux/store';
-import { DATABASES_CREATED, DATABASES_LOADED, IPFS_INITIALIZED, updateDatabases } from '../redux/actions/orbitActions';
+import {  DATABASES_LOADED, IPFS_INITIALIZED, updateDatabases } from '../redux/actions/orbitActions';
 import ipfsOptions from '../config/ipfsOptions';
 
 function initIPFS() {
@@ -36,9 +36,6 @@ async function createDatabases() {
   const orbitdb = new OrbitDB(ipfs);
   const topicsDB = await orbitdb.keyvalue('topics');
   const postsDB = await orbitdb.keyvalue('posts');
-  store.dispatch(
-    updateDatabases(DATABASES_CREATED, orbitdb, topicsDB, postsDB),
-  );
 
   const orbitKey = orbitdb.keystore.getKey(orbitdb.id);
 
@@ -46,7 +43,7 @@ async function createDatabases() {
     identityId: 'Tempus',
     identityPublicKey: 'edax',
     identityPrivateKey: 'rerum',
-    orbitId: orbitdb.id,
+    orbitdb: orbitdb,
     orbitPublicKey: orbitKey.getPublic('hex'),
     orbitPrivateKey: orbitKey.getPrivate('hex'),
     topicsDB: topicsDB.address.root,