Voting: Upgrade rxjs to v6 (#721)

* Upgrade to rxjs6 and simplify with toPromise * Add watch mode for background script * Use toPromise whereever possible * fixup! Upgrade to rxjs6 and simplify with toPromise
aragon · Mar 20, 2019 · 5f3fb51 · 5f3fb51
1 parent c0f56c0
commit 5f3fb51
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 63 deletions.
diff --git a/apps/voting/app/package.json b/apps/voting/app/package.json
@@ -14,6 +14,7 @@
     "react-dom": "^16.2.0",
     "react-linkify": "^0.2.2",
     "react-spring": "^5.7.2",
+    "rxjs": "^6.2.1",
     "seed-random": "^2.2.0",
     "styled-components": "4.1.3"
   },
@@ -41,8 +42,9 @@
   "scripts": {
     "lint": "eslint ./src",
     "sync-assets": "copy-aragon-ui-assets -n aragon-ui ./build && rsync -rtu ./public/ ./build",
-    "start": "npm run sync-assets && npm run build:script -- --no-minify && parcel serve index.html -p 3001 --out-dir build/",
+    "start": "npm run sync-assets && npm run watch:script & parcel serve index.html -p 3001 --out-dir build/",
     "build": "npm run sync-assets && npm run build:script && parcel build index.html --out-dir build/ --public-url \".\"",
+    "watch:script": "parcel watch src/script.js --out-dir build/ --no-hmr",
     "build:script": "parcel build src/script.js --out-dir build/"
   },
   "browserslist": [

diff --git a/apps/voting/app/src/App.js b/apps/voting/app/src/App.js
@@ -89,13 +89,11 @@ class App extends React.Component {
     this.setState({
       userAccountVotes: new Map(
         await Promise.all(
-          votes.map(
-            vote =>
-              new Promise((resolve, reject) => {
-                app
-                  .call('getVoterState', vote.voteId, userAccount)
-                  .subscribe(result => resolve([vote.voteId, result]), reject)
-              })
+          votes.map(vote =>
+            app
+              .call('getVoterState', vote.voteId, userAccount)
+              .toPromise()
+              .then(result => [vote.voteId, result])
           )
         )
       ),

diff --git a/apps/voting/app/src/components/VotePanelContent.js b/apps/voting/app/src/components/VotePanelContent.js
@@ -78,8 +78,8 @@ class VotePanelContent extends React.Component {
     if (tokenContract && user) {
       tokenContract
         .balanceOfAt(user, vote.data.snapshotBlock)
-        .first()
-        .subscribe(balance => {
+        .toPromise()
+        .then(balance => {
           const adjustedBalance = Math.floor(
             parseInt(balance, 10) / Math.pow(10, tokenDecimals)
           )
@@ -99,8 +99,8 @@ class VotePanelContent extends React.Component {
       // Get if user can vote
       app
         .call('canVote', vote.voteId, user)
-        .first()
-        .subscribe(canVote => {
+        .toPromise()
+        .then(canVote => {
           this.setState({ loadingCanVote: false, userCanVote: canVote })
         })
     } else {
@@ -116,8 +116,8 @@ class VotePanelContent extends React.Component {
 
       app
         .call('canExecute', vote.voteId)
-        .first()
-        .subscribe(canExecute => {
+        .toPromise()
+        .then(canExecute => {
           this.setState({ canExecute, loadingCanExecute: false })
         })
     }

diff --git a/apps/voting/app/src/rxjs.js b/apps/voting/app/src/rxjs.js
diff --git a/apps/voting/app/src/script.js b/apps/voting/app/src/script.js
@@ -1,5 +1,5 @@
 import Aragon from '@aragon/client'
-import { of } from './rxjs'
+import { of } from 'rxjs'
 import voteSettings, { hasLoadedVoteSettings } from './vote-settings'
 import { EMPTY_CALLSCRIPT } from './evmscript-utils'
 import tokenDecimalsAbi from './abi/token-decimals.json'
@@ -43,8 +43,9 @@ const retryEvery = (callback, initialRetryTimer = 1000, increaseFactor = 5) => {
 retryEvery(retry => {
   app
     .call('token')
-    .first()
-    .subscribe(initialize, err => {
+    .toPromise()
+    .then(initialize)
+    .catch(err => {
       console.error(
         'Could not start background script execution due to the contract not loading the token:',
         err
@@ -58,7 +59,7 @@ async function initialize(tokenAddr) {
 
   let tokenSymbol
   try {
-    tokenSymbol = await loadTokenSymbol(token)
+    tokenSymbol = await token.symbol().toPromise()
     const pctBase = parseInt(await app.call('PCT_BASE').toPromise(), 10)
     const supportRequiredPct = parseInt(
       await app.call('supportRequiredPct').toPromise(),
@@ -75,7 +76,7 @@ async function initialize(tokenAddr) {
 
   let tokenDecimals
   try {
-    tokenDecimals = (await loadTokenDecimals(token)) || '0'
+    tokenDecimals = (await token.decimals().toPromise()) || '0'
   } catch (err) {
     console.err(
       `Failed to load token decimals for token at ${tokenAddr} due to:`,
@@ -195,12 +196,10 @@ async function loadVoteDescription(vote) {
 }
 
 function loadVoteData(voteId) {
-  return new Promise(resolve => {
-    app
-      .call('getVote', voteId)
-      .first()
-      .subscribe(vote => resolve(loadVoteDescription(marshallVote(vote))))
-  })
+  return app
+    .call('getVote', voteId)
+    .toPromise()
+    .then(vote => loadVoteDescription(marshallVote(vote)))
 }
 
 async function updateVotes(votes, voteId, transform) {
@@ -232,22 +231,12 @@ async function updateState(state, voteId, transform) {
 
 function loadVoteSettings() {
   return Promise.all(
-    voteSettings.map(
-      ([name, key, type = 'string']) =>
-        new Promise((resolve, reject) =>
-          app
-            .call(name)
-            .first()
-            .map(val => {
-              if (type === 'time') {
-                return marshallDate(val)
-              }
-              return val
-            })
-            .subscribe(value => {
-              resolve({ [key]: value })
-            }, reject)
-        )
+    voteSettings.map(([name, key, type = 'string']) =>
+      app
+        .call(name)
+        .toPromise()
+        .then(val => (type === 'time' ? marshallDate(val) : val))
+        .then(value => ({ [key]: value }))
     )
   )
     .then(settings =>
@@ -260,24 +249,6 @@ function loadVoteSettings() {
     })
 }
 
-function loadTokenDecimals(tokenContract) {
-  return new Promise((resolve, reject) => {
-    tokenContract
-      .decimals()
-      .first()
-      .subscribe(resolve, reject)
-  })
-}
-
-function loadTokenSymbol(tokenContract) {
-  return new Promise((resolve, reject) => {
-    tokenContract
-      .symbol()
-      .first()
-      .subscribe(resolve, reject)
-  })
-}
-
 // Apply transformations to a vote received from web3
 // Note: ignores the 'open' field as we calculate that locally
 function marshallVote({