(Feature) Adding three keys at once when adding a new validator

Relates to poanetwork#83, poanetwork#131 and poanetwork/poa-network-consensus-contracts#92.
varasev · Jun 9, 2018 · 661beb1 · 661beb1
1 parent 99eba74
commit 661beb1
Show file tree

Hide file tree

Showing 8 changed files with 73 additions and 13 deletions.
diff --git a/src/components/BallotCard.jsx b/src/components/BallotCard.jsx
@@ -487,7 +487,7 @@ export class BallotCard extends React.Component {
               </div>
             </div>
             <div className="info">
-              Minimum {threshold} from {contractsStore.validatorsLength} validators is required to pass the proposal
+              Minimum {threshold} from {contractsStore.validatorsLength} validators are required to pass the proposal
             </div>
             <div className="info">
               {this.memo}

diff --git a/src/components/BallotKeysMetadata.jsx b/src/components/BallotKeysMetadata.jsx
@@ -9,18 +9,47 @@ export class BallotKeysMetadata extends React.Component {
   render() {
     const options = this.props.contractsStore.validatorsMetadata.slice();
     const { ballotStore } = this.props;
+    let newVotingPayoutKeys = '';
+    if (ballotStore.isNewValidatorPersonalData) {
+      newVotingPayoutKeys = <div>
+        <div className="left">
+          <div className="form-el">
+            <label htmlFor="new-voting-key">New Voting Key</label>
+            <input type="text" id="new-voting-key"
+              value={ballotStore.ballotKeys.newVotingKey}
+              onChange={e => ballotStore.changeBallotMetadata(e, "newVotingKey", "ballotKeys")}
+            />
+            <p className="hint">
+              Voting key address of new validator. Example: 0xc70760D23557A4FDE612C0bE63b26EBD023C51Ee.
+            </p>
+          </div>
+        </div>
+        <div className="right">
+          <div className="form-el">
+            <label htmlFor="new-payout-key">New Payout Key</label>
+            <input type="text" id="new-payout-key"
+              value={ballotStore.ballotKeys.newPayoutKey}
+              onChange={e => ballotStore.changeBallotMetadata(e, "newPayoutKey", "ballotKeys")}
+            />
+            <p className="hint">
+              Payout key address of new validator. Example: 0xc70760D23557A4FDE612C0bE63b26EBD023C51Ee.
+            </p>
+          </div>
+        </div>
+      </div>;
+    }
     return (
       <div>
         <div>
           <div className="left">
             <div className="form-el">
-              <label htmlFor="key">Affected Key</label>
+              <label htmlFor="key">{ballotStore.isNewValidatorPersonalData ? 'New Mining Key' : 'Affected Key'}</label>
               <input type="text" id="key"
                 value={ballotStore.ballotKeys.affectedKey}
                 onChange={e => ballotStore.changeBallotMetadata(e, "affectedKey", "ballotKeys")}
               />
               <p className="hint">
-                Affected key address of validator to vote for. Example: 0xc70760D23557A4FDE612C0bE63b26EBD023C51Ee.
+                {ballotStore.isNewValidatorPersonalData ? 'Mining key address of new validator.' : 'Affected key address of validator to vote for.'} Example: 0xc70760D23557A4FDE612C0bE63b26EBD023C51Ee.
               </p>
             </div>
           </div>
@@ -33,12 +62,14 @@ export class BallotKeysMetadata extends React.Component {
                 value={ballotStore.ballotKeys.miningKey}
                 onChange={ballotStore.setMiningKey}
                 options={options}
+                disabled={ballotStore.isNewValidatorPersonalData}
               />
               <p className="hint">
                 Mining key address of validator to vote for. Example: 0xc70760D23557A4FDE612C0bE63b26EBD023C51Ee.
               </p>
             </div>
           </div>
+          {newVotingPayoutKeys}
           <div className="left">
             <div className="form-el">
               <label htmlFor="datetime-local">Ballot End</label>

diff --git a/src/components/NewBallot.jsx b/src/components/NewBallot.jsx
@@ -128,12 +128,22 @@ export class NewBallot extends React.Component {
       endTime: ballotStore.endTimeUnix,
       affectedKey: ballotStore.ballotKeys.affectedKey,
       affectedKeyType: ballotStore.ballotKeys.keyType,
+      newVotingKey: ballotStore.ballotKeys.newVotingKey,
+      newPayoutKey: ballotStore.ballotKeys.newPayoutKey,
       miningKey: ballotStore.ballotKeys.miningKey.value,
       ballotType: ballotStore.ballotKeys.keysBallotType,
       sender: contractsStore.votingKey,
       memo: ballotStore.memo
     };
-    let method = contractsStore.votingToChangeKeys.createBallot(inputToMethod);
+    let method;
+    if (
+      ballotStore.ballotKeys.keysBallotType === ballotStore.KeysBallotType.add &&
+      ballotStore.ballotKeys.keyType === ballotStore.KeyType.mining
+    ) {
+      method = contractsStore.votingToChangeKeys.createBallotToAddNewValidator(inputToMethod);
+    } else {
+      method = contractsStore.votingToChangeKeys.createBallot(inputToMethod);
+    }
     return method;
   }
 
@@ -271,7 +281,7 @@ export class NewBallot extends React.Component {
                 className={this.menuItemActive(ballotStore.BallotType.minThreshold)}
                 onClick={(e) => ballotStore.changeBallotType(e, ballotStore.BallotType.minThreshold)}
               >
-                Consenus Thershold Ballot
+                Consenus Threshold Ballot
               </div>
               <div
                 className={this.menuItemActive(ballotStore.BallotType.proxy)}

diff --git a/src/components/Validator.jsx b/src/components/Validator.jsx
@@ -2,8 +2,9 @@ import React from 'react';
 import { inject, observer } from "mobx-react";
 import Select from 'react-select';
 import PlacesAutocomplete, { geocodeByAddress } from 'react-places-autocomplete';
+import { constants } from "../constants";
 
-@inject("validatorStore")
+@inject("validatorStore", "ballotStore")
 @observer
 export class Validator extends React.Component {
   onSelectAutocomplete = async (data) => {
@@ -43,6 +44,17 @@ export class Validator extends React.Component {
     }
   }
 
+  componentDidMount() {
+    this.props.ballotStore.ballotKeys.miningKey = constants.NEW_MINING_KEY;
+  }
+
+  componentWillUnmount() {
+    const { ballotStore } = this.props;
+    if (JSON.stringify(ballotStore.ballotKeys.miningKey) === JSON.stringify(constants.NEW_MINING_KEY)) {
+      ballotStore.ballotKeys.miningKey = "";
+    }
+  }
+
   render() {
     const { validatorStore } = this.props;
     const inputProps = {

diff --git a/src/constants.js b/src/constants.js
@@ -1,5 +1,5 @@
 let constants = {};
-constants.CARD_FINALIZE_DESCRIPTION = "Finalization is available after ballot time is finished";
+constants.CARD_FINALIZE_DESCRIPTION = "Finalization is available after ballot time is finished<br />or all validators are voted";
 constants.organization = 'poanetwork';
 constants.repoName = 'poa-chain-spec';
 constants.addressesSourceFile = 'contracts.json';
@@ -12,6 +12,10 @@ constants.ABIsSources = {
 	'VotingToChangeMinThreshold': 'VotingToChangeMinThreshold.abi.json',
 	'VotingToChangeProxyAddress': 'VotingToChangeProxyAddress.abi.json'
 };
+constants.NEW_MINING_KEY = {
+	label: "New Mining Key",
+	value: "0x0000000000000000000000000000000000000000"
+};
 module.exports = {
-  constants
+	constants
 }
diff --git a/src/contracts/VotingToChangeKeys.contract.js b/src/contracts/VotingToChangeKeys.contract.js
@@ -21,6 +21,10 @@ export default class VotingToChangeKeys {
     return this.votingToChangeKeysInstance.methods.createBallot(startTime, endTime, affectedKey, affectedKeyType, miningKey, ballotType, memo).send({from: sender, gasPrice: this.gasPrice});
   }
 
+  createBallotToAddNewValidator({startTime, endTime, affectedKey, newVotingKey, newPayoutKey, sender, memo}) {
+    return this.votingToChangeKeysInstance.methods.createBallotToAddNewValidator(startTime, endTime, affectedKey, newVotingKey, newPayoutKey, memo).send({from: sender, gasPrice: this.gasPrice});
+  }
+
   vote(_id, choice, sender) {
     return this.votingToChangeKeysInstance.methods.vote(_id, choice).send({from: sender, gasPrice: this.gasPrice});
   }

diff --git a/src/stores/BallotStore.js b/src/stores/BallotStore.js
@@ -46,6 +46,8 @@ class BallotStore {
 			keysBallotType: null,
 			//memo: "",
 			affectedKey: "",
+			newVotingKey: "",
+			newPayoutKey: "",
 			miningKey: ""
 		};
 

diff --git a/src/stores/ContractsStore.js b/src/stores/ContractsStore.js
@@ -13,6 +13,7 @@ import commonStore from './CommonStore'
 import { BallotKeysCard } from "../components/BallotKeysCard";
 import { BallotMinThresholdCard } from "../components/BallotMinThresholdCard";
 import { BallotProxyCard } from "../components/BallotProxyCard";
+import { constants } from "../constants";
 
 import "babel-polyfill";
 
@@ -240,11 +241,7 @@ class ContractsStore {
 
 	@action
 	async getAllValidatorMetadata() {
-		const newMiningKey = {
-			label: "New Mining Key",
-			value: "0x0000000000000000000000000000000000000000"
-		}
-		this.validatorsMetadata.push(newMiningKey);
+		this.validatorsMetadata.push(constants.NEW_MINING_KEY);
 		const keys = await this.poaConsensus.getValidators();
 		keys.forEach(async (key) => {
 			const metadata = await this.validatorMetadata.getValidatorData({miningKey: key})