Merge branch '000-snt-voting-dapp' of https://github.com/status-im/contracts into 000-snt-voting-dapp

app/components/simple-voting/PollsList.js

@@ -1,26 +1,49 @@
-import React, { Fragment } from 'react';
+import React, { Fragment, PureComponent } from 'react';
 import Card from '@material-ui/core/Card';
 import CardContent from '@material-ui/core/CardContent';
+import CardActions from '@material-ui/core/CardActions';
 import Button from '@material-ui/core/Button';
 import Typography from '@material-ui/core/Typography';
+import Slider from '@material-ui/lab/Slider';
+import Tooltip from '@material-ui/core/Tooltip';
 
-const Poll = ({ _question, _totalCensus, _voters }) => (
-  <Card>
-    <CardContent>
-      <Typography variant="headline">Proposal: {_question}</Typography>
-      <Typography variant="subheading" color="textSecondary">
-        Total SNT Voted: {_totalCensus}
-      </Typography>
-      <Typography variant="subheading" color="textSecondary">
-        Number of voters: {_voters}
-      </Typography>
-    </CardContent>
-  </Card>
-)
+class Poll extends PureComponent {
+  state = {
+    value: 0,
+  };
+
+  handleChange = (event, value) => {
+    this.setState({ value });
+  };
+
+  render(){
+    const { _question, _totalCensus, _voters } = this.props;
+    const { value } = this.state;
+    return (
+      <Card>
+        <CardContent>
+          <Typography variant="headline">Proposal: {_question}</Typography>
+          <Typography variant="subheading" color="textSecondary">
+            Total SNT Voted: {_totalCensus}
+          </Typography>
+          <Typography variant="subheading" color="textSecondary">
+            Number of voters: {_voters}
+          </Typography>
+        </CardContent>
+        <Tooltip id="tooltip-icon" placement="top" title={`${value} SNT`}>
+        <CardActions>
+            <Slider value={value} min={0} max={6} step={1} onChange={this.handleChange} />
+            <Button variant="contained" color="primary">Vote</Button>
+        </CardActions>
+          </Tooltip>
+      </Card>
+    )
+  }
+}
 
 const PollsList = ({ rawPolls  }) => (
   <Fragment>
-    {rawPolls.map(poll => <Poll {...poll} />)}
+    {rawPolls.map((poll, idx) => <Poll key={idx} {...poll} />)}
   </Fragment>
 )
 

app/dapp.js

@@ -2,6 +2,7 @@ import React, { Fragment } from 'react';
 import ReactDOM from 'react-dom';
 import EmbarkJS from 'Embark/EmbarkJS';
 import PollManager from 'Embark/contracts/PollManager';
+import SingleChoice from 'Embark/contracts/SingleChoice';
 import AdminView from './components/AdminView';
 import Voting from './components/Voting';
 import SNT from  'Embark/contracts/SNT';
@@ -15,7 +16,7 @@ const getPolls = (number, pollMethod) => {
     const poll = pollMethod(i).call();
     polls.push(poll);
   }
-  return Promise.all(polls);
+  return Promise.all(polls.reverse());
 }
 
 class App extends React.Component {
@@ -28,6 +29,7 @@ class App extends React.Component {
   componentDidMount(){
     __embarkContext.execWhenReady(() => {
       this._getPolls();
+      this._setVotingOptions();
     });
   }
 
@@ -39,9 +41,18 @@ class App extends React.Component {
     const { nPolls, poll } = PollManager.methods;
     const polls = await nPolls.call();
     const total = await polls.call();
+    if (total) this._setVotingOptions();
     getPolls(total, poll).then(rawPolls => { this.setState({ rawPolls })});
   }
 
+  async _setVotingOptions(){
+    const poll = await PollManager.methods.poll(0).call();
+    SingleChoice.options.address = poll._pollContract;
+    const yes = await SingleChoice.methods.getBallot(0).call();
+    const no = await SingleChoice.methods.getBallot(1).call();
+    this.setState({ votingOptions: { yes, no } })
+  }
+
   _renderStatus(title, available) {
     let className = available ? 'pull-right status-online' : 'pull-right status-offline';
     return <Fragment>

package.json

@@ -19,6 +19,7 @@
   "dependencies": {
     "@material-ui/core": "^1.3.0",
     "@material-ui/icons": "^1.1.0",
+    "@material-ui/lab": "^1.0.0-alpha.5",
     "babel-plugin-transform-object-rest-spread": "^6.26.0",
     "babel-preset-stage-2": "^6.24.1",
     "bignumber.js": "^5.0.0",