diff --git a/app/components/Voting.js b/app/components/Voting.js index b2d11e2..3c98dfe 100644 --- a/app/components/Voting.js +++ b/app/components/Voting.js @@ -18,6 +18,7 @@ import VotingCredits from './flow/VotingCredits'; import PollVoting from './flow/PollVoting'; import ReviewVotes from './flow/ReviewVotes'; import Results from './flow/Results'; +import LandingPage from './flow/LandingPage'; import { withRouter } from 'react-router-dom' @@ -54,13 +55,14 @@ class Voting extends PureComponent { return ( - {({ getPolls, rawPolls, loading, symbol }) => + {({ getPolls, rawPolls, loading, symbol, replacePoll, loadPollContent }) =>
{loading && }
- } /> + } /> + } /> } /> } /> } /> diff --git a/app/components/flow/ExternalWallet.js b/app/components/flow/ExternalWallet.js index 7061ef2..effd111 100644 --- a/app/components/flow/ExternalWallet.js +++ b/app/components/flow/ExternalWallet.js @@ -19,7 +19,7 @@ class ExternalWallet extends Component { const {history, polls, updateBalances, idPoll} = this.props; if(!polls) return; - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll) return null; diff --git a/app/components/flow/HowVotingWorks.js b/app/components/flow/HowVotingWorks.js index e27e768..b2a449a 100644 --- a/app/components/flow/HowVotingWorks.js +++ b/app/components/flow/HowVotingWorks.js @@ -52,7 +52,7 @@ class HowVotingWorks extends Component { if(cont){ // TODO: extract this code to utils. It's repeated in ConnectYourWallt, ExternalWallet and HowVotingWorks - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll) return null; const tknVotes = await PollManager.methods.getVote(idPoll, web3.eth.defaultAccount).call({from: web3.eth.defaultAccount}); diff --git a/app/components/flow/LandingPage.js b/app/components/flow/LandingPage.js new file mode 100644 index 0000000..770905d --- /dev/null +++ b/app/components/flow/LandingPage.js @@ -0,0 +1,89 @@ +import Button from '@material-ui/core/Button'; +import React, {Component, Fragment} from 'react'; +import Typography from '@material-ui/core/Typography'; +import { withRouter } from 'react-router-dom' +import {Link} from "react-router-dom"; + +class LandingPage extends Component { + + state = { + openPoll: null, + closedPoll: null + } + + componentDidUpdate(prevProps) { + if (this.props.polls !== prevProps.polls) { + + let polls = this.props.polls; + if(polls && polls.length){ + polls = polls.sort((x,y) => x.idPoll < y.idPoll); + } + + if(polls && polls.length){ + const openPoll = polls.find(x => !x._cancelled && x._endTime > (new Date()).getTime() / 1000); + EmbarkJS.Storage.get(web3.utils.toAscii(openPoll._description)).then(content => { + openPoll.content = JSON.parse(content); + this.setState({openPoll}) + + this.props.replacePoll(openPoll); + }) + const closedPoll = polls.find(x => !x._cancelled || x._endTime < (new Date()).getTime() / 1000); + EmbarkJS.Storage.get(web3.utils.toAscii(closedPoll._description)).then(content => { + closedPoll.content = JSON.parse(content); + this.setState({closedPoll}); + this.props.replacePoll(openPoll); + }) + } + + } + } + + render(){ + const { openPoll, closedPoll } = this.state; + + return +
+
+ + Status SNT Voting + Create a poll or vote in one. Your vote helps us decide our product and community direction. +
+ + { openPoll && openPoll.content && +
+

Open Polls

+
+

{openPoll.content.title}

+ [Closes: 12/12/2018] + Voters: 300 + Total SNT: 50.000 + {openPoll._description} + +
+

More Open Polls

+
+ } + + { closedPoll && closedPoll.content && +
+

Closed Polls

+
+

{closedPoll.content.title}

+ [Closes: 12/12/2018] + Voters: 300 + Total SNT: 50.000 + {closedPoll._description} + Vote Now +
+

More Closed Polls

+
+ } +
+ + + +
; + } +} + +export default LandingPage; \ No newline at end of file diff --git a/app/components/flow/LearnAboutBallots.js b/app/components/flow/LearnAboutBallots.js index 66891ff..07d2339 100644 --- a/app/components/flow/LearnAboutBallots.js +++ b/app/components/flow/LearnAboutBallots.js @@ -34,7 +34,7 @@ class LearnAboutBallots extends Component { if(!polls) return null; - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll) return null; const title = poll.content.title; diff --git a/app/components/flow/OtherWallets.js b/app/components/flow/OtherWallets.js index 6a50af9..0053649 100644 --- a/app/components/flow/OtherWallets.js +++ b/app/components/flow/OtherWallets.js @@ -54,7 +54,9 @@ class OtherWallets extends Component { if(!props.polls){ return null; } - const poll = props.polls[props.idPoll]; + + + const poll = props.polls.find(p => p.idPoll == props.idPoll); if(!poll) return null; d = new Date(poll.blockInfo.timestamp * 1000); diff --git a/app/components/flow/PollVoting.js b/app/components/flow/PollVoting.js index 94c84c8..652e812 100644 --- a/app/components/flow/PollVoting.js +++ b/app/components/flow/PollVoting.js @@ -59,7 +59,7 @@ class PollVoting extends Component { return; } - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll){ history.push('/'); return; @@ -112,7 +112,7 @@ class PollVoting extends Component { const symbol = "SNT"; // TODO: - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll) return null; const title = poll.content.title; diff --git a/app/components/flow/Results.js b/app/components/flow/Results.js index 1977e74..a136864 100644 --- a/app/components/flow/Results.js +++ b/app/components/flow/Results.js @@ -18,7 +18,7 @@ class Results extends Component { super(props); if(props.polls) - this.state.poll = props.polls[props.idPoll]; + this.state.poll = props.polls.find(p => p.idPoll == props.idPoll); } componentDidUpdate(prevProps){ @@ -84,8 +84,10 @@ class Results extends Component { return null; } - const title = polls[idPoll].content.title; - const ballots = polls[idPoll].content.ballots; + const p = polls.find(p => p.idPoll == idPoll); + + const title = p.content.title; + const ballots = p.content.ballots; const totalVotes = poll._quadraticVotes.map(x => parseInt(x, 10)).reduce((x, y) => x + y, 0); const etherscanURL = netId == 3 ? 'https://ropsten.etherscan.io/tx/' : ( netId == 1 ? "https://etherscan.io/tx/" : ''); diff --git a/app/components/flow/ReviewVotes.js b/app/components/flow/ReviewVotes.js index c812f64..67ca156 100644 --- a/app/components/flow/ReviewVotes.js +++ b/app/components/flow/ReviewVotes.js @@ -66,7 +66,7 @@ class ReviewVotes extends Component { return; } - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll) { history.push('/'); return; @@ -82,7 +82,7 @@ class ReviewVotes extends Component { return null; } - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll);; if(!poll) return null; const ballots = poll.content.ballots diff --git a/app/components/flow/TitleScreen.js b/app/components/flow/TitleScreen.js index 8044bce..84484bf 100644 --- a/app/components/flow/TitleScreen.js +++ b/app/components/flow/TitleScreen.js @@ -65,20 +65,24 @@ class TitleScreen extends Component { componentDidUpdate(prevProps){ if (this.props.polls !== prevProps.polls && this.props.polls) { this.initTimer(); + + const poll = this.props.polls.find(p => p.idPoll == this.props.idPoll); + if(poll && !poll.content){ + this.props.loadPollContent(poll); + } } } initTimer(){ - const ids = Object.keys(this.props.polls); - if(!ids.length) return; + if(!this.props.polls || !this.props.polls.length) return; if(this.state.initTimer) return; this.setState({initTimer: true}); - const idPoll = ids[ids.length - 1]; + const poll = this.props.polls.find(p => p.idPoll == this.props.idPoll); - const seconds = this.props.polls[idPoll]._endTime - (new Date()).getTime() / 1000 + const seconds = poll._endTime - (new Date()).getTime() / 1000 if(seconds > 0){ let timeLeftVar = this.secondsToTime(seconds); this.setState({ time: timeLeftVar, seconds }); @@ -90,19 +94,19 @@ class TitleScreen extends Component { render(){ const {time, seconds} = this.state; - const {polls} = this.props; + const {polls, idPoll} = this.props; - if(!polls) return null; - - const ids = Object.keys(this.props.polls); - if(!ids.length) return null; + if(!polls || !polls.length) return null; - const idPoll = ids[ids.length - 1]; - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); + if(!poll) return null; + + if(!poll.content) return null; const title = poll.content.title; const description = poll.content.description; const canceled = poll._canceled; + return
diff --git a/app/components/flow/VotingCredits.js b/app/components/flow/VotingCredits.js index 31ff4c3..c3c5ccc 100644 --- a/app/components/flow/VotingCredits.js +++ b/app/components/flow/VotingCredits.js @@ -54,7 +54,7 @@ class VotingCredits extends Component { if(!polls || !balances) return null; - const poll = polls[idPoll]; + const poll = polls.find(p => p.idPoll == idPoll); if(!poll) return null; let title = poll.content.title; diff --git a/app/dapp.js b/app/dapp.js index 8a787df..dd9ee11 100644 --- a/app/dapp.js +++ b/app/dapp.js @@ -32,7 +32,7 @@ class App extends React.Component { constructor(props) { super(props); } - state = { admin: false, pollOrder: 'NEWEST_ADDED', web3Provider: true, loading: true, symbol: "SNT", networkName: "" }; + state = { admin: false, pollOrder: 'NEWEST_ADDED', web3Provider: true, loading: true, symbol: "SNT", networkName: "" , rawPolls: []}; componentDidMount(){ EmbarkJS.onReady((err) => { @@ -91,7 +91,10 @@ class App extends React.Component { getPolls(polls, poll) .then(omitPolls) .then(rawPolls => { - this._loadIPFSContent(rawPolls); + + + // this._loadIPFSContent(rawPolls); + this.setState({rawPolls, loading: false}); }); else this.setState({ rawPolls: [], loading: false }); @@ -134,10 +137,31 @@ class App extends React.Component { ; } + + replacePoll = (poll) => { + let rawPolls = this.state.rawPolls; + for(let i = 0; i < rawPolls.length; i++){ + if(rawPolls[i].idPoll == poll.idPoll){ + rawPolls[i] = poll; + this.setState({rawPolls}); + break; + } + } + } + + loadPollContent = async (poll) => { + let ipfsContent = await EmbarkJS.Storage.get(web3.utils.toAscii(poll._description)); + poll.content = JSON.parse(ipfsContent); + this.replacePoll(poll); + } + render(){ let { web3Provider, networkName } = this.state; - const { _getPolls, updatePoll, setPollOrder, appendToPoll } = this; - const votingContext = { getPolls: _getPolls, updatePoll, appendToPoll, setPollOrder, ...this.state }; + const { _getPolls, updatePoll, setPollOrder, appendToPoll, replacePoll, loadPollContent } = this; + const votingContext = { getPolls: _getPolls, updatePoll, appendToPoll, setPollOrder, replacePoll, loadPollContent, ...this.state }; + + + console.log(this.state.rawPolls); if(web3Provider){ return