step 14: create `Post` component and use EmbarkJS.onReady()
This commit is contained in:
parent
08e4031442
commit
c6a4464bcf
|
@ -0,0 +1,39 @@
|
|||
import React, { Component } from 'react';
|
||||
import EmbarkJS from 'Embark/EmbarkJS';
|
||||
import dateformat from 'dateformat';
|
||||
|
||||
export class Post extends Component {
|
||||
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
topic: '',
|
||||
content: ''
|
||||
};
|
||||
}
|
||||
|
||||
async componentDidMount() {
|
||||
const ipfsHash = web3.utils.toAscii(this.props.description);
|
||||
const data = await EmbarkJS.Storage.get(ipfsHash);
|
||||
const { topic, content } = JSON.parse(data);
|
||||
|
||||
this.setState({ topic, content });
|
||||
}
|
||||
|
||||
render() {
|
||||
const formattedDate = dateformat(
|
||||
new Date(this.props.creationDate * 1000),
|
||||
'yyyy-mm-dd HH:MM:ss'
|
||||
);
|
||||
return (
|
||||
<React.Fragment>
|
||||
<hr />
|
||||
<h3>{this.state.topic}</h3>
|
||||
<p>{this.state.content}</p>
|
||||
<p><small><i>created at {formattedDate} by {this.props.owner}</i></small></p>
|
||||
<button>Upvote</button>
|
||||
<button>Downvote</button>
|
||||
</React.Fragment>
|
||||
)
|
||||
}
|
||||
}
|
|
@ -7,5 +7,7 @@ import { App } from './components/App';
|
|||
// e.g if you have a contract named SimpleStorage:
|
||||
//import SimpleStorage from 'Embark/contracts/SimpleStorage';
|
||||
|
||||
render(<App />, document.getElementById('root'));
|
||||
EmbarkJS.onReady(() => {
|
||||
render(<App />, document.getElementById('root'));
|
||||
});
|
||||
|
||||
|
|
|
@ -4,6 +4,11 @@
|
|||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
"dateformat": {
|
||||
"version": "3.0.3",
|
||||
"resolved": "https://registry.npmjs.org/dateformat/-/dateformat-3.0.3.tgz",
|
||||
"integrity": "sha512-jyCETtSl3VMZMWeRo7iY1FL19ges1t55hMo5yaam4Jrsm5EPL89UQkoQRyiI+Yf4k8r2ZpdngkV8hr1lIdjb3Q=="
|
||||
},
|
||||
"js-tokens": {
|
||||
"version": "4.0.0",
|
||||
"resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
|
||||
|
|
|
@ -10,6 +10,7 @@
|
|||
"homepage": "",
|
||||
"devDependencies": {},
|
||||
"dependencies": {
|
||||
"dateformat": "^3.0.3",
|
||||
"react": "^16.4.2",
|
||||
"react-dom": "^16.4.2"
|
||||
}
|
||||
|
|
Loading…
Reference in New Issue