Bug fixes (#333)

* fix(send): show p-chain available amount instead of x-chain

* fix(style): center the NFT card content in history panel

* fix(History): showing p-chain address in the history panel

* fix(style): add border radius to confirmation background

* fix(multisig-wallet): update console handling in the msig section

* chore(locale): update warning message for list loading

* feat(balance): deduct gas fee from native token balance calculation

* fix(validator): Correct uptime calculation to prevent 10000% display

src/components/SidePanels/History/ViewTypes/ImportExport.vue

@@ -11,13 +11,10 @@
     </div>
 </template>
 <script lang="ts">
-import { bintools } from '@/AVA'
-import { chainIdFromAlias, bnToBig } from '@/helpers/helper'
+import { aliasFromChainId, bnToBig } from '@/helpers/helper'
 import { Vue, Component, Prop } from 'vue-property-decorator'
 import { ITransactionData } from '@/store/modules/history/types'
-import { ava } from '@/AVA'
 import { BN } from '@c4tplatform/caminojs/dist'
-import { bnToBig } from '@/helpers/helper'
 
 @Component
 export default class ImportExport extends Vue {
@@ -55,7 +52,7 @@ export default class ImportExport extends Vue {
 
     get chainAlias() {
         let chainId = this.isExport ? this.fromChainId : this.destinationChainId
-        return chainIdFromAlias(chainId)
+        return aliasFromChainId(chainId)
     }
 
     get amt(): BN {

src/components/SidePanels/TxHistoryNftFamilyGroup.vue

@@ -92,6 +92,8 @@ $countW: 18px;
 }
 
 .nft_card {
+    display: flex;
+    justify-content: center;
     height: 35px !important;
     width: 35px !important;
     background-color: var(--bg-light);

src/components/misc/BalancePopup/BalanceDropdown.vue

@@ -8,6 +8,7 @@
             @select="onselect"
             :assets="assetArray"
             :disabled-ids="disabledIds"
+            :chain-id="chainId"
         ></AvmTokenSelect>
     </div>
 </template>
@@ -18,6 +19,7 @@ import { Vue, Component, Prop, Ref, Model } from 'vue-property-decorator'
 import BalancePopup from '@/components/misc/BalancePopup/BalancePopup.vue'
 import AvaAsset from '@/js/AvaAsset'
 import AvmTokenSelect from '@/components/modals/AvmTokenSelect.vue'
+import { ChainIdType } from '@/constants'
 
 @Component({
     components: {
@@ -31,6 +33,7 @@ export default class BalanceDropdown extends Vue {
     @Prop({ default: () => [] }) disabled_assets!: AvaAsset[]
     @Prop({ default: false }) disabled!: boolean
     @Model('change', { type: AvaAsset }) readonly asset!: AvaAsset
+    @Prop() chainId!: ChainIdType
 
     get assetArray(): AvaAsset[] {
         return this.$store.getters['Assets/walletAssetsArray']

src/components/misc/CurrencyInputDropdown.vue

@@ -21,6 +21,7 @@
                 :disabled_assets="disabled_assets"
                 v-model="asset_now"
                 :disabled="disabled"
+                :chain-id="chainId"
             ></BalanceDropdown>
             <div class="col_balance">
                 <p>

src/components/misc/EVMInputDropdown/EVMInputDropdown.vue

@@ -167,7 +167,9 @@ export default class EVMInputDropdown extends Vue {
 
     get balance(): Big {
         if (this.token === 'native') {
-            return this.avaxBalance
+            let limit = new BN(this.gasLimit)
+            let fee = limit.mul(this.gasPrice)
+            return this.avaxBalance.sub(bnToBig(fee, this.denomination))
         }
         return this.token.balanceBig
     }

src/components/modals/AvmTokenSelect.vue

@@ -21,7 +21,7 @@
                         <p>{{ asset.name }}</p>
                     </div>
                     <div class="col_balance">
-                        <p>{{ asset | bal }}</p>
+                        <p>{{ asset | bal(chainId) }}</p>
                     </div>
                 </div>
             </div>
@@ -35,19 +35,23 @@ import { Vue, Component, Prop } from 'vue-property-decorator'
 import Modal from '@/components/modals/Modal.vue'
 import AvaAsset from '@/js/AvaAsset'
 import { bnToBig } from '@/helpers/helper'
+import { ChainIdType } from '@/constants'
 
 @Component({
     components: {
         Modal,
     },
     filters: {
-        bal(asset: AvaAsset) {
+        bal(asset: AvaAsset, chainId: string) {
+            if (chainId === 'P')
+                return bnToBig(asset.amountExtra, asset.denomination).toLocaleString()
             return bnToBig(asset.amount, asset.denomination).toLocaleString()
         },
     },
 })
 export default class PrivateKey extends Vue {
     @Prop() assets!: AvaAsset[]
+    @Prop() chainId!: ChainIdType
     @Prop({ default: () => [] }) disabledIds!: string[] // asset id | if nft the utxo id
 
     open(): void {

src/components/wallet/earn/ChainTransfer/Form.vue

@@ -42,7 +42,7 @@
         </div>
         <div class="confirmation_val" v-else>
             <label>{{ $t('earn.transfer.amount') }}</label>
-            <p>{{ formAmtText }} {{ nativeAssetSymbol }}</p>
+            <p style="border-radius: 6px">{{ formAmtText }} {{ nativeAssetSymbol }}</p>
         </div>
     </div>
 </template>

src/components/wallet/earn/Validate/ValidatorInfo.vue

@@ -35,7 +35,8 @@
                     <div>
                         <Tooltip style="display: inline-block" :text="$t('validator.info.up_time')">
                             <v-icon class="icon-mdi-camino">mdi-arrow-up-bold</v-icon>
-                            <label>{{ upTime.toFixed() }} %</label>
+                            <label v-if="initialized">{{ upTime.toFixed() }} %</label>
+                            <Spinner v-else />
                         </Tooltip>
                     </div>
                     <div>
@@ -77,14 +78,16 @@
 </template>
 <script lang="ts">
 import 'reflect-metadata'
-import { Component, Prop, Vue } from 'vue-property-decorator'
+import { Component, Prop, Vue, Watch } from 'vue-property-decorator'
 import Spinner from '@/components/misc/Spinner.vue'
 import moment from 'moment'
 import { ava } from '@/AVA'
 import { BN } from '@c4tplatform/caminojs'
 import AvaxInput from '@/components/misc/AvaxInput.vue'
 import Tooltip from '@/components/misc/Tooltip.vue'
 import { ValidatorRaw } from '@/components/misc/ValidatorList/types'
+import { AvaNetwork } from '@/js/AvaNetwork'
+import axios from 'axios'
 
 @Component({
     name: 'validator_info',
@@ -106,6 +109,8 @@ export default class ValidatorInfo extends Vue {
     txID: string = ''
 
     loading: boolean = true
+    nodeVersion: string = ''
+    initialized: boolean = false
 
     mounted() {
         this.getInformationValidator()
@@ -120,8 +125,83 @@ export default class ValidatorInfo extends Vue {
         return ava.getNetwork().P.minStake
     }
 
-    getInformationValidator() {
+    get activeNetwork(): null | AvaNetwork {
+        return this.$store?.state?.Network?.selectedNetwork
+    }
+
+    async fetchNodeVersion() {
+        if (this.activeNetwork && this.activeNetwork.url) {
+            await axios
+                .post(this.activeNetwork.url + '/ext/info', {
+                    jsonrpc: '2.0',
+                    id: 1,
+                    method: 'info.getNodeVersion',
+                })
+                .then((res) => {
+                    const data = res.data
+                    if (data && data.result && data.result.gitVersion) {
+                        this.nodeVersion = data.result.gitVersion.slice(1) // remove v
+                    }
+                })
+                .finally(() => {
+                    this.initialized = true
+                })
+        }
+    }
+
+    checkNodeVersionFlag(targetVersion: string): boolean {
+        if (!this.initialized) {
+            throw new Error('Provider not initialized yet')
+        }
+
+        if (!this.nodeVersion) {
+            throw new Error('Node version not exists, function uncallable')
+        }
+
+        const versionRegex = /^\d+\.\d+\.\d+(-rc\d+)?$/
+        if (!versionRegex.test(targetVersion)) {
+            throw new Error(
+                `Invalid version format: ${targetVersion}. Correct version is of type major.minor.path e.g 1.2.3-rc2`
+            )
+        }
+
+        const [coreTargetVersion, targetVariant] = targetVersion.split('-')
+        const [coreNodeVersion, nodeVariant] = this.nodeVersion.split('-')
+
+        const [targetMajor, targetMinor, targetPatch] = coreTargetVersion.split('.').map(Number)
+        const [nodeMajor, nodeMinor, nodePatch] = coreNodeVersion.split('.').map(Number)
+
+        if (targetMajor !== nodeMajor) {
+            return targetMajor < nodeMajor
+        }
+
+        if (targetMinor !== nodeMinor) {
+            return targetMinor < nodeMinor
+        }
+
+        if (targetPatch !== nodePatch) {
+            return targetPatch < nodePatch
+        }
+
+        if (nodeVariant) {
+            return targetVariant <= nodeVariant
+        }
+
+        return true
+    }
+
+    formatUptime(uptime: string): number {
+        const versionFlag = this.checkNodeVersionFlag('0.4.10-rc3')
+        const value = versionFlag
+            ? Math.round(parseFloat(uptime))
+            : Math.round(parseFloat(uptime) * 100)
+
+        return value
+    }
+
+    async getInformationValidator() {
         try {
+            await this.fetchNodeVersion()
             this.loading = true
             let today = moment()
 
@@ -131,7 +211,7 @@ export default class ValidatorInfo extends Vue {
             this.endTime = moment(new Date(parseInt(this.nodeInfo.endTime) * 1000)).format(
                 'MMMM Do YYYY, h:mm:ss a'
             )
-            this.upTime = parseFloat(this.nodeInfo.uptime) * 100
+            this.upTime = this.formatUptime(this.nodeInfo.uptime)
 
             var reaminingValidationDuration = moment.duration(
                 moment(new Date(parseInt(this.nodeInfo.endTime) * 1000)).diff(today)

src/locales/en.json

@@ -861,7 +861,7 @@
         "rewarded": "Rewarded",
         "not_rewarded": "Not Rewarded",
         "loading": "Loading transaction history..",
-        "warn_loading": "This list might be incomplete and out of order.",
+        "warn_loading": "This list might be incomplete and not in the right order.",
         "error_api": "Explorer API Not Found",
         "error_api_desc": "You must provide an @.project:(0) Explorer API for this network to view transaction history.",
         "start": "Stake Start Date",

src/views/EditMultisigWallet.vue

@@ -745,8 +745,7 @@ export default class EditMultisigWallet extends Vue {
             const msigAlias = this.activeWallet?.getStaticAddress('P')
             const localStorageAccountIndex = this.$store.state.Accounts.accountIndex
 
-            if (localStorageAccountIndex === null || localStorageAccountIndex === undefined)
-                throw new Error('account is not set in local storage')
+            if (localStorageAccountIndex === null || localStorageAccountIndex === undefined) return
 
             let accounts = JSON.parse(localStorage.getItem('accounts') || '[]')
             if (accounts[localStorageAccountIndex]) {
@@ -778,12 +777,9 @@ export default class EditMultisigWallet extends Vue {
 
                 accounts[localStorageAccountIndex].multisignatures = targetMultisignatures
                 localStorage.setItem('accounts', JSON.stringify(accounts))
-            } else console.error(`Account with index ${localStorageAccountIndex} does not exist.`)
-        } catch (error) {
-            console.error(
-                'An error occurred while updating multisig account in local storage: ',
-                error
-            )
+            } else console.warn(`Account with index ${localStorageAccountIndex} does not exist.`)
+        } catch (err) {
+            console.warn('Error:', err)
         }
     }
 }

src/views/wallet/Validator.vue

@@ -119,6 +119,7 @@ import { AddressState } from '@c4tplatform/caminojs/dist/apis/platformvm'
 import Big from 'big.js'
 import 'reflect-metadata'
 import { Component, Vue, Watch } from 'vue-property-decorator'
+import { AvaNetwork } from '@/js/AvaNetwork'
 
 @Component({
     name: 'validator',
@@ -157,6 +158,10 @@ export default class Validator extends Vue {
         )
     }
 
+    get activeNetwork(): null | AvaNetwork {
+        return this.$store?.state?.Network?.selectedNetwork
+    }
+
     verifyValidatorIsReady(val: ValidatorRaw) {
         this.nodeInfo = val
     }
@@ -182,6 +187,7 @@ export default class Validator extends Vue {
         clearInterval(this.intervalID)
     }
 
+    @Watch('activeNetwork')
     @Watch('$store.state.networkName')
     @Watch('$store.state.activeWallet')
     async evaluateCanRegisterNode() {