added progress percentage for events fetching #6

Closed
Freezy wants to merge 3 commits from refs/pull/6/head into staging
20 changed files with 2220685 additions and 2 deletions
Showing only changes of commit 8432540bf8 - Show all commits

@ -3,6 +3,7 @@
<div class="loading-container"> <div class="loading-container">
<div class="loading-tornado" data-test="tornado_loader"></div> <div class="loading-tornado" data-test="tornado_loader"></div>
<div class="loading-message">{{ message }}...</div> <div class="loading-message">{{ message }}...</div>
<div v-if="progress >= 0" class="loading-message">{{ progress }}%</div>
<approve-loader v-if="isApprove" /> <approve-loader v-if="isApprove" />
</div> </div>
</b-loading> </b-loading>
@ -19,7 +20,7 @@ export default {
computed: { computed: {
...mapGetters('metamask', ['isWalletConnect']), ...mapGetters('metamask', ['isWalletConnect']),
...mapState('metamask', ['providerName']), ...mapState('metamask', ['providerName']),
...mapState('loading', ['enabled', 'message', 'type']), ...mapState('loading', ['enabled', 'message', 'progress', 'type']),
isApprove() { isApprove() {
return this.type === 'approve' return this.type === 'approve'
} }

@ -341,6 +341,7 @@ export default {
if (currency !== this.nativeCurrency) { if (currency !== this.nativeCurrency) {
this.$store.dispatch('application/setDefaultEthToReceive', { currency }) this.$store.dispatch('application/setDefaultEthToReceive', { currency })
} }
this.$store.dispatch('loading/updateProgress', { progress: 100 })
this.depositsPast = Number(depositsPast) <= 0 ? 0 : depositsPast this.depositsPast = Number(depositsPast) <= 0 ? 0 : depositsPast
this.depositTxHash = txHash this.depositTxHash = txHash
this.depositTimestamp = timestamp this.depositTimestamp = timestamp

@ -9,6 +9,13 @@ import { sleep, formatEvents, capitalizeFirstLetter } from '@/utils'
const supportedCaches = ['1', '56', '100', '137'] const supportedCaches = ['1', '56', '100', '137']
let store
if (process.browser) {
window.onNuxtReady(({ $store }) => {
store = $store
})
}
class EventService { class EventService {
constructor({ netId, amount, currency, factoryMethods }) { constructor({ netId, amount, currency, factoryMethods }) {
this.idb = window.$nuxt.$indexedDB(netId) this.idb = window.$nuxt.$indexedDB(netId)
@ -278,6 +285,7 @@ class EventService {
const part = Math.ceil(blockDifference / numberParts) const part = Math.ceil(blockDifference / numberParts)
let events = [] let events = []
let loadedBlocks = 0
let toBlock = fromBlock + part let toBlock = fromBlock + part
if (fromBlock < currentBlockNumber) { if (fromBlock < currentBlockNumber) {
@ -285,6 +293,9 @@ class EventService {
toBlock = 'latest' toBlock = 'latest'
numberParts = 1 numberParts = 1
} }
if (store.state.loading.progress !== 98) {
store.dispatch('loading/updateProgress', { message: 'Fetching the past events', progress: 0 })
}
for (let i = 0; i < numberParts; i++) { for (let i = 0; i < numberParts; i++) {
try { try {
@ -293,8 +304,18 @@ class EventService {
if (partOfEvents) { if (partOfEvents) {
events = events.concat(partOfEvents.events) events = events.concat(partOfEvents.events)
} }
loadedBlocks += toBlock - fromBlock
fromBlock = toBlock fromBlock = toBlock
toBlock += part toBlock += part
const progressInt = parseInt((loadedBlocks / blockDifference) * 100)
console.log('Progress: ', progressInt)
if (store.state.loading.progress !== 98) {
store.dispatch('loading/updateProgress', {
message: 'Fetching the past events',
progress: progressInt === 100 ? 98 : progressInt
})
}
} catch { } catch {
numberParts = numberParts + 1 numberParts = numberParts + 1
} }

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

@ -1,6 +1,7 @@
export const state = () => { export const state = () => {
return { return {
message: '', message: '',
progress: '',
Review

Let's keep state variable's types consistent, uninitialised loading state could be better detected using a default value of -1.

Let's keep state variable's types consistent, uninitialised loading state could be better detected using a default value of `-1`.
enabled: false, enabled: false,
type: null type: null
} }
@ -9,14 +10,16 @@ export const state = () => {
export const getters = {} export const getters = {}
export const mutations = { export const mutations = {
ENABLE(state, { message, type }) { ENABLE(state, { message, progress, type }) {
state.message = message state.message = message
state.enabled = true state.enabled = true
state.progress = progress
state.type = type state.type = type
}, },
DISABLE(state) { DISABLE(state) {
state.message = '' state.message = ''
state.enabled = false state.enabled = false
state.progress = ''
state.type = null state.type = null
} }
} }
@ -28,6 +31,9 @@ export const actions = {
changeText({ commit }, { message, type }) { changeText({ commit }, { message, type }) {
commit('ENABLE', { message, type }) commit('ENABLE', { message, type })
}, },
updateProgress({ commit }, { message, progress }) {
commit('ENABLE', { message, progress })
},
disable({ commit }) { disable({ commit }) {
commit('DISABLE') commit('DISABLE')
}, },