Feat/glacier urls (#391)

* feat: use subnets explorer url for transaction URLs

* feat: refactor URL util

* fix: use glacier for C chain txs

src/components/SidePanels/TxHistoryRow.vue

@@ -32,37 +32,30 @@ import { Vue, Component, Prop } from 'vue-property-decorator'
 
 import moment from 'moment'
 import TxHistoryNftFamilyGroup from '@/components/SidePanels/TxHistoryNftFamilyGroup.vue'
-import { AvaNetwork } from '@/js/AvaNetwork'
 import {
     isTransactionX,
     isTransactionC,
-    TransactionType,
     TransactionTypeName,
     XChainTransaction,
 } from '@/js/Glacier/models'
 import ImportExport from '@/components/SidePanels/History/ViewTypes/ImportExport.vue'
 import BaseTx from '@/components/SidePanels/History/ViewTypes/BaseTx.vue'
 import StakingTx from '@/components/SidePanels/History/ViewTypes/StakingTx.vue'
 import { PChainEmittedUtxo, Utxo, PChainTransaction } from '@avalabs/glacier-sdk'
-import getMemoFromByteString from '@/services/history/utils'
+import { getUrlFromTransaction } from '@/js/Glacier/getUrlFromTransaction'
+import { ava } from '@/AVA'
 
 @Component({
     components: {
-        // TxHistoryValue,
         TxHistoryNftFamilyGroup,
-        // TxHistoryValueFunctional,
     },
 })
 export default class TxHistoryRow extends Vue {
     @Prop() transaction!: XChainTransaction | PChainTransaction
 
     get explorerUrl(): string | null {
-        //TODO: Use a constant based on network id instead of the network config
-        let network: AvaNetwork = this.$store.state.Network.selectedNetwork
-        if (network.explorerSiteUrl) {
-            return `${network.explorerSiteUrl}/tx/${this.transaction.txHash}`
-        }
-        return null
+        const netID = ava.getNetworkID()
+        return getUrlFromTransaction(netID, this.transaction)
     }
 
     /**

src/components/wallet/activity/TxRow.vue

@@ -20,10 +20,6 @@
                         <span>{{ date.toLocaleTimeString() }}</span>
                     </p>
                 </div>
-                <!--                <div v-if="memo" class="memo">-->
-                <!--                    <label>MEMO</label>-->
-                <!--                    <p>{{ memo }}</p>-->
-                <!--                </div>-->
             </div>
             <div class="tx_detail">
                 <component :is="tx_comp" :transaction="source"></component>
@@ -38,23 +34,21 @@
 <script lang="ts">
 import { Vue, Component, Prop } from 'vue-property-decorator'
 import { AssetsDict, NftFamilyDict } from '@/store/modules/assets/types'
-import { PChainEmittedUtxo, Utxo, PChainTransaction } from '@avalabs/glacier-sdk'
-import { bnToBig } from '@/helpers/helper'
-import { BN, Buffer } from 'avalanche'
+import { PChainEmittedUtxo, Utxo } from '@avalabs/glacier-sdk'
 
 import StakingTx from '@/components/SidePanels/History/ViewTypes/StakingTx.vue'
 import BaseTx from '@/components/SidePanels/History/ViewTypes/BaseTx.vue'
 import ImportExport from '@/components/SidePanels/History/ViewTypes/ImportExport.vue'
 import moment from 'moment'
-import { AvaNetwork } from '@/js/AvaNetwork'
-import getMemoFromByteString from '@/services/history/utils'
+import { getUrlFromTransaction } from '@/js/Glacier/getUrlFromTransaction'
 import {
     TransactionType,
     isCChainImportTransaction,
     isTransactionX,
     isTransactionC,
     TransactionTypeName,
 } from '@/js/Glacier/models'
+import { ava } from '@/AVA'
 
 @Component({
     components: {
@@ -68,11 +62,8 @@ export default class TxRow extends Vue {
     @Prop() source!: TransactionType
 
     get explorerUrl(): string | null {
-        let network: AvaNetwork = this.$store.state.Network.selectedNetwork
-        if (network.explorerSiteUrl) {
-            return `${network.explorerSiteUrl}/tx/${this.source.txHash}`
-        }
-        return null
+        const netID = ava.getNetworkID()
+        return getUrlFromTransaction(netID, this.source)
     }
 
     get hasMultisig() {

src/js/Glacier/getTxURL.test.ts

@@ -0,0 +1,23 @@
+import { getTxURL } from '@/js/Glacier/getTxURL'
+
+describe('getTxURL', () => {
+    it('can get mainnet url for X Chain', () => {
+        const url = getTxURL('hash1', 'X', true)
+        expect(url).toEqual('https://subnets.avax.network/x-chain/tx/hash1')
+    })
+
+    it('can get mainnet url for P Chain', () => {
+        const url = getTxURL('hash1', 'P', true)
+        expect(url).toEqual('https://subnets.avax.network/p-chain/tx/hash1')
+    })
+
+    it('can get mainnet url for C Chain', () => {
+        const url = getTxURL('hash1', 'C', true)
+        expect(url).toEqual('https://avascan.info/blockchain/c/tx/hash1')
+    })
+
+    it('can get testnet url for X Chain', () => {
+        const url = getTxURL('hash1', 'X', false)
+        expect(url).toEqual('https://subnets-test.avax.network/x-chain/tx/hash1')
+    })
+})

src/js/Glacier/getTxURL.ts

@@ -0,0 +1,25 @@
+import { ChainIdType } from '@/constants'
+
+const mainnetBase = 'https://subnets.avax.network/'
+const fujiBase = 'https://subnets-test.avax.network/'
+
+const avascanMainnet = `https://avascan.info`
+const avascanFuji = `https://testnet.avascan.info`
+/**
+ * Get the URL for the given transaction hash on subnets.avax.network
+ * @param txHash
+ * @param chain
+ * @param isMainnet
+ */
+export function getTxURL(txHash: string, chain: ChainIdType, isMainnet: boolean) {
+    // For C chain use avascan
+    //TODO: Switch to glacier when ready
+    if (chain === 'C') {
+        const base = isMainnet ? avascanMainnet : avascanFuji
+        return base + `/blockchain/c/tx/${txHash}`
+    }
+
+    const base = isMainnet ? mainnetBase : fujiBase
+    const chainPath = chain.toLowerCase() + '-chain'
+    return `${base}${chainPath}/tx/${txHash}`
+}

src/js/Glacier/getUrlFromTransaction.ts

@@ -0,0 +1,22 @@
+import { isTransactionP, isTransactionX, TransactionType } from '@/js/Glacier/models'
+import { isMainnetNetworkID } from '@/store/modules/network/isMainnetNetworkID'
+import { isTestnetNetworkID } from '@/store/modules/network/isTestnetNetworkID'
+import { getTxURL } from '@/js/Glacier/getTxURL'
+
+/**
+ * Given a glacier transaction, returns its URL on the explorer.
+ * @param netID The network ID transaction is made on
+ * @param transaction Transaction data from glacier
+ */
+export function getUrlFromTransaction(netID: number, transaction: TransactionType) {
+    const isMainnet = isMainnetNetworkID(netID)
+    const isFuji = isTestnetNetworkID(netID)
+
+    if (!isMainnet && !isFuji) return null
+
+    const isX = isTransactionX(transaction)
+    const isP = isTransactionP(transaction)
+
+    const chainId = isX ? 'X' : isP ? 'P' : 'C'
+    return getTxURL(transaction.txHash, chainId, isMainnet)
+}