Move to ballots page after creation

package-lock.json

@@ -6839,6 +6839,11 @@
       "resolved": "https://registry.npmjs.org/mobx-react-devtools/-/mobx-react-devtools-4.2.15.tgz",
       "integrity": "sha1-iBwDj7g9tN/9HnK7r1N00msv3rs="
     },
+    "mobx-react-router": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/mobx-react-router/-/mobx-react-router-4.0.1.tgz",
+      "integrity": "sha1-cvZ7XGN9GHWVQVUA6K+lzdsiMas="
+    },
     "mock-fs": {
       "version": "4.4.2",
       "resolved": "https://registry.npmjs.org/mock-fs/-/mock-fs-4.4.2.tgz",

package.json

@@ -35,6 +35,7 @@
     "mobx": "^3.4.1",
     "mobx-react": "^4.3.5",
     "mobx-react-devtools": "^4.2.15",
+    "mobx-react-router": "^4.0.1",
     "moment": "^2.20.1",
     "node-sass-chokidar": "0.0.3",
     "npm-run-all": "^4.1.2",

src/App.js

@@ -22,16 +22,15 @@ class App extends Component {
   }
 
   render() {
-    this.rootPath = '/poa-dapps-voting'
     const { commonStore } = this.props;
     const loading = commonStore.loading ? <Loading /> : ''
     return (
       <div>
         {loading}
         <Header />
-        <Route exact path={`${this.rootPath}/`} render={this.onBallotsRender}/>
-        <Route path={`${this.rootPath}/new`} render={this.onNewBallotRender}/>
-        <Route path={`${this.rootPath}/settings`} render={this.onSettingsRender}/>
+        <Route exact path={`${commonStore.rootPath}/`} render={this.onBallotsRender}/>
+        <Route path={`${commonStore.rootPath}/new`} render={this.onNewBallotRender}/>
+        {/*<Route path={`${commonStore.rootPath}/settings`} render={this.onSettingsRender}/>*/}
         <Footer />
         <DevTools />
       </div>

src/components/Header.jsx

@@ -6,7 +6,7 @@ export const Header = () => (
     <div className="container">
       <Link to="/poa-dapps-voting" className="header-logo"></Link>
       <Link to="/poa-dapps-voting/new" className="header-new-ballot">New ballot</Link>
-      <Link to="/poa-dapps-voting/settings" className="header-settings">Settings</Link>
+      {/*<Link to="/poa-dapps-voting/settings" className="header-settings">Settings</Link>*/}
     </div>
   </header>
 );

src/components/NewBallot.jsx

@@ -7,8 +7,12 @@ import { KeysTypes } from './KeysTypes';
 import { BallotKeysMetadata } from './BallotKeysMetadata';
 import { BallotMinThresholdMetadata } from './BallotMinThresholdMetadata';
 import { BallotProxyMetadata } from './BallotProxyMetadata';
+import { browserHistory } from 'react-router';
 
-@inject("commonStore", "ballotStore", "validatorStore", "contractsStore")
+console.log("browserHistory:")
+console.log(browserHistory)
+
+@inject("commonStore", "ballotStore", "validatorStore", "contractsStore", "routing")
 @observer
 export class NewBallot extends React.Component {
   constructor(props) {
@@ -142,6 +146,7 @@ export class NewBallot extends React.Component {
 
   onClick = async () => {
     const { commonStore, contractsStore, ballotStore } = this.props;
+    const { location, push, goBack } = this.props.routing;
     commonStore.showLoading();
     const isValidVotingKey = contractsStore.isValidVotingKey;
     if (!isValidVotingKey) {
@@ -166,6 +171,12 @@ export class NewBallot extends React.Component {
       const curDate = new Date();
       let curDateInSeconds = moment(curDate).add(5, 'minute').unix();
       methodToCreateBallot(curDateInSeconds)
+      .on("receipt", () => {
+        commonStore.hideLoading();
+        swal("Congratulations!", "You successfully created a new ballot", "success").then((result) => {
+          push(`${commonStore.rootPath}`);
+        });
+      })
       .on("error", (e) => {
         commonStore.hideLoading();
         swal("Error!", e.message, "error");

src/index.js

@@ -4,6 +4,7 @@ import { Router, Route } from 'react-router-dom';
 import App from './App';
 import registerServiceWorker from './registerServiceWorker';
 import { Provider } from 'mobx-react';
+import { RouterStore, syncHistoryWithStore } from 'mobx-react-router';
 import commonStore from './stores/CommonStore';
 import validatorStore from './stores/ValidatorStore';
 import ballotStore from './stores/BallotStore';
@@ -13,8 +14,10 @@ import getWeb3 from './getWeb3';
 import "babel-polyfill";
 import createBrowserHistory from 'history/createBrowserHistory'
 
-const history = createBrowserHistory()
-const stores = { commonStore, contractsStore, ballotStore, validatorStore };
+const browserHistory = createBrowserHistory();
+const routingStore = new RouterStore();
+const stores = { commonStore, contractsStore, ballotStore, validatorStore, routing: routingStore };
+const history = syncHistoryWithStore(browserHistory, routingStore);
 
 function generateElement(msg){
   let errorNode = document.createElement("div");

src/stores/CommonStore.js

@@ -2,9 +2,11 @@ import { observable, computed, action } from 'mobx';
 
 class CommonStore {
 	@observable loading;
+	@observable rootPath;
 
 	constructor() {
 		this.loading = false;
+		this.rootPath = '/poa-dapps-voting'
 	}
 
 	@action("show loading")