feat: TRON WalletConnect Structure Compatibility Update

advanced/dapps/react-dapp-v2/package.json

@@ -55,7 +55,7 @@
     "react-scripts": "^4.0.3",
     "solana-wallet": "^1.0.1",
     "styled-components": "^6.1.15",
-    "tronweb": "^4.4.0",
+    "tronweb": "^6.0.4",
     "web-vitals": "^0.2.4"
   },
   "devDependencies": {

advanced/dapps/react-dapp-v2/src/chains/tron.ts

@@ -20,12 +20,12 @@ export const TronChainData: ChainsMap = {
 export const TronMetadata: NamespaceMetadata = {
   // Tron Mainnet
   "0x2b6653dc": {
-    logo: "https://tronscan.io/static/media/TRON.4a760cebd163969b2ee874abf2415e9a.svg",
+    logo: "/assets/tron.png",
     rgb: "183, 62, 49",
   },
   // Tron TestNet
   "0xcd8690dc": {
-    logo: "https://tronscan.io/static/media/TRON.4a760cebd163969b2ee874abf2415e9a.svg",
+    logo: "/assets/tron.png",
     rgb: "183, 62, 49",
   },
 };

advanced/dapps/react-dapp-v2/src/components/Asset.tsx

@@ -14,6 +14,7 @@ const btcLogo = getChainMetadata(
   "bip122:000000000933ea01ad0ee984209779ba"
 ).logo;
 const suiLogo = getChainMetadata("sui:mainnet").logo;
+const tronLogo = getChainMetadata("tron:0x2b6653dc").logo;
 const SAsset = styled.div`
   width: 100%;
   padding: 20px;
@@ -55,6 +56,8 @@ function getAssetIcon(asset: AssetData): JSX.Element {
       return <Icon src={btcLogo} />;
     case "sui":
       return <Icon src={suiLogo} />;
+    case "trx":
+      return <Icon src={tronLogo} />;
     default:
       return <Icon src={"/assets/eth20.svg"} />;
   }

advanced/dapps/react-dapp-v2/src/contexts/JsonRpcContext.tsx

@@ -26,8 +26,7 @@ import {
   Transaction as SolanaTransaction,
   clusterApiUrl,
 } from "@solana/web3.js";
-// @ts-expect-error
-import TronWeb from "tronweb";
+import { TronWeb } from "tronweb";
 import {
   IPactCommand,
   PactCommand,
@@ -1646,7 +1645,7 @@ export function JsonRpcContextProvider({
         const testContract = isTestnet
           ? "TXYZopYRdj2D9XRtbG411XZZ3kM5VkAeBf"
           : "TR7NHqjeKQxGTCi8q8ZY4pL8otSzgjLj6t";
-        const testTransaction =
+        const { transaction } =
           await tronWeb.transactionBuilder.triggerSmartContract(
             testContract,
             "approve(address,uint256)",
@@ -1658,17 +1657,26 @@ export function JsonRpcContextProvider({
             address
           );
 
-        const result = await client!.request<{ signature: any }>({
+        const sessionProperties = session!.sessionProperties;
+        const isV1Method = sessionProperties?.tron_method_version === "v1";
+
+        const result = await client!.request<{
+          signature: any;
+          result?: { signature: any };
+        }>({
           chainId,
           topic: session!.topic,
           request: {
             method: DEFAULT_TRON_METHODS.TRON_SIGN_TRANSACTION,
-            params: {
-              address,
-              transaction: {
-                ...testTransaction,
-              },
-            },
+            params: isV1Method
+              ? {
+                  address,
+                  transaction,
+                }
+              : {
+                  address,
+                  transaction: { transaction },
+                },
           },
         });
         console.log("tron sign transaction result", result);
@@ -1677,7 +1685,7 @@ export function JsonRpcContextProvider({
           method: DEFAULT_TRON_METHODS.TRON_SIGN_TRANSACTION,
           address,
           valid: true,
-          result: result.signature,
+          result: result.result?.signature ?? result.signature,
         };
       }
     ),

advanced/dapps/react-dapp-v2/src/helpers/api.ts

@@ -5,6 +5,7 @@ import { AssetData } from "./types";
 import { PactCommand } from "@kadena/client";
 import { apiGetBip122AccountBalance } from "./bip122";
 import { getSuiClient } from "./sui";
+import { TronWeb }  from "tronweb";
 
 export type RpcProvidersByChainId = Record<
   number,
@@ -165,6 +166,10 @@ export async function apiGetAccountBalance(
     return apiGetSuiAccountBalance(address, chainId);
   }
 
+  if (namespace === "tron") {
+    return apiGetTronAccountBalance(address, networkId);
+  }
+
   if (namespace !== "eip155") {
     return { balance: "", symbol: "", name: "" };
   }
@@ -186,6 +191,50 @@ export async function apiGetAccountBalance(
   return { balance, ...token };
 }
 
+export const apiGetTronAccountBalance = async (
+  address: string,
+  networkId: string
+): Promise<AssetData> => {
+  try {
+
+    let fullHost: string;
+
+    switch (networkId) {
+      case "0x2b6653dc": 
+        fullHost = 'https://api.trongrid.io';
+        break;
+      case "0x94a9059e": 
+        fullHost = 'https://api.shasta.trongrid.io';
+        break;
+      case "0xcd8690dc": 
+        fullHost = 'https://nile.trongrid.io';
+        break;
+      default:
+        fullHost = 'https://api.trongrid.io';
+    }
+
+    const tronWeb = new TronWeb({
+      fullHost: fullHost
+    });
+    const balance = await tronWeb.trx.getBalance(address);
+
+    const balanceInTrx = tronWeb.fromSun(balance);
+
+    return {
+      balance: balanceInTrx.toString(),
+      symbol: "TRX",
+      name: "TRX"
+    };
+  } catch (error) {
+    console.error("Failed to fetch TRON balance:", error);
+    return { 
+      balance: "0", 
+      symbol: "TRX", 
+      name: "TRON" 
+    };
+  }
+};
+
 export const apiGetSuiAccountBalance = async (
   address: string,
   chainId: string

advanced/wallets/react-wallet-v2/src/data/TronData.ts

@@ -23,7 +23,7 @@ export const TRON_MAINNET_CHAINS: TRONChains = {
   'tron:0x2b6653dc': {
     chainId: '0x2b6653dc',
     name: 'Tron',
-    logo: 'https://tronscan.io/static/media/TRON.4a760cebd163969b2ee874abf2415e9a.svg',
+    logo: '/chain-logos/tron.png',
     rgb: '183, 62, 49',
     fullNode: 'https://api.trongrid.io',
     namespace: 'tron'
@@ -34,7 +34,7 @@ export const TRON_TEST_CHAINS: TRONChains = {
   'tron:0xcd8690dc': {
     chainId: '0xcd8690dc',
     name: 'Tron Testnet',
-    logo: 'https://tronscan.io/static/media/TRON.4a760cebd163969b2ee874abf2415e9a.svg',
+    logo: '/chain-logos/tron.png',
     rgb: '183, 62, 49',
     fullNode: 'https://nile.trongrid.io/',
     namespace: 'tron'

advanced/wallets/react-wallet-v2/src/lib/TronLib.ts

@@ -51,7 +51,8 @@ export default class TronLib {
   }
 
   public async signTransaction(transaction: any) {
-    const signedtxn = await this.tronWeb.trx.sign(transaction.transaction)
+    // Compatible with both new and old structures at the handler level
+    const signedtxn = await this.tronWeb.trx.sign(transaction)
     return signedtxn
   }
 }

advanced/wallets/react-wallet-v2/src/utils/TronRequestHandlerUtil.ts

@@ -30,7 +30,11 @@ export async function approveTronRequest(
       return formatJsonRpcResult(id, res)
 
     case TRON_SIGNING_METHODS.TRON_SIGN_TRANSACTION:
-      const signedTransaction = await wallet.signTransaction(request.params.transaction)
+      // Compatible with both new and old structures
+      // New structure : request.params.transaction = transaction
+      // Old structure: request.params.transaction = { transaction: transaction }
+      const transaction = request.params.transaction?.transaction || request.params.transaction;
+      const signedTransaction = await wallet.signTransaction(transaction)
 
       return formatJsonRpcResult(id, signedTransaction)
 

advanced/wallets/react-wallet-v2/src/views/SessionProposalModal.tsx

@@ -348,6 +348,12 @@ export default function SessionProposalModal() {
         let sessionProperties = {
           capabilities: JSON.stringify(capabilities)
         } as any
+
+        // Add TRON-specific properties if TRON namespace exists
+        if (namespaces.tron) {
+          sessionProperties["tron_method_version"] = "v1"
+        }
+
         if (namespaces.bip122) {
           const bip122Chain = namespaces.bip122.chains?.[0]!
           sessionProperties.bip122_getAccountAddresses = JSON.stringify({