feat: updated gasOracle library

components/DepositModalBox.vue

@@ -28,7 +28,6 @@
     <div v-show="isEnabledSaveFile" class="note">
       {{ $t('saveAsFile') }} <span class="has-text-primary">{{ filename }}</span>
     </div>
-    <gas-price-slider v-if="!eipSupported" v-model="gasPrice" @validate="onGasPriceValidate" />
     <template v-if="!isSetupAccount">
       <i18n tag="div" path="yourDontHaveAccount" class="notice">
         <template v-slot:account>
@@ -57,7 +56,7 @@
     <b-button
       v-else
       type="is-primary is-fullwidth"
-      :disabled="disableButton || (!isValidGasPrice && !eipSupported)"
+      :disabled="disableButton"
       data-test="send_deposit_button"
       @click="_sendDeposit"
     >
@@ -70,27 +69,22 @@
 import { mapActions, mapState, mapGetters } from 'vuex'
 
 import { sliceAddress } from '@/utils'
-import GasPriceSlider from '@/components/GasPriceSlider'
 import { ConnectButton } from '@/components/web3Connect'
 
 export default {
   components: {
-    ConnectButton,
-    GasPriceSlider
+    ConnectButton
   },
   data() {
     return {
       isBackuped: false,
       tooltipCopy: this.$t('clickToCopy'),
-      gasPrice: undefined,
-      isValidGasPrice: false,
       isEncrypted: false,
       copyTimer: null
     }
   },
   computed: {
     ...mapGetters('metamask', ['isLoggedIn']),
-    ...mapGetters('gasPrices', ['eipSupported']),
     ...mapGetters('txHashKeeper', ['addressExplorerUrl']),
     ...mapGetters('encryptedNote', ['isSetupAccount', 'accounts', 'isEnabledSaveFile']),
     ...mapState('application', ['note', 'prefix']),
@@ -135,13 +129,10 @@ export default {
     },
     async _sendDeposit() {
       this.$store.dispatch('loading/enable', { message: this.$t('preparingTransactionData') })
-      await this.sendDeposit({ gasPrice: this.gasPrice, isEncrypted: this.isEncrypted })
+      await this.sendDeposit({ isEncrypted: this.isEncrypted })
       this.$store.dispatch('loading/disable')
       this.$parent.close()
     },
-    onGasPriceValidate(value) {
-      this.isValidGasPrice = value
-    },
     async copyNoteAccount() {
       await this.$copyText(this.accounts.encrypt)
       this.onCopy()

components/GasPriceSlider.vue

@@ -1,132 +0,0 @@
-<template>
-  <div class="field field-slider">
-    <div class="label">
-      Gas Price
-      <b-field :class="hasError ? 'is-warning' : ''">
-        <b-input
-          ref="gasPriceInput"
-          v-model.number="input"
-          type="number"
-          :min="0"
-          custom-class="hide-spinner"
-          :use-html5-validation="false"
-          expanded
-          :style="{ width: reactiveWidth }"
-        ></b-input>
-        <div class="control has-text" @click="$refs.gasPriceInput.focus()">
-          <span>Gwei</span>
-        </div>
-      </b-field>
-    </div>
-    <b-slider
-      v-model="slider"
-      :min="0"
-      :max="2"
-      :custom-formatter="tooltipFormat"
-      bigger-slider-focus
-      lazy
-      rounded
-      @change="onChange"
-    >
-      <template v-for="(val, index) of Object.keys(gasPrices).filter((k) => k !== 'instant')">
-        <b-slider-tick :key="val" :value="index">{{ $t(`gasPriceSlider.${val}`) }}</b-slider-tick>
-      </template>
-    </b-slider>
-  </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex'
-import { debounce } from '@/utils'
-const { toWei, toHex } = require('web3-utils')
-
-export default {
-  inheritAttrs: false,
-  data() {
-    return {
-      input: null,
-      slider: 2,
-      hasError: false,
-      reactiveWidth: ''
-    }
-  },
-  computed: {
-    ...mapGetters('gasPrices', ['gasPrices'])
-  },
-  watch: {
-    input: {
-      handler(gasPrice) {
-        this.setWidth(gasPrice)
-        debounce(this.validateGasPrice, gasPrice)
-      }
-    }
-  },
-  mounted() {
-    this.input = this.gasPrices.fast
-    this.setWidth(this.input)
-  },
-  methods: {
-    onChange(index) {
-      this.input = this.getValueFromIndex(index)
-    },
-    tooltipFormat(index) {
-      return this.getValueFromIndex(index)
-    },
-    getValueFromIndex(index) {
-      switch (Number(index)) {
-        case 2:
-          return this.gasPrices.fast
-        case 1:
-          return this.gasPrices.standard
-        case 0:
-          return this.gasPrices.low
-      }
-    },
-    validateGasPrice(gasPrice) {
-      try {
-        let speed = ''
-        this.hasError = false
-
-        if (gasPrice === '') {
-          throw new Error('must not be an empty')
-        }
-        if (gasPrice <= 0) {
-          throw new Error('must be greater than zero')
-        }
-
-        if (gasPrice < this.gasPrices.standard) {
-          speed = 'low'
-          this.slider = 0
-        } else if (gasPrice === this.gasPrices.standard) {
-          this.slider = 1
-          speed = 'standard'
-        } else {
-          this.slider = 2
-          speed = 'fast'
-        }
-
-        if (gasPrice) {
-          gasPrice = {
-            speed,
-            value: toHex(toWei(gasPrice.toString(), 'gwei'))
-          }
-        }
-        this.$emit('input', gasPrice)
-      } catch (e) {
-        // eslint-disable-next-line no-console
-        console.error('Invalid gas price:', e.message)
-        this.hasError = true
-      } finally {
-        this.$emit('validate', !this.hasError)
-      }
-    },
-    setWidth(value) {
-      if (!value) {
-        value = 0
-      }
-
-      this.reactiveWidth = `${Math.min(75, Math.max(35, 19 + value && value.toString().length * 12))}px`
-    }
-  }
-}
-</script>

components/withdraw/WithdrawTotal.vue

@@ -13,7 +13,8 @@
       </div>
       <div v-if="withdrawType === 'relayer'" class="withdraw-data-item">
         {{ $t('gasPrice') }}
-        <span>{{ gasPrices.fast }} Gwei</span>
+
+        <span>{{ gasPriceInGwei }} Gwei</span>
       </div>
       <div v-if="withdrawType === 'relayer'" class="withdraw-data-item">
         {{ $t('networkFee') }}
@@ -72,7 +73,7 @@ export default {
     ...mapGetters('metamask', {
       networkCurrency: 'currency'
     }),
-    ...mapGetters('gasPrices', ['gasPrices']),
+    ...mapGetters('gasPrices', ['gasPriceInGwei']),
     ...mapGetters('token', ['toDecimals', 'fromDecimals']),
     ...mapGetters('application', ['networkFee']),
     ...mapGetters('price', ['tokenRate']),