Fabo/2330 poquito requests 2

PENDING.md

@@ -1,3 +1,8 @@
 ### Added
 
-- [\#2149](https://github.com/cosmos/voyager/issues/2149) display multi-message transactions @fedekunze
+- [\#2149](https://github.com/cosmos/voyager/issues/2149) display multi-message transactions @fedekunze
+
+### Fixed
+
+- [\#2330](https://github.com/cosmos/voyager/pull/2330) Fixed rewards not updating as expected @faboweb
+- [\#2330](https://github.com/cosmos/voyager/pull/2330) Fixed transactions not loading when refreshing on PageTransactions @faboweb

app/src/renderer/components/common/TmBalance.vue

@@ -45,7 +45,8 @@ export default {
   },
   data() {
     return {
-      num
+      num,
+      lastUpdate: 0
     }
   },
   computed: {
@@ -85,8 +86,14 @@ export default {
     lastHeader: {
       immediate: true,
       handler(newHeader) {
-        const waitTenBlocks = Number(newHeader.height) % 10 === 0
-        if (this.session.signedIn && waitTenBlocks) {
+        const height = Number(newHeader.height)
+        // run the update queries the first time and after every 10 blocks
+        const waitedTenBlocks = height - this.lastUpdate >= 10
+        if (
+          this.session.signedIn &&
+          (this.lastUpdate === 0 || waitedTenBlocks)
+        ) {
+          this.lastUpdate = height
           this.$store.dispatch(`getTotalRewards`)
           this.$store.dispatch(`queryWalletBalances`)
         }

app/src/renderer/components/staking/TabMyDelegations.vue

@@ -73,7 +73,8 @@ export default {
     unbondTransactions: `Transactions currently in the undelegation period`,
     validatorURL: `/staking/validators`,
     time,
-    num
+    num,
+    lastUpdate: 0
   }),
   computed: {
     ...mapGetters([
@@ -130,18 +131,8 @@ export default {
     },
     lastHeader: {
       immediate: true,
-      handler(newHeader) {
-        const waitTwentyBlocks = Number(newHeader.height) % 20 === 0
-        if (
-          waitTwentyBlocks &&
-          this.yourValidators &&
-          this.yourValidators.length > 0
-        ) {
-          this.$store.dispatch(
-            `getRewardsFromAllValidators`,
-            this.yourValidators
-          )
-        }
+      handler() {
+        this.$store.dispatch(`getRewardsFromMyValidators`)
       }
     }
   },

app/src/renderer/components/staking/TabValidators.vue

@@ -24,54 +24,34 @@ export default {
     TmDataLoading,
     TmDataConnecting
   },
+  data: () => ({
+    lastUpdate: 0
+  }),
   computed: {
     ...mapGetters([
       `lastHeader`,
       `delegates`,
       `committedDelegations`,
       `connected`,
-      `session`
-    ]),
-    yourValidators(
-      {
-        committedDelegations,
-        delegates: { delegates },
-        session: { signedIn }
-      } = this
-    ) {
-      return (
-        signedIn &&
-        delegates.filter(
-          ({ operator_address }) => operator_address in committedDelegations
-        )
-      )
-    }
+      `session`,
+      `yourValidators`
+    ])
   },
   watch: {
     "session.signedIn": function(signedIn) {
       signedIn && this.$store.dispatch(`updateDelegates`)
     },
     lastHeader: {
       immediate: true,
-      handler(newHeader) {
-        const waitTwentyBlocks = Number(newHeader.height) % 20 === 0
-        if (
-          waitTwentyBlocks &&
-          this.yourValidators &&
-          this.yourValidators.length > 0
-        ) {
-          this.$store.dispatch(
-            `getRewardsFromAllValidators`,
-            this.yourValidators
-          )
-        }
+      handler() {
+        this.$store.dispatch(`getRewardsFromMyValidators`)
       }
     }
   },
   mounted() {
     this.$store.dispatch(`updateDelegates`)
     if (this.yourValidators) {
-      this.$store.dispatch(`getRewardsFromAllValidators`, this.yourValidators)
+      this.$store.dispatch(`getRewardsFromMyValidators`, this.yourValidators)
     }
   }
 }

app/src/renderer/components/wallet/PageTransactions.vue

@@ -78,8 +78,13 @@ export default {
       return this.orderedTransactions.length === 0
     }
   },
-  mounted() {
-    this.refreshTransactions()
+  watch: {
+    "session.signedIn": {
+      immediate: true,
+      handler() {
+        this.refreshTransactions()
+      }
+    }
   },
   methods: {
     async refreshTransactions({ $store, session } = this) {

app/src/renderer/vuex/getters.js

@@ -26,6 +26,11 @@ export const wallet = state => state.wallet
 
 // fee distribution
 export const distribution = state => state.distribution
+export const yourValidators = (state, getters) =>
+  state.session.signedIn ?
+    getters.delegates.delegates.filter(
+      ({ operator_address }) => operator_address in getters.committedDelegations
+    ) : []
 
 // staking
 export const liquidAtoms = state =>
@@ -101,4 +106,4 @@ export const nodeUrl = state =>
   state.connection.connected ? state.connection.nodeUrl : undefined
 
 export const blocks = state => (state.blocks ? state.blocks.blocks : [])
-export const block = state => (state.blocks ? state.blocks.block : [])
+export const block = state => (state.blocks ? state.blocks.block : [])

app/src/renderer/vuex/modules/delegates.js

@@ -11,7 +11,8 @@ export default ({ node }) => {
     globalPower: null,
     loading: false,
     loaded: false,
-    error: null
+    error: null,
+    lastValidatorsUpdate: 0
   }
   const state = JSON.parse(JSON.stringify(emptyState))
 
@@ -58,16 +59,28 @@ export default ({ node }) => {
     resetSessionData({ rootState }) {
       rootState.delegates = JSON.parse(JSON.stringify(emptyState))
     },
-    async updateSigningInfo({ commit }, validators) {
-      for (const validator of validators) {
-        if (validator.consensus_pubkey) {
-          const signing_info = await node.getValidatorSigningInfo(
-            validator.consensus_pubkey
-          )
-          if (!isEmpty(signing_info)) validator.signing_info = signing_info
+    async updateSigningInfo(
+      {
+        commit,
+        getters: { lastHeader }
+      },
+      validators
+    ) {
+      // throttle the update for validators for every 10 blocks
+      const waited10Blocks =
+        Number(lastHeader.height) - state.lastDelegatesUpdate >= 10
+      if (state.lastValidatorsUpdate === 0 || waited10Blocks) {
+        state.lastValidatorsUpdate = Number(lastHeader.height)
+        for (const validator of validators) {
+          if (validator.consensus_pubkey) {
+            const signing_info = await node.getValidatorSigningInfo(
+              validator.consensus_pubkey
+            )
+            if (!isEmpty(signing_info)) validator.signing_info = signing_info
+          }
         }
+        commit(`setDelegates`, validators)
       }
-      commit(`setDelegates`, validators)
     },
     async getDelegates({ state, commit, dispatch, rootState }) {
       commit(`setDelegateLoading`, true)

app/src/renderer/vuex/modules/distribution.js

@@ -7,6 +7,7 @@ export default ({ node }) => {
     loading: false,
     loaded: false,
     error: null,
+    lastValidatorRewardsUpdate: 0, // keep track of last update so we can throttle the interval
     /* totalRewards use the following format:
         {
             denom1: amount1,
@@ -69,9 +70,7 @@ export default ({ node }) => {
     resetSessionData({ rootState }) {
       rootState.distribution = JSON.parse(JSON.stringify(emptyState))
     },
-    async getTotalRewards(
-      { state, rootState: { session }, commit }
-    ) {
+    async getTotalRewards({ state, rootState: { session }, commit }) {
       state.loading = true
       try {
         const rewardsArray = await node.getDelegatorRewards(session.address)
@@ -86,7 +85,10 @@ export default ({ node }) => {
       state.loading = false
     },
     async withdrawAllRewards(
-      { rootState: { wallet }, dispatch },
+      {
+        rootState: { wallet },
+        dispatch
+      },
       { password, submitType }
     ) {
       await dispatch(`sendTx`, {
@@ -99,16 +101,38 @@ export default ({ node }) => {
       await dispatch(`queryWalletBalances`)
       await dispatch(`getAllTxs`)
     },
-    async getRewardsFromAllValidators({ state, dispatch }, validators) {
-      state.loading = true
-      await Promise.all(validators.map(validator =>
-        dispatch(`getRewardsFromValidator`, validator.operator_address)
-      ))
-      state.loading = false
-      state.loaded = true
+    async getRewardsFromMyValidators(
+      {
+        state,
+        dispatch,
+        getters: { lastHeader, yourValidators }
+      }
+    ) {
+      // throttle the update of validator rewards to every 20 blocks
+      const waitedTwentyBlocks =
+        Number(lastHeader.height) - state.lastValidatorRewardsUpdate >= 20
+      if (
+        (state.lastValidatorRewardsUpdate === 0 || waitedTwentyBlocks) &&
+        yourValidators &&
+        yourValidators.length > 0
+      ) {
+        state.lastValidatorRewardsUpdate = Number(lastHeader.height)
+        state.loading = true
+        await Promise.all(
+          yourValidators.map(validator =>
+            dispatch(`getRewardsFromValidator`, validator.operator_address)
+          )
+        )
+        state.loading = false
+        state.loaded = true
+      }
     },
     async getRewardsFromValidator(
-      { state, rootState: { session }, commit },
+      {
+        state,
+        rootState: { session },
+        commit
+      },
       validatorAddr
     ) {
       state.loading = true

test/unit/specs/components/common/TmBalance.spec.js

@@ -100,12 +100,27 @@ describe(`TmBalance`, () => {
     })
 
     describe(`should update balance and rewards `, () => {
-      it(`if user is signed in and wait for 10 blocks`, () => {
+      it(`if user is signed in initially`, () => {
         const $store = { dispatch: jest.fn() }
         const session = { signedIn: true }
         const newHeader = { height: `10` }
         TmBalance.watch.lastHeader.handler.call(
-          { session, $store },
+          { session, $store, lastUpdate: 0 },
+          newHeader)
+        expect($store.dispatch).toHaveBeenCalledWith(`getTotalRewards`)
+        expect($store.dispatch).toHaveBeenCalledWith(`queryWalletBalances`)
+      })
+
+      it(`if user is signed in and wait for 10 blocks`, () => {
+        const $store = { dispatch: jest.fn() }
+        const session = { signedIn: true }
+        const newHeader = { height: `20` }
+        TmBalance.watch.lastHeader.handler.call(
+          { session, $store, lastUpdate: 15 },
+          newHeader)
+        expect($store.dispatch).not.toHaveBeenCalled()
+        TmBalance.watch.lastHeader.handler.call(
+          { session, $store, lastUpdate: 5 },
           newHeader)
         expect($store.dispatch).toHaveBeenCalledWith(`getTotalRewards`)
         expect($store.dispatch).toHaveBeenCalledWith(`queryWalletBalances`)

test/unit/specs/components/staking/TabMyDelegations.spec.js

@@ -168,7 +168,7 @@ describe(`Component: TabMyDelegations`, () => {
             { $store, yourValidators },
             newHeader)
           expect($store.dispatch).not.toHaveBeenCalledWith(
-            `getRewardsFromAllValidators`,
+            `getRewardsFromMyValidators`,
             yourValidators
           )
         })
@@ -181,25 +181,10 @@ describe(`Component: TabMyDelegations`, () => {
             { $store, yourValidators },
             newHeader)
           expect($store.dispatch).not.toHaveBeenCalledWith(
-            `getRewardsFromAllValidators`,
+            `getRewardsFromMyValidators`,
             yourValidators
           )
         })
-
-        describe(`should update rewards `, () => {
-          it(`if has waited for 20 blocks and has delegations`, () => {
-            const $store = { dispatch: jest.fn() }
-            const yourValidators = [{}]
-            const newHeader = { height: `40` }
-            TabMyDelegations.watch.lastHeader.handler.call(
-              { $store, yourValidators },
-              newHeader)
-            expect($store.dispatch).toHaveBeenCalledWith(
-              `getRewardsFromAllValidators`,
-              yourValidators
-            )
-          })
-        })
       })
     })
   })