Browse Source

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

develop
Apostolos Fanakis 7 years ago
parent
commit
95cf8ac429
  1. 19
      src/components/NewPost.js
  2. 19
      src/components/Post.js
  3. 24
      src/components/Topic.js
  4. 4
      src/components/WithBlockchainData.js
  5. 41
      src/containers/StartTopicContainer.js
  6. 20
      src/containers/TopicContainer.js
  7. 43
      src/containers/TransactionsMonitorContainer.js
  8. 14
      src/redux/actions/transactionsMonitorActions.js
  9. 2
      src/redux/reducer/transactionsMonitorReducer.js
  10. 2
      src/util/orbit.js

19
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});
}

19
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";
}

24
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";
}
}

4
src/components/WithBlockchainData.js

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

41
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);
}))
createTopic(
{
topicSubject: this.state.topicSubjectInput,
topicMessage: this.state.topicMessageInput
}
)
);
this.setState({
'creatingTopic': true
});
}
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
}

20
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'],

43
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,13 +151,34 @@ 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
}
}
}
RightSideBar.contextTypes = {
@ -161,6 +187,7 @@ RightSideBar.contextTypes = {
const mapStateToProps = state => {
return {
orbitDB: state.orbitDB,
transactionsQueue: state.transactionsQueue.transactions,
transactions: state.transactions,
transactionStack: state.transactionStack

14
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
};
}

2
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

2
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'
//

Loading…
Cancel
Save