Fix bridge tx account address issues (#1393)

* fix bridge tx account address issues

* refactoring

src/store/bridge/actions.ts

@@ -96,7 +96,7 @@ function bridgeDataToHistoryItem(
   { date = Date.now(), payload = {}, ...params } = {}
 ): IBridgeTransaction {
   const { getters, state, rootState } = bridgeActionContext(context);
-  const { isEthBridge, isEvmBridge } = getters;
+  const { isEthBridge, isEvmBridge, isSubBridge } = getters;
   const transactionState = isEthBridge ? WALLET_CONSTS.ETH_BRIDGE_STATES.INITIAL : BridgeTxStatus.Pending;
   const externalNetwork = rootState.web3.networkSelected as BridgeNetworkId as any;
   const externalNetworkType = isEthBridge
@@ -105,6 +105,10 @@ function bridgeDataToHistoryItem(
     ? BridgeNetworkType.Evm
     : BridgeNetworkType.Sub;
 
+  const [from, to] = isSubBridge
+    ? [getters.sender, getters.recipient]
+    : [rootState.wallet.account.address, getters.externalAccount];
+
   const data = {
     type: (params as any).type ?? getters.operation,
     amount: (params as any).amount ?? state.amountSend,
@@ -119,7 +123,8 @@ function bridgeDataToHistoryItem(
     externalNetworkFee: (params as any).externalNetworkFee,
     externalNetwork,
     externalNetworkType,
-    to: (params as any).to ?? getters.externalAccountFormatted,
+    from: (params as any).from ?? from,
+    to: (params as any).to ?? to,
     payload,
   };
 

src/store/bridge/getters.ts

@@ -116,16 +116,6 @@ const getters = defineGetters<BridgeState>()({
     }
   },
 
-  externalAccountFormatted(...args): string {
-    const { getters, state } = bridgeGetterContext(args);
-
-    if (!getters.isSubBridge) return getters.externalAccount;
-
-    return state.subBridgeConnector.network?.subNetworkConnection.nodeIsConnected
-      ? state.subBridgeConnector.network.formatAddress(getters.externalAccount)
-      : getters.externalAccount;
-  },
-
   sender(...args): string {
     const { state, rootState, getters } = bridgeGetterContext(args);
     const { address: soraAddress } = rootState.wallet.account;

src/utils/bridge/sub/classes/reducers.ts

@@ -350,7 +350,7 @@ export class SubBridgeIncomingReducer extends SubBridgeReducer {
 
             soraHash = getBridgeProxyHash(foundedEvents, subBridgeApi.api);
 
-            [amount, eventIndex] = getDepositedBalance(foundedEvents, tx.from as string, subBridgeApi.api);
+            [amount, eventIndex] = getDepositedBalance(foundedEvents, tx.to as string, subBridgeApi.api);
 
             resolve();
           } catch (error) {

src/views/BridgeContainer.vue

@@ -57,7 +57,8 @@ export default class BridgeContainer extends Mixins(mixins.LoadingMixin, WalletC
    */
   private async updateBridgeApps(): Promise<void> {
     await this.getSupportedApps();
-    await this.restoreSelectedNetwork();
+    // don't block ui while connecting to external network
+    this.restoreSelectedNetwork();
   }
 }
 </script>

src/views/BridgeTransaction.vue

@@ -217,7 +217,7 @@ export default class BridgeTransaction extends Mixins(
   @state.router.prev private prevRoute!: Nullable<PageNames>;
 
   @getter.bridge.historyItem private historyItem!: Nullable<IBridgeTransaction>;
-  @getter.bridge.externalAccountFormatted private externalAccountFormatted!: string;
+  @getter.bridge.externalAccount private externalAccount!: string;
 
   @action.bridge.removeHistory private removeHistory!: ({ tx, force }: { tx: any; force?: boolean }) => Promise<void>;
   @action.bridge.handleBridgeTransaction private handleBridgeTransaction!: (id: string) => Promise<void>;
@@ -431,7 +431,7 @@ export default class BridgeTransaction extends Mixins(
   get isAnotherEvmAddress(): boolean {
     if (!this.isEvmTxType) return false;
 
-    return this.txExternalAccount.toLowerCase() !== this.externalAccountFormatted.toLowerCase();
+    return this.txExternalAccount.toLowerCase() !== this.externalAccount.toLowerCase();
   }
 
   get confirmationButtonDisabled(): boolean {
@@ -515,10 +515,21 @@ export default class BridgeTransaction extends Mixins(
     return this.txSoraHash || this.txInternalBlockId || this.txSoraId;
   }
 
+  private getTxAccountAddress(isInternal = true) {
+    const accounts = [this.txInternalAccount, this.txExternalAccount];
+    const [a, b] = isInternal ? accounts : [...accounts].reverse();
+
+    if (this.isEvmTxType) return a;
+
+    return this.isOutgoing ? a : b;
+  }
+
   get accountLinks(): LinkData[] {
     const name = this.t('accountAddressText');
-    const internal = this.getLinkData(this.txInternalAccount, this.internalAccountLinks, name);
-    const external = this.getLinkData(this.txExternalAccount, this.externalAccountLinks, name, this.externalNetworkId);
+    const internalAddress = this.getTxAccountAddress(true);
+    const externalAddress = this.getTxAccountAddress(false);
+    const internal = this.getLinkData(internalAddress, this.internalAccountLinks, name);
+    const external = this.getLinkData(externalAddress, this.externalAccountLinks, name, this.externalNetworkId);
 
     return this.sortLinksByTxDirection([internal, external]);
   }