|
@ -1,6 +1,5 @@ |
|
|
import React, { Component } from 'react'; |
|
|
import React, { Component } from 'react'; |
|
|
import PropTypes from 'prop-types'; |
|
|
import PropTypes from 'prop-types'; |
|
|
import { GetTopicResult } from '../CustomPropTypes' |
|
|
|
|
|
import { connect } from 'react-redux'; |
|
|
import { connect } from 'react-redux'; |
|
|
import { withRouter } from 'react-router-dom'; |
|
|
import { withRouter } from 'react-router-dom'; |
|
|
|
|
|
|
|
@ -11,21 +10,10 @@ import TimeAgo from 'react-timeago'; |
|
|
import { addPeerDatabase } from '../redux/actions/orbitActions'; |
|
|
import { addPeerDatabase } from '../redux/actions/orbitActions'; |
|
|
|
|
|
|
|
|
class Topic extends Component { |
|
|
class Topic extends Component { |
|
|
constructor(props) { |
|
|
componentDidMount() { |
|
|
super(props); |
|
|
const { dispatch, userAddress, topicData } = this.props; |
|
|
this.state = { |
|
|
if(topicData.userAddress !== userAddress ) |
|
|
askedForReplication: false, |
|
|
dispatch(addPeerDatabase(topicData.fullOrbitAddress)); |
|
|
fetchedSubject: false |
|
|
|
|
|
}; |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
componentDidUpdate() { |
|
|
|
|
|
const { dispatch, topicData, topicSubject, orbitDB } = this.props; |
|
|
|
|
|
const { askedForReplication } = this.state; |
|
|
|
|
|
if(!askedForReplication && orbitDB.ipfsInitialized && orbitDB.orbitdb && dispatch && !topicSubject && topicData) { |
|
|
|
|
|
dispatch(addPeerDatabase(`/orbitdb/${topicData.value[0]}/topics`)); |
|
|
|
|
|
this.setState({ askedForReplication: true }); |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
render() { |
|
|
render() { |
|
@ -62,30 +50,14 @@ class Topic extends Component { |
|
|
</div> |
|
|
</div> |
|
|
<hr /> |
|
|
<hr /> |
|
|
<div className="topic-meta"> |
|
|
<div className="topic-meta"> |
|
|
<p className={`no-margin${ |
|
|
<p className="no-margin"> |
|
|
topicData !== null ? '' : ' grey-text'}`}
|
|
|
{topicData.userName} |
|
|
> |
|
|
|
|
|
{topicData !== null |
|
|
|
|
|
? topicData.value[2] |
|
|
|
|
|
: 'Username' |
|
|
|
|
|
} |
|
|
|
|
|
</p> |
|
|
</p> |
|
|
<p className={`no-margin${ |
|
|
<p className="no-margin"> |
|
|
topicData !== null ? '' : ' grey-text'}`}
|
|
|
Number of Replies: {topicData.nReplies} |
|
|
> |
|
|
|
|
|
{`Number of replies: ${topicData !== null |
|
|
|
|
|
? topicData.value[4].length |
|
|
|
|
|
: ''}` |
|
|
|
|
|
} |
|
|
|
|
|
</p> |
|
|
</p> |
|
|
<p className="topic-date grey-text"> |
|
|
<p className="topic-date grey-text"> |
|
|
{topicData !== null |
|
|
<TimeAgo date={topicData.timestamp}/> |
|
|
&& ( |
|
|
|
|
|
<TimeAgo |
|
|
|
|
|
date={topicData.value[3]*1000} |
|
|
|
|
|
/> |
|
|
|
|
|
) |
|
|
|
|
|
} |
|
|
|
|
|
</p> |
|
|
</p> |
|
|
</div> |
|
|
</div> |
|
|
</Card.Content> |
|
|
</Card.Content> |
|
@ -97,43 +69,37 @@ class Topic extends Component { |
|
|
Topic.propTypes = { |
|
|
Topic.propTypes = { |
|
|
user: PropTypes.object.isRequired, |
|
|
user: PropTypes.object.isRequired, |
|
|
history: PropTypes.object.isRequired, |
|
|
history: PropTypes.object.isRequired, |
|
|
topicData: GetTopicResult.isRequired, |
|
|
//TODO: topicData: GetTopicResult.isRequired,
|
|
|
orbitDB: PropTypes.object.isRequired, |
|
|
orbitDB: PropTypes.object.isRequired, |
|
|
topicID: PropTypes.number.isRequired |
|
|
topicID: PropTypes.number.isRequired |
|
|
}; |
|
|
}; |
|
|
|
|
|
|
|
|
function getTopicSubject(state, props){ |
|
|
function getTopicSubject(state, props){ |
|
|
const { user, orbit } = state; |
|
|
const { user: {address: userAddress}, orbit } = state; |
|
|
if (orbit.ipfsInitialized && orbit.orbitdb) { |
|
|
const { topicData, topicID } = props; |
|
|
const { topicData, topicID } = props; |
|
|
if(userAddress === topicData.userAddress) { |
|
|
if (topicData){ |
|
|
const orbitData = orbit.topicsDB.get(topicID); |
|
|
if(user && topicData.value[1] === user.address) { |
|
|
if(orbitData && orbitData.subject) |
|
|
const orbitData = orbit.topicsDB.get(topicID); |
|
|
return orbitData.subject; |
|
|
if(orbitData && orbitData.subject) |
|
|
} |
|
|
return orbitData.subject; |
|
|
else{ |
|
|
} |
|
|
const db = orbit.peerDatabases.find(db => db.fullAddress === topicData.fullOrbitAddress); |
|
|
else{ |
|
|
if(db && db.store){ |
|
|
const db = orbit.peerDatabases.find(db => db.fullAddress === `/orbitdb/${topicData.value[0]}/topics`); |
|
|
const localOrbitData = db.store.get(topicID); |
|
|
if(db && db.store){ |
|
|
if (localOrbitData) |
|
|
const localOrbitData = db.store.get(topicID); |
|
|
return localOrbitData.subject; |
|
|
if (localOrbitData) |
|
|
|
|
|
return localOrbitData.subject; |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
|
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
return null; |
|
|
return null; |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
function mapStateToProps(state, ownProps) { |
|
|
function mapStateToProps(state, ownProps) { |
|
|
return { |
|
|
return { |
|
|
user: state.user, |
|
|
userAddress: state.user.address, |
|
|
orbitDB: state.orbit, |
|
|
orbitDB: state.orbit, |
|
|
topicSubject: getTopicSubject(state, ownProps) |
|
|
topicSubject: getTopicSubject(state, ownProps) |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
export default withRouter(connect(mapStateToProps)(Topic)); |
|
|
export default withRouter(connect(mapStateToProps)(Topic)); |
|
|