fix(wallet): Solana Swap Transaction Intent (uplift to 1.74.x)

components/brave_wallet/browser/brave_wallet_constants.h

@@ -1178,6 +1178,12 @@ inline constexpr webui::LocalizedString kLocalizedStrings[] = {
      IDS_BRAVE_WALLET_APPROVING_AMOUNT_ON_EXCHANGE},
     {"braveWalletCancelTransactionDescription",
      IDS_BRAVE_WALLET_CANCEL_TRANSACTION_DESCRIPTION},
+    {"braveWalletSwapping", IDS_BRAVE_WALLET_SWAPPING},
+    {"braveWalletBridging", IDS_BRAVE_WALLET_BRIDGING},
+    {"braveWalletSwappingOrBridgingOnNetwork",
+     IDS_BRAVE_WALLET_SWAPPING_OR_BRIDGING_ON_NETWORK},
+    {"braveWalletErrorAttemptingToTransactOnNetwork",
+     IDS_BRAVE_WALLET_ERROR_ATTEMPTING_TO_TRANSACT_ON_NETWORK},
     {"braveWalletTransactionSubmittedTitle",
      IDS_BRAVE_WALLET_TRANSACTION_SUBMITTED_TITLE},
     {"braveWalletTransactionSignedTitle",

components/brave_wallet_ui/components/extension/post-confirmation/common/transaction_intent.tsx

@@ -69,6 +69,8 @@ export const TransactionIntent = (props: Props) => {
   const txApprovalTarget = getTransactionApprovalTargetAddress(transaction)
   const txCoinType = getCoinFromTxDataUnion(transaction.txDataUnion)
   const txToAddress = getTransactionToAddress(transaction)
+  const isSOLSwapOrBridge =
+    txCoinType === BraveWallet.CoinType.SOL && isSwapOrBridge
 
   // Queries
   const { account: txAccount } = useAccountQuery(transaction.fromAccountId)
@@ -171,10 +173,33 @@ export const TransactionIntent = (props: Props) => {
       }`
     : formattedSendAmount
 
+  const sendSwapOrBridgeLocale = React.useMemo(() => {
+    if (isBridge) {
+      return getLocale('braveWalletBridge').toLocaleLowerCase()
+    }
+    if (isSwap) {
+      return getLocale('braveWalletSwap').toLocaleLowerCase()
+    }
+    return getLocale('braveWalletSend').toLocaleLowerCase()
+  }, [isBridge, isSwap])
+
+  const swappingOrBridgingLocale = React.useMemo(() => {
+    if (isBridge) {
+      return getLocale('braveWalletBridging')
+    }
+    return getLocale('braveWalletSwapping')
+  }, [isBridge])
+
   const firstDuringValue = React.useMemo(() => {
     if (isERC20Approval) {
       return formattedApprovalAmount
     }
+    if (isSOLSwapOrBridge && transactionFailed) {
+      return sendSwapOrBridgeLocale
+    }
+    if (isSOLSwapOrBridge) {
+      return swappingOrBridgingLocale
+    }
     if (isSwapOrBridge && transactionConfirmed) {
       return formattedBuyAmount
     }
@@ -189,10 +214,17 @@ export const TransactionIntent = (props: Props) => {
     transactionConfirmed,
     formattedBuyAmount,
     formattedSellAmount,
-    formattedSendAmount
+    formattedSendAmount,
+    isSOLSwapOrBridge,
+    sendSwapOrBridgeLocale,
+    transactionFailed,
+    swappingOrBridgingLocale
   ])
 
   const secondDuringValue = React.useMemo(() => {
+    if (isSOLSwapOrBridge) {
+      return txNetwork?.chainName ?? ''
+    }
     if (isSwapOrBridge && transactionConfirmed) {
       return recipientLabel
     }
@@ -210,23 +242,21 @@ export const TransactionIntent = (props: Props) => {
     isBridge,
     bridgeToNetwork,
     isSwap,
-    formattedBuyAmount
+    formattedBuyAmount,
+    isSOLSwapOrBridge,
+    txNetwork
   ])
 
-  const sendSwapOrBridgeLocale = React.useMemo(() => {
-    if (isBridge) {
-      return getLocale('braveWalletBridge').toLocaleLowerCase()
-    }
-    if (isSwap) {
-      return getLocale('braveWalletSwap').toLocaleLowerCase()
-    }
-    return getLocale('braveWalletSend').toLocaleLowerCase()
-  }, [isBridge, isSwap])
-
   const descriptionLocale = React.useMemo(() => {
+    if (transactionFailed && isSOLSwapOrBridge) {
+      return 'braveWalletErrorAttemptingToTransactOnNetwork'
+    }
     if (transactionFailed) {
       return 'braveWalletErrorAttemptingToTransact'
     }
+    if (isSOLSwapOrBridge) {
+      return 'braveWalletSwappingOrBridgingOnNetwork'
+    }
     if (isSwapOrBridge && transactionConfirmed) {
       return 'braveWalletAmountAddedToAccount'
     }
@@ -249,7 +279,8 @@ export const TransactionIntent = (props: Props) => {
     transactionConfirmed,
     isBridge,
     isSwap,
-    isERC20Approval
+    isERC20Approval,
+    isSOLSwapOrBridge
   ])
 
   const descriptionString = getLocale(descriptionLocale)

components/brave_wallet_ui/components/extension/post-confirmation/complete/complete.stories.tsx

@@ -7,6 +7,7 @@ import * as React from 'react'
 // Types
 import {
   BraveWallet,
+  StorybookCoinTypeOptions,
   StorybookTransactionArgs,
   StorybookTransactionOptions
 } from '../../../../constants/types'
@@ -29,12 +30,13 @@ import { PanelWrapper } from '../../../../panel/style'
 export const _TransactionComplete = {
   render: (args: StorybookTransactionArgs) => {
     // Props
-    const { transactionType } = args
+    const { transactionType, coinType } = args
 
     // Computed
     const transaction = getPostConfirmationStatusMockTransaction(
       transactionType,
-      BraveWallet.TransactionStatus.Confirmed
+      BraveWallet.TransactionStatus.Confirmed,
+      coinType
     )
 
     return (
@@ -62,6 +64,10 @@ export default {
     transactionType: {
       options: StorybookTransactionOptions,
       control: { type: 'select' }
+    },
+    coinType: {
+      options: StorybookCoinTypeOptions,
+      control: { type: 'select' }
     }
   }
 }

components/brave_wallet_ui/components/extension/post-confirmation/failed_or_canceled/failed_or_canceled.stories.tsx

@@ -7,6 +7,7 @@ import * as React from 'react'
 // Types
 import {
   BraveWallet,
+  StorybookCoinTypeOptions,
   StorybookTransactionArgs,
   StorybookTransactionOptions
 } from '../../../../constants/types'
@@ -29,12 +30,13 @@ import { PanelWrapper } from '../../../../panel/style'
 export const _TransactionFailedOrCanceled = {
   render: (args: StorybookTransactionArgs) => {
     // Props
-    const { transactionType } = args
+    const { transactionType, coinType } = args
 
     // Computed
     const transaction = getPostConfirmationStatusMockTransaction(
       transactionType,
-      BraveWallet.TransactionStatus.Error
+      BraveWallet.TransactionStatus.Error,
+      coinType
     )
 
     return (
@@ -61,6 +63,10 @@ export default {
     transactionType: {
       options: StorybookTransactionOptions,
       control: { type: 'select' }
+    },
+    coinType: {
+      options: StorybookCoinTypeOptions,
+      control: { type: 'select' }
     }
   }
 }

components/brave_wallet_ui/components/extension/post-confirmation/submitted_or_signed/submitted_or_signed.stories.tsx

@@ -7,6 +7,7 @@ import * as React from 'react'
 // Types
 import {
   BraveWallet,
+  StorybookCoinTypeOptions,
   StorybookTransactionArgs,
   StorybookTransactionOptions
 } from '../../../../constants/types'
@@ -29,12 +30,13 @@ import { PanelWrapper } from '../../../../panel/style'
 export const _TransactionSubmittedOrSigned = {
   render: (args: StorybookTransactionArgs) => {
     // Props
-    const { transactionType } = args
+    const { transactionType, coinType } = args
 
     // Computed
     const transaction = getPostConfirmationStatusMockTransaction(
       transactionType,
-      BraveWallet.TransactionStatus.Submitted
+      BraveWallet.TransactionStatus.Submitted,
+      coinType
     )
 
     return (
@@ -65,6 +67,10 @@ export default {
     transactionType: {
       options: StorybookTransactionOptions,
       control: { type: 'select' }
+    },
+    coinType: {
+      options: StorybookCoinTypeOptions,
+      control: { type: 'select' }
     }
   }
 }

components/brave_wallet_ui/constants/types.ts

@@ -1100,6 +1100,17 @@ export const StorybookTransactionOptions: StorybookTransactionTypes[] = [
   'Bridge',
   'Approve'
 ]
+
+export type StorybookCoinTypes = 'ETH' | 'SOL' | 'BTC' | 'ZEC' | 'FIL'
+export const StorybookCoinTypeOptions: StorybookCoinTypes[] = [
+  'ETH',
+  'SOL',
+  'BTC',
+  'ZEC',
+  'FIL'
+]
+
 export type StorybookTransactionArgs = {
   transactionType: StorybookTransactionTypes
+  coinType: StorybookCoinTypes
 }

components/brave_wallet_ui/stories/locale.ts

@@ -1235,6 +1235,11 @@ provideStrings({
   braveWalletCancelTransactionDescription:
     'A new transaction will be created to cancel your existing transaction.',
   braveWalletPendingTransactions: '$1 more transactions pending.',
+  braveWalletSwapping: 'Swapping',
+  braveWalletBridging: 'Bridging',
+  braveWalletSwappingOrBridgingOnNetwork: '$1$5$2 on $3$6$4',
+  braveWalletErrorAttemptingToTransactOnNetwork:
+    'There was an error attempting to $1$5$2 on $3$6$4',
   // Submitted
   braveWalletTransactionSubmittedTitle: 'Transaction submitted',
   braveWalletTransactionSignedTitle: 'Transaction signed',

components/brave_wallet_ui/stories/mock-data/mock-transaction-info.ts

@@ -7,6 +7,7 @@
 import {
   BraveWallet,
   SerializableTransactionInfo,
+  StorybookCoinTypes,
   StorybookTransactionTypes
 } from '../../constants/types'
 import { deserializeTransaction } from '../../utils/model-serialization-utils'
@@ -478,26 +479,57 @@ export const createMockTransactionInfo = (arg: {
 
 const getMockTransactionType = (
   isSwapOrBridge: boolean,
-  transactionType: StorybookTransactionTypes
+  transactionType: StorybookTransactionTypes,
+  coinType: BraveWallet.CoinType
 ) => {
+  if (isSwapOrBridge && coinType === BraveWallet.CoinType.SOL) {
+    return BraveWallet.TransactionType.SolanaSwap
+  }
   if (isSwapOrBridge) {
     return BraveWallet.TransactionType.ETHSwap
   }
   if (transactionType === 'Approve') {
     return BraveWallet.TransactionType.ERC20Approve
   }
+  if (coinType === BraveWallet.CoinType.SOL) {
+    return BraveWallet.TransactionType.SolanaSystemTransfer
+  }
   return BraveWallet.TransactionType.ETHSend
 }
 
 export const getPostConfirmationStatusMockTransaction = (
   transactionType: StorybookTransactionTypes,
-  transactionStatus: BraveWallet.TransactionStatus
+  transactionStatus: BraveWallet.TransactionStatus,
+  transactionCoinType: StorybookCoinTypes
 ) => {
   const isSwapOrBridge =
     transactionType === 'Swap' || transactionType === 'Bridge'
 
+  const coin =
+    transactionCoinType === 'BTC'
+      ? BraveWallet.CoinType.BTC
+      : transactionCoinType === 'FIL'
+      ? BraveWallet.CoinType.FIL
+      : transactionCoinType === 'SOL'
+      ? BraveWallet.CoinType.SOL
+      : transactionCoinType === 'ZEC'
+      ? BraveWallet.CoinType.ZEC
+      : BraveWallet.CoinType.ETH
+
+  const chain =
+    transactionCoinType === 'BTC'
+      ? BraveWallet.BITCOIN_MAINNET
+      : transactionCoinType === 'FIL'
+      ? BraveWallet.FILECOIN_MAINNET
+      : transactionCoinType === 'SOL'
+      ? BraveWallet.SOLANA_MAINNET
+      : transactionCoinType === 'ZEC'
+      ? BraveWallet.Z_CASH_MAINNET
+      : BraveWallet.MAINNET_CHAIN_ID
+
   return {
     ...mockTransactionInfo,
+    chainId: chain,
     txArgs: [
       BraveWallet.TransactionType.ERC20Approve
         ? LiFiExchangeProxy
@@ -506,16 +538,23 @@ export const getPostConfirmationStatusMockTransaction = (
     ],
     txDataUnion: {
       ...mockTransactionInfo.txDataUnion,
-      ethTxData1559: {
-        ...mockTransactionInfo.txDataUnion.ethTxData1559,
-        baseData: {
-          ...mockTransactionInfo.txDataUnion.ethTxData1559?.baseData,
-          to: mockBasicAttentionToken.contractAddress
-        }
-      }
+      ethTxData1559:
+        coin === BraveWallet.CoinType.ETH
+          ? {
+              ...mockTransactionInfo.txDataUnion.ethTxData1559,
+              baseData: {
+                ...mockTransactionInfo.txDataUnion.ethTxData1559?.baseData,
+                to: mockBasicAttentionToken.contractAddress
+              }
+            }
+          : undefined,
+      solanaTxData:
+        coin === BraveWallet.CoinType.SOL
+          ? mockSolanaTransactionInfo.txDataUnion.solanaTxData
+          : undefined
     },
     txStatus: transactionStatus,
-    txType: getMockTransactionType(isSwapOrBridge, transactionType),
+    txType: getMockTransactionType(isSwapOrBridge, transactionType, coin),
     swapInfo: isSwapOrBridge
       ? ({
           fromCoin: BraveWallet.CoinType.ETH,

components/resources/wallet_strings.grdp

@@ -700,6 +700,10 @@
   <message name="IDS_BRAVE_WALLET_ERROR_ATTEMPTING_TO_TRANSACT" desc="Transaction intent bridging amount to network label">There was an error attempting to <ph name="SEND_SWAP_OR_BRIDGE"><ex>Bridge</ex>$7</ph> <ph name="AMOUNT_BEFORE">$1</ph><ph name="AMOUNT"><ex>20 ETH</ex>$5</ph><ph name="AMOUNT_AFTER">$2</ph> to <ph name="VALUE_BEFORE">$3</ph><ph name="VALUE"><ex>Polygon Mainnet</ex>$6</ph><ph name="VALUE_AFTER">$4</ph></message>
   <message name="IDS_BRAVE_WALLET_APPROVING_AMOUNT_ON_EXCHANGE" desc="Transaction intent bridging amount to network label">Approving <ph name="AMOUNT_BEFORE">$1</ph><ph name="AMOUNT"><ex>20 ETH</ex>$5</ph><ph name="AMOUNT_AFTER">$2</ph> to <ph name="EXCHANGE_BEFORE">$3</ph><ph name="EXCHANGE"><ex>Li.Fi Excahnge</ex>$6</ph><ph name="EXCHANGE_AFTER">$4</ph></message>
   <message name="IDS_BRAVE_WALLET_CANCEL_TRANSACTION_DESCRIPTION" desc="Cancel transaction panel description">A new transaction will be created to cancel your existing transaction.</message>
+  <message name="IDS_BRAVE_WALLET_SWAPPING" desc="Transaction intent Swapping label">Swapping</message>
+  <message name="IDS_BRAVE_WALLET_BRIDGING" desc="Transaction intent Bridging label">Bridging</message>
+  <message name="IDS_BRAVE_WALLET_SWAPPING_OR_BRIDGING_ON_NETWORK" desc="Transaction intent Swapping or Bridging on network description"><ph name="SWAPPING_OR_BRIDGING_BEFORE">$1</ph><ph name="SWAPPING_OR_BRIDGING"><ex>Swapping</ex>$5</ph><ph name="SWAPPING_OR_BRIDGING_AFTER">$2</ph> on <ph name="NETWORK_BEFORE">$3</ph><ph name="NETWORK"><ex>Solana Mainnet Beta</ex>$6</ph><ph name="NETWORK_AFTER">$4</ph></message>
+  <message name="IDS_BRAVE_WALLET_ERROR_ATTEMPTING_TO_TRANSACT_ON_NETWORK" desc="Transaction intent error attempting to Swap or Bride on network description">There was an error attempting to <ph name="SWAP_OR_BRIDGE_BEFORE">$1</ph><ph name="SWAP_OR_BRIDGE"><ex>swap</ex>$5</ph><ph name="SWAP_OR_BRIDGE_AFTER">$2</ph> on <ph name="NETWORK_BEFORE">$3</ph><ph name="NETWORK"><ex>Solana Mainnet Beta</ex>$6</ph><ph name="NETWORK_AFTER">$4</ph></message>
   <message name="IDS_BRAVE_WALLET_PENDING_TRANSACTIONS" desc="Transaction complete panel, amount of transactions still pending.">
     {PENDING_TRANSACTIONS, plural,
       =1 {{PENDING_TRANSACTIONS} more transaction pending.}