Show alert on clicking `New Ballot` button if MetaMask is locked

src/App.js

@@ -5,6 +5,9 @@ import React, { Component } from 'react'
 import { Header, Ballots, NewBallot, Settings, Footer } from './components'
 import { Route } from 'react-router-dom'
 import { inject, observer } from 'mobx-react'
+import swal from 'sweetalert2'
+import { messages } from './messages'
+import { constants } from './constants'
 
 @inject('commonStore', 'contractsStore')
 @observer
@@ -64,6 +67,18 @@ class App extends Component {
   }
 
   onNewBallotRender = () => {
+    const { commonStore, contractsStore } = this.props
+    if (!contractsStore.web3Instance) {
+      if (!commonStore.loading) {
+        swal({
+          title: 'Error',
+          html: messages.NO_METAMASK_MSG,
+          icon: 'error',
+          type: 'error'
+        })
+      }
+      return null
+    }
     return <NewBallot />
   }
 
@@ -111,7 +126,8 @@ class App extends Component {
   getNetIdClass() {
     const { contractsStore } = this.props
     const netId = contractsStore.netId
-    return netId === '77' || netId === '79' ? 'sokol' : ''
+    const isTestnet = netId === constants.NETID_SOKOL || netId === constants.NETID_DAI_TEST
+    return isTestnet ? 'sokol' : ''
   }
 
   render() {
@@ -128,6 +144,9 @@ class App extends Component {
       ''
     )
 
+    const netId = contractsStore.netId
+    const isTestnet = netId === constants.NETID_SOKOL || netId === constants.NETID_DAI_TEST
+
     return (
       <section className={`content ${this.state.showMobileMenu ? 'content-menu-open' : ''}`}>
         {loading}
@@ -141,7 +160,7 @@ class App extends Component {
         {search}
         <div
           className={`app-container ${this.state.showMobileMenu ? 'app-container-open-mobile-menu' : ''} ${
-            contractsStore.netId === '77' || contractsStore.netId === '79' ? 'sokol' : ''
+            isTestnet ? 'sokol' : ''
           }`}
         >
           <div className="container">

src/Loading.js

@@ -1,4 +1,5 @@
 import React from 'react'
+import { constants } from './constants'
 
 const styles = netId => {
   const core = {
@@ -9,11 +10,11 @@ const styles = netId => {
   }
 
   switch (netId) {
-    case '77':
-    case '79':
+    case constants.NETID_SOKOL:
+    case constants.NETID_DAI_TEST:
       return sokol
-    case '99':
-    case '100':
+    case constants.NETID_CORE:
+    case constants.NETID_DAI:
       return core
     default:
       return {}

src/components/BallotEmissionFundsMetadata.jsx

@@ -82,7 +82,7 @@ export class BallotEmissionFundsMetadata extends React.Component {
     } else if (this.noActiveBallotExists !== true) {
       note = <p>To be able to create a new ballot, the previous ballot of this type must be finalized.</p>
     }
-    if (contractsStore.netId === '77') {
+    if (contractsStore.netId === constants.NETID_SOKOL) {
       explorerLink = `https://sokol.poaexplorer.com/address/search/${contractsStore.emissionFunds.address}`
     } else {
       explorerLink = `https://poaexplorer.com/address/${contractsStore.emissionFunds.address}`

src/components/Footer.jsx

@@ -2,9 +2,10 @@ import React from 'react'
 import moment from 'moment'
 import { Link } from 'react-router-dom'
 import Socials from './Socials.jsx'
+import { constants } from '../constants'
 
 export const Footer = ({ netId }) => {
-  const isTestnet = netId === '77' || netId === '79'
+  const isTestnet = netId === constants.NETID_SOKOL || netId === constants.NETID_DAI_TEST
   const footerClassName = isTestnet ? 'sokol' : ''
 
   return (

src/components/Header.jsx

@@ -7,9 +7,10 @@ import menuOpenIconBase from '../assets/images/icons/icon-close.svg'
 import menuOpenIconSokol from '../assets/images/icons/icon-close-sokol.svg'
 import NavigationLinks from './NavigationLinks.jsx'
 import MobileMenuLinks from './MobileMenuLinks.jsx'
+import { constants } from '../constants'
 
 export const Header = ({ netId, baseRootPath, navigationData, showMobileMenu, onMenuToggle }) => {
-  const isTestnet = netId === '77' || netId === '79'
+  const isTestnet = netId === constants.NETID_SOKOL || netId === constants.NETID_DAI_TEST
   const headerClassName = isTestnet ? 'sokol' : ''
   const logoImageName = isTestnet ? logoSokol : logoBase
   const menuIcon = isTestnet ? menuIconSokol : menuIconBase

src/constants.js

@@ -24,6 +24,10 @@ constants.minBallotDurationInDays = 2
 constants.startTimeOffsetInMinutes = 5
 constants.endTimeDefaultInMinutes = 2890
 constants.getTransactionReceiptInterval = 5000
+constants.NETID_SOKOL = '77'
+constants.NETID_CORE = '99'
+constants.NETID_DAI_TEST = '79'
+constants.NETID_DAI = '100'
 module.exports = {
   constants
 }

src/contracts/addresses.js

@@ -1,3 +1,4 @@
+import { constants } from '../constants'
 import { addressesURL, wrongRepoAlert } from './helpers'
 // const local = {
 //     VOTING_TO_CHANGE_KEYS_ADDRESS: '0xecdbe3937cf6ff27f70480855cfe03254f915b48',
@@ -45,13 +46,13 @@ async function getContractsAddresses(branch) {
 
 function getAddresses(netId) {
   switch (netId) {
-    case '77':
+    case constants.NETID_SOKOL:
       return SOKOL_ADDRESSES
-    case '79':
+    case constants.NETID_DAI_TEST:
       return DAI_TEST_ADDRESSES
-    case '99':
+    case constants.NETID_CORE:
       return CORE_ADDRESSES
-    case '100':
+    case constants.NETID_DAI:
       return DAI_ADDRESSES
     default:
       return CORE_ADDRESSES
@@ -59,6 +60,6 @@ function getAddresses(netId) {
 }
 
 module.exports = {
-  getContractsAddresses: getContractsAddresses,
+  getContractsAddresses,
   networkAddresses: getAddresses
 }

src/contracts/helpers.js

@@ -29,13 +29,13 @@ function wrongRepoAlert(addr) {
 
 function getBranch(netId) {
   switch (netId) {
-    case '77':
+    case constants.NETID_SOKOL:
       return 'sokol'
-    case '79':
+    case constants.NETID_DAI_TEST:
       return 'dai-test'
-    case '99':
+    case constants.NETID_CORE:
       return 'core'
-    case '100':
+    case constants.NETID_DAI:
       return 'dai'
     default:
       return 'core'

src/getWeb3.js

@@ -1,4 +1,5 @@
 import { messages } from './messages'
+import { constants } from './constants'
 
 let getWeb3 = () => {
   return new Promise((resolve, reject) => {
@@ -16,19 +17,19 @@ let getWeb3 = () => {
           let netIdName
           console.log('netId', netId)
           switch (netId) {
-            case '100':
+            case constants.NETID_DAI:
               netIdName = 'Dai'
               console.log('This is Dai', netId)
               break
-            case '99':
+            case constants.NETID_CORE:
               netIdName = 'Core'
               console.log('This is Core', netId)
               break
-            case '79':
+            case constants.NETID_DAI_TEST:
               netIdName = 'Dai-Test'
               console.log('This is Dai-Test', netId)
               break
-            case '77':
+            case constants.NETID_SOKOL:
               netIdName = 'Sokol'
               console.log('This is Sokol', netId)
               break

src/index.js

@@ -15,6 +15,7 @@ import swal from 'sweetalert2'
 import getWeb3 from './getWeb3'
 import 'babel-polyfill'
 import createBrowserHistory from 'history/createBrowserHistory'
+import { constants } from './constants'
 
 const browserHistory = createBrowserHistory()
 const routingStore = new RouterStore()
@@ -60,7 +61,7 @@ class AppMainRouter extends Component {
           setValidatorMetadata
         ]
 
-        if (web3Config.netId === '77') {
+        if (web3Config.netId === constants.NETID_SOKOL) {
           // if we're in Sokol
           promises.push(contractsStore.setEmissionFunds(web3Config))
           promises.push(contractsStore.setVotingToManageEmissionFunds(web3Config))