Ability to buy native currency and tokens on Optimism and Arbitrum, using Transak (#16031)

shared/constants/network.ts

@@ -374,6 +374,7 @@ const SUPPORTED_CURRENCY_SYMBOLS = {
   SHIB: 'SHIB',
   SKL: 'SKL',
   SNX: 'SNX',
+  SPA: 'SPA',
   STETH: 'STETH',
   STORJ: 'STORJ',
   SUKU: 'SUKU',
@@ -577,9 +578,7 @@ export const BUYABLE_CHAINS_MAP: {
     | typeof CHAIN_IDS.LOCALHOST
     | typeof CHAIN_IDS.PALM
     | typeof CHAIN_IDS.HARMONY
-    | typeof CHAIN_IDS.OPTIMISM
     | typeof CHAIN_IDS.OPTIMISM_TESTNET
-    | typeof CHAIN_IDS.ARBITRUM
   >]: BuyableChainSettings;
 } = {
   [CHAIN_IDS.MAINNET]: {
@@ -844,6 +843,24 @@ export const BUYABLE_CHAINS_MAP: {
       showOnlyCurrencies: [SUPPORTED_CURRENCY_SYMBOLS.CELO],
     },
   },
+  [CHAIN_IDS.OPTIMISM]: {
+    nativeCurrency: CURRENCY_SYMBOLS.ETH,
+    network: 'optimism',
+    transakCurrencies: [
+      SUPPORTED_CURRENCY_SYMBOLS.ETH,
+      SUPPORTED_CURRENCY_SYMBOLS.USDC,
+    ],
+  },
+  [CHAIN_IDS.ARBITRUM]: {
+    nativeCurrency: CURRENCY_SYMBOLS.ARBITRUM,
+    network: 'arbitrum',
+    transakCurrencies: [
+      SUPPORTED_CURRENCY_SYMBOLS.ARBITRUM,
+      SUPPORTED_CURRENCY_SYMBOLS.SPA,
+      SUPPORTED_CURRENCY_SYMBOLS.USDC,
+      SUPPORTED_CURRENCY_SYMBOLS.USDS,
+    ],
+  },
 };
 
 export const FEATURED_RPCS: RPCDefinition[] = [

ui/selectors/selectors.js

@@ -721,7 +721,7 @@ export function getIsBuyableMoonpayToken(state, symbol) {
   const chainId = getCurrentChainId(state);
   const _symbol = formatMoonpaySymbol(symbol, chainId);
   return Boolean(
-    BUYABLE_CHAINS_MAP?.[chainId]?.moonPay.showOnlyCurrencies?.includes(
+    BUYABLE_CHAINS_MAP?.[chainId]?.moonPay?.showOnlyCurrencies?.includes(
       _symbol,
     ),
   );