@reown/appkit-core-react-native 1.2.6 → 1.3.1

package/src/controllers/RouterController.ts

@@ -1,5 +1,11 @@
 import { proxy } from 'valtio';
-import type { WcWallet, CaipNetwork, Connector, SwapInputTarget } from '../utils/TypeUtil';
+import type {
+  WcWallet,
+  CaipNetwork,
+  Connector,
+  SwapInputTarget,
+  OnRampTransactionResult
+} from '../utils/TypeUtil';
 
 // -- Types --------------------------------------------- //
 type TransactionAction = {
@@ -28,6 +34,11 @@ export interface RouterControllerState {
     | 'EmailVerifyOtp'
     | 'GetWallet'
     | 'Networks'
+    | 'OnRamp'
+    | 'OnRampCheckout'
+    | 'OnRampLoading'
+    | 'OnRampSettings'
+    | 'OnRampTransaction'
     | 'SwitchNetwork'
     | 'Swap'
     | 'SwapSelectToken'
@@ -54,6 +65,7 @@ export interface RouterControllerState {
     email?: string;
     newEmail?: string;
     swapTarget?: SwapInputTarget;
+    onrampResult?: OnRampTransactionResult;
   };
   transactionStack: TransactionAction[];
 }
@@ -101,13 +113,14 @@ export const RouterController = {
     }
   },
 
