Update bridge-ui (#39)

* Renamed bridge-ui to ui, removed submodule

* Re-added submodules. Pointing at 2.2.0

* Updated workspace name.

* Removed package-lock.json.

* Updated ui contracts to 2.3.0-rc0, installed node modules.

* Added linting to ui

* Integrated UI lint, test and build into CI.

* Added readme for merging.

* Consistent eslint module

* Included plugins in dev dependencies.

* Changed eslint version.

* Add yarn.lock

* Update deprecated node api.

* Remove travis badge and config in ui

* Update link to oracle in ui dependencies.

* Remove duplicated gitter.

* Remove unimplemented coverage and dependencies badges.

* Update links in step 5 and 6 in UI

* Cosmetic.

.circleci/config.yml

@@ -1,5 +1,13 @@
 version: 2
 jobs:
+  build:
+    docker:
+      - image: circleci/node:10.15
+    steps:
+      - checkout
+      - run: git submodule update --init
+      - run: yarn
+      - run: yarn run build
   lint:
     docker:
       - image: circleci/node:10.15

.gitmodules

@@ -1,6 +1,6 @@
 [submodule "oracle/submodules/poa-bridge-contracts"]
 	path = oracle/submodules/poa-bridge-contracts
 	url = https://github.com/poanetwork/poa-bridge-contracts.git
-[submodule "bridge-ui/submodules/poa-bridge-contracts"]
-	path = bridge-ui/submodules/poa-bridge-contracts
+[submodule "ui/submodules/poa-bridge-contracts"]
+	path = ui/submodules/poa-bridge-contracts
 	url = https://github.com/poanetwork/poa-bridge-contracts.git

README.md

@@ -48,6 +48,10 @@ To install dependencies:
 
 `yarn install`
 
+To build all projects:
+
+`yarn run build`
+
 Running linter for all JS projects:
 
 `yarn lint`

bridge-ui/.travis.yml

@@ -1,39 +0,0 @@
-language: node_js
-node_js:
-  - "8"
-sudo: required
-
-services:
-- docker
-
-dist: trusty
-addons:
-  apt:
-    sources:
-      - google-chrome
-    packages:
-      - google-chrome-stable
-
-#cache:
-#  directories:
-#  - node_modules
-
-install:
-
-before_script:
-
-  - export DISPLAY=:99.0
-  - sh -e /etc/init.d/xvfb start
-  - sleep 3
-  - wget -N http://chromedriver.storage.googleapis.com/2.30/chromedriver_linux64.zip -P ~/
-  - unzip ~/chromedriver_linux64.zip -d ~/
-  - rm ~/chromedriver_linux64.zip
-  - sudo mv -f ~/chromedriver /usr/local/share/
-  - sudo chmod +x /usr/local/share/chromedriver
-  - sudo ln -s /usr/local/share/chromedriver /usr/local/bin/chromedriver
-
-script:
-  - npm run coverage
-  - cd e2e-script && ./run-tests.sh
-after_script:
-  - npm run coveralls

monitor/package.json

@@ -21,7 +21,7 @@
     "node": ">=8.9"
   },
   "devDependencies": {
-    "eslint": "^5.6.0",
+    "eslint": "5.12.0",
     "eslint-config-airbnb": "^17.1.0",
     "eslint-config-prettier": "^3.1.0",
     "eslint-plugin-import": "^2.14.0",

oracle/package.json

@@ -40,7 +40,7 @@
     "chai": "^4.1.2",
     "chai-as-promised": "^7.1.1",
     "concurrently": "^3.6.0",
-    "eslint": "^5.6.0",
+    "eslint": "5.12.0",
     "eslint-config-airbnb-base": "^12.1.0",
     "eslint-config-prettier": "^2.9.0",
     "eslint-plugin-import": "^2.12.0",

oracle/src/utils/message.js

@@ -14,22 +14,22 @@ function createMessage({
   expectedMessageLength
 }) {
   recipient = strip0x(recipient)
-  assert.equal(recipient.length, 20 * 2)
+  assert.strictEqual(recipient.length, 20 * 2)
 
   value = Web3Utils.numberToHex(value)
   value = Web3Utils.padLeft(value, 32 * 2)
 
   value = strip0x(value)
-  assert.equal(value.length, 64)
+  assert.strictEqual(value.length, 64)
 
   transactionHash = strip0x(transactionHash)
-  assert.equal(transactionHash.length, 32 * 2)
+  assert.strictEqual(transactionHash.length, 32 * 2)
 
   bridgeAddress = strip0x(bridgeAddress)
-  assert.equal(bridgeAddress.length, 20 * 2)
+  assert.strictEqual(bridgeAddress.length, 20 * 2)
 
   const message = `0x${recipient}${value}${transactionHash}${bridgeAddress}`
-  assert.equal(message.length, 2 + 2 * expectedMessageLength)
+  assert.strictEqual(message.length, 2 + 2 * expectedMessageLength)
   return message
 }
 
@@ -64,7 +64,7 @@ function parseMessage(message) {
 }
 
 function signatureToVRS(signature) {
-  assert.equal(signature.length, 2 + 32 * 2 + 32 * 2 + 2)
+  assert.strictEqual(signature.length, 2 + 32 * 2 + 32 * 2 + 2)
   signature = strip0x(signature)
   const v = parseInt(signature.substr(64 * 2), 16)
   const r = `0x${signature.substr(0, 32 * 2)}`

package.json

@@ -11,13 +11,14 @@
   },
   "workspaces": [
     "oracle",
-    "bridge-ui",
-    "monitor",
-    "oracle-e2e"
+    "oracle-e2e",
+    "ui",
+    "monitor"
   ],
   "scripts": {
-    "lint": "yarn wsrun --exclude bridge-ui --exclude oracle-e2e lint",
-    "test": "yarn wsrun --exclude bridge-ui --exclude monitor --exclude oracle-e2e test",
+    "build": "yarn workspace ui run build",
+    "lint": "yarn wsrun --exclude oracle-e2e lint",
+    "test": "yarn wsrun --exclude monitor --exclude oracle-e2e test",
     "ansible-lint": "./deployment/lint.sh",
     "oracle-e2e": "./oracle-e2e/run-tests.sh",
     "clean": "rm -rf ./node_modules ./**/node_modules"

ui/.eslintignore

@@ -0,0 +1,4 @@
+node_modules
+submodules
+coverage
+e2e-script

ui/README.md

@@ -1,11 +1,6 @@
 # POA Token Bridge / UI
 DApp interface to transfer tokens and coins between chains.
 
-[![Build Status](https://travis-ci.org/poanetwork/bridge-ui.svg?branch=master)](https://travis-ci.org/poanetwork/bridge-ui)
-[![Gitter](https://badges.gitter.im/poanetwork/poa-bridge.svg)](https://gitter.im/poanetwork/poa-bridge?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
-[![Coverage Status](https://coveralls.io/repos/github/poanetwork/bridge-ui/badge.svg?branch=master)](https://coveralls.io/github/poanetwork/bridge-ui?branch=master)
-[![dependencies Status](https://david-dm.org/poanetwork/bridge-ui/status.svg)](https://david-dm.org/poanetwork/bridge-ui)
-
 ## Overview
 Please refer to the [POA Token Bridge](../README.md) overview first of all.
 
@@ -62,7 +57,7 @@ The following is an example setup using the POA Sokol testnet as the Home networ
 ### Dependencies
 
 - [poa-bridge-contracts](https://github.com/poanetwork/poa-bridge-contracts)
-- [token-bridge](https://github.com/poanetwork/token-bridge)
+- [oracle](../oracle/README.md)
 - [node.js](https://nodejs.org/en/download/)
 - [AlphaWallet](https://alphawallet.github.io/AlphaWallet-Download-Page/) or [Nifty Wallet](https://github.com/poanetwork/nifty-wallet) or [MetaMask](https://metamask.io/)
 
@@ -97,9 +92,10 @@ The following is an example setup using the POA Sokol testnet as the Home networ
       * `FOREIGN_RPC_URL`=https://kovan.infura.io/mew
     * When deployment is finished, check that the `bridgeDeploymentResults.json` file exists in the `poa-bridge-contracts/deploy` directory and includes the bridge contract addresses.  
 
-5. Install and run the POA Token Bridge.
-    * Got to the `sokol-kovan-bridge` folder and `git clone https://github.com/poanetwork/token-bridge`
-    * Follow instructions in the [POA Token Bridge repo](https://github.com/poanetwork/token-bridge).
+5. Install and run the POA Token Bridge Oracle.
+    * Go to the `sokol-kovan-bridge` folder and `git clone https://github.com/poanetwork/tokenbridge`
+    * `cd tokenbridge/oracle`
+    * Follow instructions in the [Oracle](../oracle/README.md).
 
 If successful, you will see bridge processes run when you issue a command. For example, run `npm run watcher:signature-request`
 
@@ -123,12 +119,15 @@ If successful, you will see bridge processes run when you issue a command. For e
 
 6. Keep the bridge processes running. Open a separate terminal window and go to the `sokol-kovan-bridge` folder to install and unpack this repository.
 
-    * `git clone https://github.com/poanetwork/bridge-ui.git`  
-    * `cd bridge-ui`
+    * `git clone https://github.com/poanetwork/tokenbridge`  
+    * `cd tokenbridge`
     * Update submodules  
 `git submodule update --init --recursive` 
     * Install dependencies  
-`npm install`  
+`yarn install`
+    * Go to UI sub-repository  
+`cd ui`
+
 _**Note**: The bridge UI configuration should be performed with an unprivileged Linux account or with the following flag `npm install --unsafe-perm`. [More information](https://docs.npmjs.com/misc/scripts#user)_
     * Create a .env file from the example file [.env.example](.env.example)  
 `cp .env.example .env`  
@@ -185,10 +184,18 @@ To run tests
 
 `npm run test`
 
+To run linting
+
+`npm run lint`
+
 To run tests with coverage
 
 `npm run coverage`
 
+To build the project
+
+`npm run build`
+
 ## Contributing
 
 See the [CONTRIBUTING](../CONTRIBUTING.md) document for contribution, testing and pull request protocol.

ui/package.json

@@ -1,5 +1,5 @@
 {
-  "name": "bridge-ui",
+  "name": "ui",
   "version": "0.1.0",
   "private": true,
   "homepage": "https://poanetwork.github.io/",
@@ -32,12 +32,14 @@
     "web3-utils": "1.0.0-beta.30"
   },
   "scripts": {
+    "lint": "eslint .",
     "select-css-theme": "node scripts/selectTheme.js",
     "build-css": "node-sass-chokidar src/assets/stylesheets -o src/assets/stylesheets --output-style=compressed -m application*.css",
     "watch-css": "nodemon -e scss -x \"npm run build-css\"",
     "start": "npm run build-css && npm run select-css-theme && react-app-rewired start",
     "build": "npm run compile:contracts && npm run build-css && npm run select-css-theme && react-app-rewired build",
-    "test": "react-app-rewired test --env=jsdom",
+    "test": "react-app-rewired test --env=jsdom --no-watch",
+    "test:watch": "react-app-rewired test --env=jsdom",
     "startE2e": "mocha -b ./e2e-script/test.js",
     "start:blocks": "node ./e2e-script/scripts/blocks.js",
     "coverage": "react-app-rewired test --env=jsdom --coverage",
@@ -49,8 +51,20 @@
     "postinstall": "cp lib/web3-eth/index.js ../node_modules/web3-eth/src && npm run compile:contracts"
   },
   "devDependencies": {
+    "eslint": "5.12.0",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-config-prettier": "^3.1.0",
+    "eslint-config-react-app": "^4.0.1",
+    "eslint-plugin-flowtype": "^3.8.1",
+    "eslint-plugin-import": "^2.14.0",
+    "eslint-plugin-jsx-a11y": "^6.2.1",
+    "eslint-plugin-node": "^7.0.1",
+    "eslint-plugin-prettier": "^2.6.2",
+    "eslint-plugin-react": "^7.13.0",
+    "eslint-plugin-react-hooks": "^1.6.0",
     "jest-dom": "^3.0.1",
     "nodemon": "^1.18.11",
+    "prettier": "^1.14.3",
     "react-testing-library": "^5.4.4"
   },
   "browserslist": [