-  reset(view: RouterControllerState['view']) {
+  reset(view: RouterControllerState['view'], data?: RouterControllerState['data']) {
     state.view = view;
     state.history = [view];
+    state.data = data;
   },
 
   replace(view: RouterControllerState['view'], data?: RouterControllerState['data']) {
-    if (state.history.length > 1 && state.history.at(-1) !== view) {
+    if (state.history.length >= 1 && state.history.at(-1) !== view) {
       state.view = view;
       state.history[state.history.length - 1] = view;
       state.data = data;

package/src/index.ts

@@ -56,6 +56,7 @@ export {
 
 export { SendController, type SendControllerState } from './controllers/SendController';
 
+export { OnRampController, type OnRampControllerState } from './controllers/OnRampController';
 export { WebviewController, type WebviewControllerState } from './controllers/WebviewController';
 
 // -- Utils -------------------------------------------------------------------

package/src/utils/AssetUtil.ts

@@ -14,13 +14,17 @@ export const AssetUtil = {
     return undefined;
   },
 
-  getNetworkImage(network?: CaipNetwork) {
-    if (network?.imageUrl) {
-      return network?.imageUrl;
+  getNetworkImage(network?: CaipNetwork, networkImages?: Record<string, string>) {
+    if (!network) {
+      return undefined;
     }
 
-    if (network?.imageId) {
-      return AssetController.state.networkImages[network.imageId];
+    if (network.imageUrl) {
+      return network.imageUrl;
+    }
+
+    if (network.imageId) {
+      return networkImages?.[network.imageId];
     }
 
     return undefined;

package/src/utils/ConstantsUtil.ts

@@ -2,11 +2,28 @@ import type { Features } from './TypeUtil';
 
 const defaultFeatures: Features = {
   swaps: true,
+  onramp: true,
   email: true,
   emailShowWallets: true,
   socials: ['x', 'discord', 'apple']
 };
 
+export const OnRampErrorType = {
+  AMOUNT_TOO_LOW: 'INVALID_AMOUNT_TOO_LOW',
+  AMOUNT_TOO_HIGH: 'INVALID_AMOUNT_TOO_HIGH',
+  INVALID_AMOUNT: 'INVALID_AMOUNT',
+  INCOMPATIBLE_REQUEST: 'INCOMPATIBLE_REQUEST',
+  BAD_REQUEST: 'BAD_REQUEST',
+  NO_VALID_QUOTES: 'NO_VALID_QUOTES',
+  FAILED_TO_LOAD: 'FAILED_TO_LOAD',
+  FAILED_TO_LOAD_COUNTRIES: 'FAILED_TO_LOAD_COUNTRIES',
+  FAILED_TO_LOAD_PROVIDERS: 'FAILED_TO_LOAD_PROVIDERS',
+  FAILED_TO_LOAD_METHODS: 'FAILED_TO_LOAD_METHODS',
+  FAILED_TO_LOAD_CURRENCIES: 'FAILED_TO_LOAD_CURRENCIES',
+  FAILED_TO_LOAD_LIMITS: 'FAILED_TO_LOAD_LIMITS',
+  UNKNOWN: 'UNKNOWN_ERROR'
+} as const;
+
 export const ConstantsUtil = {
   FOUR_MINUTES_MS: 240000,
 
@@ -14,12 +31,14 @@ export const ConstantsUtil = {
 
   ONE_SEC_MS: 1000,
 
-  EMAIL_REGEX: /^[a-zA-Z0-9.!#$%&’*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)+$/,
+  EMAIL_REGEX: /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)+$/,
 
   LINKING_ERROR: 'LINKING_ERROR',
 
   NATIVE_TOKEN_ADDRESS: '0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee',
 
+  ONRAMP_ERROR_TYPES: OnRampErrorType,
+
   SWAP_SUGGESTED_TOKENS: [
     'ETH',
     'UNI',
@@ -46,7 +65,7 @@ export const ConstantsUtil = {
     'BICO',
     'CRV',
     'ENS',
-    'MATIC',
+    'POL',
     'OP'
   ],
 
@@ -76,7 +95,7 @@ export const ConstantsUtil = {
     'BICO',
     'CRV',
     'ENS',
-    'MATIC',
+    'POL',
     'OP',
     'METAL',
     'DAI',
@@ -139,5 +158,31 @@ export const ConstantsUtil = {
 
   CONVERT_SLIPPAGE_TOLERANCE: 1,
 
-  DEFAULT_FEATURES: defaultFeatures
+  DEFAULT_FEATURES: defaultFeatures,
+
+  NETWORK_DEFAULT_CURRENCIES: {
+    'eip155:1': 'ETH', // Ethereum Mainnet
+    'eip155:56': 'BNB', // Binance Smart Chain
+    'eip155:137': 'POL', // Polygon
+    'eip155:42161': 'ETH_ARBITRUM', // Arbitrum One
+    'eip155:43114': 'AVAX', // Avalanche C-Chain
+    'eip155:10': 'ETH_OPTIMISM', // Optimism
+    'eip155:250': 'FTM', // Fantom
+    'eip155:100': 'xDAI', // Gnosis Chain (formerly xDai)
+    'eip155:8453': 'ETH_BASE', // Base
+    'eip155:1284': 'GLMR', // Moonbeam
+    'eip155:1285': 'MOVR', // Moonriver
+    'eip155:25': 'CRO', // Cronos
+    'eip155:42220': 'CELO', // Celo
+    'eip155:8217': 'KLAY', // Klaytn
+    'eip155:1313161554': 'AURORA_ETH', // Aurora
+    'eip155:40': 'TLOS', // Telos EVM
+    'eip155:1088': 'METIS', // Metis Andromeda
+    'eip155:2222': 'KAVA', // Kava EVM
+    'eip155:7777777': 'ZETA', // ZetaChain
+    'eip155:7700': 'CANTO', // Canto
+    'eip155:59144': 'ETH_LINEA', // Linea
+    'eip155:1101': 'ETH_POLYGONZKEVM', // Polygon zkEVM
+    'eip155:196': 'XIN' // Mixin
+  }
 };

package/src/utils/CoreHelperUtil.ts

@@ -2,6 +2,7 @@
 
 import { Linking, Platform } from 'react-native';
 import { ConstantsUtil as CommonConstants, type Balance } from '@reown/appkit-common-react-native';
+import * as ct from 'countries-and-timezones';
 
 import { ConstantsUtil } from './ConstantsUtil';
 import type { CaipAddress, CaipNetwork, DataWallet, LinkingRecord } from './TypeUtil';
@@ -172,10 +173,25 @@ export const CoreHelperUtil = {
     return CommonConstants.BLOCKCHAIN_API_RPC_URL;
   },
 
+  getBlockchainStagingApiUrl() {
+    return CommonConstants.BLOCKCHAIN_API_RPC_URL_STAGING;
+  },
+
   getAnalyticsUrl() {
     return CommonConstants.PULSE_API_URL;
   },
 
+  getCountryFromTimezone() {
+    try {
+      const { timeZone } = new Intl.DateTimeFormat().resolvedOptions();
+      const country = ct.getCountryForTimezone(timeZone);
+
+      return country ? country.id : 'US'; // 'id' is the ISO country code (e.g., "US" for United States)
+    } catch (error) {
+      return 'US';
+    }
+  },
+
   getUUID() {
     if ((global as any)?.crypto.getRandomValues) {
       const buffer = new Uint8Array(16);
@@ -287,5 +303,19 @@ export const CoreHelperUtil = {
     }
 
     return requested;
+  },
+
+  debounce<F extends (...args: any[]) => any>(func: F, wait: number) {
+    let timeout: ReturnType<typeof setTimeout> | null = null;
+
+    return function (...args: Parameters<F>) {
+      if (timeout) {
+        clearTimeout(timeout);
+      }
+
+      timeout = setTimeout(() => {
+        func(...args);
+      }, wait);
+    };
   }
 };

package/src/utils/FetchUtil.ts

@@ -28,41 +28,44 @@ export class FetchUtil {
     this.clientId = clientId;
   }
 
-  public async get<T>({ headers, ...args }: RequestArguments) {
+  public async get<T>({ headers, signal, ...args }: RequestArguments) {
     const url = this.createUrl(args);
-    const response = await fetch(url, { method: 'GET', headers });
+    const response = await fetch(url, { method: 'GET', headers, signal });
 
     return this.processResponse<T>(response);
   }
 
-  public async post<T>({ body, headers, ...args }: PostArguments) {
+  public async post<T>({ body, headers, signal, ...args }: PostArguments) {
     const url = this.createUrl(args);
     const response = await fetch(url, {
       method: 'POST',
       headers,
-      body: body ? JSON.stringify(body) : undefined
+      body: body ? JSON.stringify(body) : undefined,
+      signal
     });
 
     return this.processResponse<T>(response);
   }
 
-  public async put<T>({ body, headers, ...args }: PostArguments) {
+  public async put<T>({ body, headers, signal, ...args }: PostArguments) {
     const url = this.createUrl(args);
     const response = await fetch(url, {
       method: 'PUT',
       headers,
-      body: body ? JSON.stringify(body) : undefined
+      body: body ? JSON.stringify(body) : undefined,
+      signal
     });
 
     return this.processResponse<T>(response);
   }
 
-  public async delete<T>({ body, headers, ...args }: PostArguments) {
+  public async delete<T>({ body, headers, signal, ...args }: PostArguments) {
     const url = this.createUrl(args);
     const response = await fetch(url, {
       method: 'DELETE',
       headers,
-      body: body ? JSON.stringify(body) : undefined
+      body: body ? JSON.stringify(body) : undefined,
+      signal
     });
 
     return this.processResponse<T>(response);
@@ -124,6 +127,16 @@ export class FetchUtil {
 
   private async processResponse<T>(response: Response) {
     if (!response.ok) {
+      if (response.headers.get('content-type')?.includes('application/json')) {
+        try {
+          const errorData = await response.json();
+
+          return Promise.reject(errorData);
+        } catch (jsonError) {
+          return Promise.reject(`Code: ${response.status} - ${response.statusText}`);
+        }
+      }
+
       const errorText = await response.text();
 
       return Promise.reject(`Code: ${response.status} - ${response.statusText} - ${errorText}`);

package/src/utils/StorageUtil.ts

@@ -1,7 +1,18 @@
 /* eslint-disable no-console */
 import AsyncStorage from '@react-native-async-storage/async-storage';
-import type { WcWallet } from './TypeUtil';
-import type { SocialProvider, ConnectorType } from '@reown/appkit-common-react-native';
+import type {
+  OnRampCountry,
+  OnRampCountryDefaults,
+  OnRampFiatCurrency,
+  OnRampFiatLimit,
+  OnRampServiceProvider,
+  WcWallet
+} from './TypeUtil';
+import {
+  DateUtil,
+  type SocialProvider,
+  type ConnectorType
+} from '@reown/appkit-common-react-native';
 
 // -- Helpers -----------------------------------------------------------------
 const WC_DEEPLINK = 'WALLETCONNECT_DEEPLINK_CHOICE';
@@ -9,7 +20,13 @@ const RECENT_WALLET = '@w3m/recent';
 const CONNECTED_WALLET_IMAGE_URL = '@w3m/connected_wallet_image_url';
 const CONNECTED_CONNECTOR = '@w3m/connected_connector';
 const CONNECTED_SOCIAL = '@appkit/connected_social';
-
+const ONRAMP_PREFERRED_COUNTRY = '@appkit/onramp_preferred_country';
+const ONRAMP_COUNTRIES = '@appkit/onramp_countries';
+const ONRAMP_COUNTRIES_DEFAULTS = '@appkit/onramp_countries_defaults';
+const ONRAMP_SERVICE_PROVIDERS = '@appkit/onramp_service_providers';
+const ONRAMP_FIAT_LIMITS = '@appkit/onramp_fiat_limits';
+const ONRAMP_FIAT_CURRENCIES = '@appkit/onramp_fiat_currencies';
+const ONRAMP_PREFERRED_FIAT_CURRENCY = '@appkit/onramp_preferred_fiat_currency';
 // -- Utility -----------------------------------------------------------------
 export const StorageUtil = {
   setWalletConnectDeepLink({ href, name }: { href: string; name: string }) {
@@ -164,5 +181,210 @@ export const StorageUtil = {
     } catch {
       console.info('Unable to remove Connected Social Provider');
     }
+  },
+
+  async setOnRampPreferredCountry(country: OnRampCountry) {
+    try {
+      await AsyncStorage.setItem(ONRAMP_PREFERRED_COUNTRY, JSON.stringify(country));
+    } catch {
+      console.info('Unable to set OnRamp Preferred Country');
+    }
+  },
+
+  async getOnRampPreferredCountry() {
+    try {
+      const country = await AsyncStorage.getItem(ONRAMP_PREFERRED_COUNTRY);
+
+      return country ? (JSON.parse(country) as OnRampCountry) : undefined;
+    } catch {
+      console.info('Unable to get OnRamp Preferred Country');
+    }
+
+    return undefined;
+  },
+
+  async setOnRampPreferredFiatCurrency(currency: OnRampFiatCurrency) {
+    try {
+      await AsyncStorage.setItem(ONRAMP_PREFERRED_FIAT_CURRENCY, JSON.stringify(currency));
+    } catch {
+      console.info('Unable to set OnRamp Preferred Fiat Currency');
+    }
+  },
+
+  async getOnRampPreferredFiatCurrency() {
+    try {
+      const currency = await AsyncStorage.getItem(ONRAMP_PREFERRED_FIAT_CURRENCY);
+
+      return currency ? (JSON.parse(currency) as OnRampFiatCurrency) : undefined;
+    } catch {
+      console.info('Unable to get OnRamp Preferred Fiat Currency');
+    }
+
+    return undefined;
+  },
+
+  async setOnRampCountries(countries: OnRampCountry[]) {
+    try {
+      await AsyncStorage.setItem(ONRAMP_COUNTRIES, JSON.stringify(countries));
+    } catch {
+      console.info('Unable to set OnRamp Countries');
+    }
+  },
+
+  async getOnRampCountries() {
+    try {
+      const countries = await AsyncStorage.getItem(ONRAMP_COUNTRIES);
+
+      return countries ? (JSON.parse(countries) as OnRampCountry[]) : [];
+    } catch {
+      console.info('Unable to get OnRamp Countries');
+    }
+
+    return [];
+  },
+
+  async setOnRampCountriesDefaults(countriesDefaults: OnRampCountryDefaults[]) {
+    try {
+      const timestamp = Date.now();
+
+      await AsyncStorage.setItem(
+        ONRAMP_COUNTRIES_DEFAULTS,
+        JSON.stringify({ data: countriesDefaults, timestamp })
+      );
+    } catch {
+      console.info('Unable to set OnRamp Countries Defaults');
+    }
+  },
+
+  async getOnRampCountriesDefaults() {
+    try {
+      const result = await AsyncStorage.getItem(ONRAMP_COUNTRIES_DEFAULTS);
+
+      if (!result) {
+        return [];
+      }
+
+      const { data, timestamp } = JSON.parse(result);
+
+      // Cache for 1 week
+      if (timestamp && DateUtil.isMoreThanOneWeekAgo(timestamp)) {
+        return [];
+      }
+
+      return data ? (data as OnRampCountryDefaults[]) : [];
+    } catch {
+      console.info('Unable to get OnRamp Countries Defaults');
+    }
+
+    return [];
+  },
+
+  async setOnRampServiceProviders(serviceProviders: OnRampServiceProvider[]) {
+    try {
+      const timestamp = Date.now();
+
+      await AsyncStorage.setItem(
+        ONRAMP_SERVICE_PROVIDERS,
+        JSON.stringify({ data: serviceProviders, timestamp })
+      );
+    } catch {
+      console.info('Unable to set OnRamp Service Providers');
+    }
+  },
+
+  async getOnRampServiceProviders() {
+    try {
+      const result = await AsyncStorage.getItem(ONRAMP_SERVICE_PROVIDERS);
+
+      if (!result) {
+        return [];
+      }
+
+      const { data, timestamp } = JSON.parse(result);
+
+      // Cache for 1 week
+      if (timestamp && DateUtil.isMoreThanOneWeekAgo(timestamp)) {
+        return [];
+      }
+
+      return data ? (data as OnRampServiceProvider[]) : [];
+    } catch (err) {
+      console.error(err);
+      console.info('Unable to get OnRamp Service Providers');
+    }
+
+    return [];
+  },
+
+  async setOnRampFiatLimits(fiatLimits: OnRampFiatLimit[]) {
+    try {
+      const timestamp = Date.now();
+
+      await AsyncStorage.setItem(
+        ONRAMP_FIAT_LIMITS,
+        JSON.stringify({ data: fiatLimits, timestamp })
+      );
+    } catch {
+      console.info('Unable to set OnRamp Fiat Limits');
+    }
+  },
+
+  async getOnRampFiatLimits() {
+    try {
+      const result = await AsyncStorage.getItem(ONRAMP_FIAT_LIMITS);
+
+      if (!result) {
+        return [];
+      }
+
+      const { data, timestamp } = JSON.parse(result);
+
+      // Cache for 1 week
+      if (timestamp && DateUtil.isMoreThanOneWeekAgo(timestamp)) {
+        return [];
+      }
+
+      return data ? (data as OnRampFiatLimit[]) : [];
+    } catch {
+      console.info('Unable to get OnRamp Fiat Limits');
+    }
+
+    return [];
+  },
+
+  async setOnRampFiatCurrencies(fiatCurrencies: OnRampFiatCurrency[]) {
+    try {
+      const timestamp = Date.now();
+
+      await AsyncStorage.setItem(
+        ONRAMP_FIAT_CURRENCIES,
+        JSON.stringify({ data: fiatCurrencies, timestamp })
+      );
+    } catch {
+      console.info('Unable to set OnRamp Fiat Currencies');
+    }
+  },
+
+  async getOnRampFiatCurrencies() {
+    try {
+      const result = await AsyncStorage.getItem(ONRAMP_FIAT_CURRENCIES);
+
+      if (!result) {
+        return [];
+      }
+
+      const { data, timestamp } = JSON.parse(result);
+
+      // Cache for 1 week
+      if (timestamp && DateUtil.isMoreThanOneWeekAgo(timestamp)) {
+        return [];
+      }
+
+      return data ? (data as OnRampFiatCurrency[]) : [];
+    } catch {
+      console.info('Unable to get OnRamp Fiat Currencies');
+    }
+
+    return [];
   }
 };