@reown/appkit-react-native 0.0.0-feat-multichain-20250930155416 → 0.0.0-feat-multichain-20251002171622

package/src/partials/w3m-account-wallet-features/index.tsx

@@ -21,7 +21,7 @@ export function AccountWalletFeatures() {
   const { features, isOnRampEnabled } = useSnapshot(OptionsController.state);
   const { activeNetwork, balances, activeNamespace } = useSnapshot(ConnectionsController.state);
   const balance = CoreHelperUtil.calculateAndFormatBalance(balances as BalanceType[]);
-  const network = ConnectionsController.state.activeNetwork?.caipNetworkId || '';
+  const network = ConnectionsController.state.activeNetwork?.caipNetworkId;
   const isSmartAccount = ConnectionsController.state.accountType === 'smartAccount';
   const showSend =
     activeNamespace && ConstantsUtil.SEND_SUPPORTED_NAMESPACES.includes(activeNamespace);

package/src/partials/w3m-all-wallets-list/components/WalletItem.tsx

@@ -7,13 +7,21 @@ import { memo } from 'react';
 
 interface WalletItemProps {
   item: WcWallet;
+  displayIndex: number;
   imageHeaders?: Record<string, string>;
-  onItemPress: (wallet: WcWallet) => void;
+  onItemPress: (wallet: WcWallet, displayIndex: number) => void;
   style?: StyleProp<ViewStyle>;
   testID?: string;
 }
 
-export function WalletItem({ item, imageHeaders, onItemPress, style, testID }: WalletItemProps) {
+export function WalletItem({
+  item,
+  displayIndex,
+  imageHeaders,
+  onItemPress,
+  style,
+  testID
+}: WalletItemProps) {
   const { walletImages } = useSnapshot(AssetController.state);
   const isInstalled = ApiController.state.installed.find(wallet => wallet?.id === item?.id);
   const imageSrc = AssetUtil.getWalletImage(item, walletImages);
@@ -28,7 +36,7 @@ export function WalletItem({ item, imageHeaders, onItemPress, style, testID }: W
       style={style}
       imageHeaders={imageHeaders}
       name={item?.name ?? 'Unknown'}
-      onPress={() => onItemPress(item)}
+      onPress={() => onItemPress(item, displayIndex)}
       installed={!!isInstalled}
       testID={testID}
     />

package/src/partials/w3m-all-wallets-list/components/WalletList.tsx

@@ -18,7 +18,7 @@ const ITEM_HEIGHT_WITH_GAP = ITEM_HEIGHT + Spacing['3xs'];
 
 interface Props {
   data: WcWallet[];
-  onItemPress: (wallet: WcWallet) => void;
+  onItemPress: (wallet: WcWallet, displayIndex: number) => void;
   onEndReached?: () => void;
   onEndReachedThreshold?: number;
   isLoading?: boolean;
@@ -52,7 +52,7 @@ export function WalletList({
       data={displayData}
       style={[styles.list, { height: maxHeight }, style]}
       columnWrapperStyle={styles.columnWrapperStyle}
-      renderItem={({ item }) => {
+      renderItem={({ item, index }) => {
         if (isLoading) {
           return <CardSelectLoader style={styles.itemContainer} />;
         }
@@ -61,6 +61,7 @@ export function WalletList({
           <WalletItem
             item={item}
             imageHeaders={imageHeaders}
+            displayIndex={index}
             onItemPress={onItemPress}
             style={styles.itemContainer}
             testID={testIDKey ? `${testIDKey}-${item?.id}` : undefined}

package/src/partials/w3m-all-wallets-list/index.tsx

@@ -15,7 +15,7 @@ import { Loading } from './components/Loading';
 import { WalletList } from './components/WalletList';
 
 interface AllWalletsListProps {
-  onItemPress: (wallet: WcWallet) => void;
+  onItemPress: (wallet: WcWallet, displayIndex: number) => void;
   headerHeight?: number;
 }
 

package/src/partials/w3m-all-wallets-search/index.tsx

@@ -15,7 +15,7 @@ import { Loading } from '../w3m-all-wallets-list/components/Loading';
 import { WalletList } from '../w3m-all-wallets-list/components/WalletList';
 
 export interface AllWalletsSearchProps {
-  onItemPress: (wallet: WcWallet) => void;
+  onItemPress: (wallet: WcWallet, displayIndex: number) => void;
   searchQuery?: string;
 }
 

package/src/partials/w3m-connecting-mobile/index.tsx

@@ -11,7 +11,8 @@ import {
   EventsController,
   ConstantsUtil,
   AssetController,
-  LogController
+  LogController,
+  ConnectionsController
 } from '@reown/appkit-core-react-native';
 import {
   Button,
@@ -61,6 +62,21 @@ export function ConnectingMobile({ onRetry, onCopyUri, isInstalled }: Props) {
   const onStorePress = () => {
     if (storeUrl) {
       CoreHelperUtil.openLink(storeUrl);
+      EventsController.sendEvent({
+        type: 'track',
+        event: 'GET_WALLET',
+        properties: {
+          name: data?.wallet?.name ?? 'Unknown',
+          link: storeUrl,
+          linkType: Platform.select({
+            ios: 'appstore',
+            android: 'playstore',
+            default: undefined
+          }),
+          explorerId: data?.wallet?.id,
+          walletRank: data?.wallet?.order
+        }
+      });
     }
   };
 
@@ -75,13 +91,17 @@ export function ConnectingMobile({ onRetry, onCopyUri, isInstalled }: Props) {
         await CoreHelperUtil.openLink(redirect);
         await WcController.state.wcPromise;
         WcController.setConnectedWallet(wcLinking, data?.wallet);
+        const address = ConnectionsController.state.activeAddress;
+        const caipNetworkId = ConnectionsController.state.activeNetwork?.caipNetworkId;
         EventsController.sendEvent({
           type: 'track',
           event: 'CONNECT_SUCCESS',
+          address: CoreHelperUtil.getPlainAddress(address),
           properties: {
             method: 'mobile',
             name: data?.wallet?.name ?? 'Unknown',
-            explorer_id: data?.wallet?.id
+            explorerId: data?.wallet?.id,
+            caipNetworkId
           }
         });
       }

package/src/partials/w3m-connecting-qrcode/index.tsx

@@ -4,7 +4,9 @@ import {
   WcController,
   EventsController,
   OptionsController,
-  SnackController
+  SnackController,
+  ConnectionsController,
+  CoreHelperUtil
 } from '@reown/appkit-core-react-native';
 import {
   FlexView,
@@ -35,13 +37,17 @@ export function ConnectingQrCode() {
 
   const onConnect = async () => {
     await WcController.state.wcPromise;
+    const address = ConnectionsController.state.activeAddress;
+    const caipNetworkId = ConnectionsController.state.activeNetwork?.caipNetworkId;
 
     EventsController.sendEvent({
       type: 'track',
       event: 'CONNECT_SUCCESS',
+      address: CoreHelperUtil.getPlainAddress(address),
       properties: {
         method: 'qrcode',
-        name: 'WalletConnect'
+        name: 'WalletConnect',
+        caipNetworkId
       }
     });
   };

package/src/partials/w3m-connecting-web/index.tsx

@@ -10,7 +10,8 @@ import {
   OptionsController,
   EventsController,
   AssetController,
-  LogController
+  LogController,
+  ConnectionsController
 } from '@reown/appkit-core-react-native';
 import {
   Button,
@@ -51,14 +52,18 @@ export function ConnectingWeb({ onCopyUri }: ConnectingWebProps) {
         await Linking.openURL(redirect);
         await WcController.state.wcPromise;
         WcController.setConnectedWallet(wcLinking, data?.wallet);
+        const address = ConnectionsController.state.activeAddress;
+        const caipNetworkId = ConnectionsController.state.activeNetwork?.caipNetworkId;
 
         EventsController.sendEvent({
           type: 'track',
           event: 'CONNECT_SUCCESS',
+          address: CoreHelperUtil.getPlainAddress(address),
           properties: {
             method: 'web',
             name: data?.wallet?.name ?? 'Unknown',
-            explorer_id: data?.wallet?.id
+            explorerId: data?.wallet?.id,
+            caipNetworkId
           }
         });
       }

package/src/utils/SIWXUtil.ts

@@ -16,7 +16,6 @@ import {
   EventsController,
   LogController
 } from '@reown/appkit-core-react-native';
-import { Alert } from 'react-native';
 
 /**
  * SIWXUtil holds the methods to interact with the SIWX plugin and must be called internally on AppKit.
@@ -153,10 +152,7 @@ export const SIWXUtil = {
           view: 'SIWXSignMessage'
         });
       }
-
-      // @ts-ignore
-      Alert.alert('Error signing message', error?.message ?? error);
-
+      SnackController.hide();
       SnackController.showError('Error signing message');
       EventsController.sendEvent({
         type: 'track',
@@ -293,8 +289,6 @@ export const SIWXUtil = {
       universalLink
     );
 
-    SnackController.showLoading('Authenticating...', true);
-
     if (result?.auths?.length) {
       const sessions = result.auths.map<SIWXSession>(cacao => {
         const message = universalProvider.client.formatAuthMessage({
@@ -320,6 +314,7 @@ export const SIWXUtil = {
       });
 
       try {
+        SnackController.showLoading('Authenticating...', true);
         await siwx.setSessions(sessions);
 
         EventsController.sendEvent({
@@ -349,7 +344,7 @@ export const SIWXUtil = {
   },
   getSIWXEventProperties(error?: unknown) {
     return {
-      network: ConnectionsController.state.activeNetwork?.caipNetworkId || '',
+      network: ConnectionsController.state.activeNetwork?.caipNetworkId,
       isSmartAccount: ConnectionsController.state.accountType === 'smartAccount',
       message: error ? CoreHelperUtil.parseError(error) : undefined
     };

package/src/views/w3m-account-default-view/index.tsx

@@ -122,7 +122,7 @@ export function AccountDefaultView() {
       type: 'track',
       event: 'OPEN_SWAP',
       properties: {
-        network: ConnectionsController.state.activeNetwork?.caipNetworkId || '',
+        network: ConnectionsController.state.activeNetwork?.caipNetworkId,
         isSmartAccount: false
       }
     });
@@ -158,7 +158,7 @@ export function AccountDefaultView() {
   };
 
   const onSendPress = () => {
-    const network = ConnectionsController.state.activeNetwork?.caipNetworkId || '';
+    const network = ConnectionsController.state.activeNetwork?.caipNetworkId;
     const isSmartAccount = ConnectionsController.state.accountType === 'smartAccount';
 
     EventsController.sendEvent({

package/src/views/w3m-all-wallets-view/index.tsx

@@ -22,7 +22,7 @@ export function AllWalletsView() {
 
   const { debouncedCallback: onInputChange } = useDebounceCallback({ callback: setSearchQuery });
 
-  const onWalletPress = (wallet: WcWallet) => {
+  const onWalletPress = (wallet: WcWallet, displayIndex: number) => {
     const isExternal = WcHelpersUtil.isExternalWallet(wallet);
     if (isExternal) {
       RouterController.push('ConnectingExternal', { wallet });
@@ -33,7 +33,14 @@ export function AllWalletsView() {
     EventsController.sendEvent({
       type: 'track',
       event: 'SELECT_WALLET',
-      properties: { name: wallet.name ?? 'Unknown', platform: 'mobile', explorer_id: wallet.id }
+      properties: {
+        name: wallet.name ?? 'Unknown',
+        platform: 'mobile',
+        explorerId: wallet.id,
+        walletRank: wallet.order,
+        displayIndex,
+        view: 'AllWallets'
+      }
     });
   };
 

package/src/views/w3m-connect-view/components/all-wallet-list.tsx

@@ -14,7 +14,7 @@ import { UiUtil } from '../../../utils/UiUtil';
 
 interface Props {
   itemStyle: StyleProp<ViewStyle>;
-  onWalletPress: (wallet: WcWallet) => void;
+  onWalletPress: (wallet: WcWallet, displayIndex: number, isInstalled?: boolean) => void;
 }
 
 export function AllWalletList({ itemStyle, onWalletPress }: Props) {
@@ -47,8 +47,10 @@ export function AllWalletList({ itemStyle, onWalletPress }: Props) {
       <ListItemLoader style={itemStyle} />
     </>
   ) : (
-    list.map(wallet => {
+    list.map((wallet, index) => {
       const isRecent = recentWallets?.some(recentWallet => recentWallet.id === wallet.id);
+      //eslint-disable-next-line valtio/state-snapshot-rule
+      const isInstalled = !!installed.find(installedWallet => installedWallet.id === wallet.id);
 
       return (
         <ListWallet
@@ -56,11 +58,11 @@ export function AllWalletList({ itemStyle, onWalletPress }: Props) {
           imageSrc={AssetUtil.getWalletImage(wallet, walletImages)}
           imageHeaders={imageHeaders}
           name={wallet?.name ?? 'Unknown'}
-          onPress={() => onWalletPress(wallet)}
+          onPress={() => onWalletPress(wallet, index, isInstalled)}
           tagLabel={isRecent ? 'Recent' : undefined}
           tagVariant={isRecent ? 'shade' : undefined}
           style={itemStyle}
-          installed={!!installed.find(installedWallet => installedWallet.id === wallet.id)}
+          installed={isInstalled}
         />
       );
     })

package/src/views/w3m-connect-view/index.tsx

@@ -33,7 +33,7 @@ export function ConnectView() {
   const showLoadingError = !showConnectWalletsButton && prefetchError;
   const showList = !showConnectWalletsButton && !showLoadingError;
 
-  const onWalletPress = (wallet: WcWallet, isInstalled?: boolean) => {
+  const onWalletPress = (wallet: WcWallet, displayIndex: number, isInstalled?: boolean) => {
     const isExternal = WcHelpersUtil.isExternalWallet(wallet);
     if (isExternal) {
       RouterController.push('ConnectingExternal', { wallet });
@@ -48,7 +48,10 @@ export function ConnectView() {
       properties: {
         name: wallet.name ?? 'Unknown',
         platform,
-        explorer_id: wallet.id
+        explorerId: wallet.id,
+        walletRank: wallet.order,
+        displayIndex,
+        view: 'Connect'
       }
     });
   };

package/src/views/w3m-connecting-external-view/index.tsx

@@ -9,7 +9,8 @@ import {
   AssetUtil,
   AssetController,
   CoreHelperUtil,
-  LogController
+  LogController,
+  ConnectionsController
 } from '@reown/appkit-core-react-native';
 import {
   Button,
@@ -42,6 +43,21 @@ export function ConnectingExternalView() {
   const onStorePress = () => {
     if (storeUrl) {
       CoreHelperUtil.openLink(storeUrl);
+      EventsController.sendEvent({
+        type: 'track',
+        event: 'GET_WALLET',
+        properties: {
+          name: RouterController.state.data?.wallet?.name ?? 'Unknown',
+          link: storeUrl,
+          linkType: Platform.select({
+            ios: 'appstore',
+            android: 'playstore',
+            default: undefined
+          }),
+          explorerId: RouterController.state.data?.wallet?.id,
+          walletRank: RouterController.state.data?.wallet?.order
+        }
+      });
     }
   };
 
@@ -62,13 +78,17 @@ export function ConnectingExternalView() {
         }
         WcController.addRecentWallet(wallet);
         WcController.setPressedWallet(wallet);
+        const address = ConnectionsController.state.activeAddress;
+        const caipNetworkId = ConnectionsController.state.activeNetwork?.caipNetworkId;
         EventsController.sendEvent({
           type: 'track',
           event: 'CONNECT_SUCCESS',
+          address: CoreHelperUtil.getPlainAddress(address),
           properties: {
             name: wallet?.name ?? 'Unknown',
             method: 'mobile',
-            explorer_id: wallet?.id
+            caipNetworkId,
+            explorerId: wallet?.id
           }
         });
       }

package/src/views/w3m-swap-view/index.tsx

@@ -93,7 +93,7 @@ export function SwapView() {
       type: 'track',
       event: 'INITIATE_SWAP',
       properties: {
-        network: ConnectionsController.state.activeNetwork?.caipNetworkId || '',
+        network: ConnectionsController.state.activeNetwork?.caipNetworkId,
         swapFromToken: SwapController.state.sourceToken?.symbol || '',
         swapToToken: SwapController.state.toToken?.symbol || '',
         swapFromAmount: SwapController.state.sourceTokenAmount || '',

package/src/views/w3m-what-is-a-wallet-view/index.tsx

@@ -8,7 +8,7 @@ export function WhatIsAWalletView() {
 
   const onGetWalletPress = () => {
     RouterController.push('GetWallet');
-    EventsController.sendEvent({ type: 'track', event: 'CLICK_GET_WALLET' });
+    EventsController.sendEvent({ type: 'track', event: 'CLICK_GET_WALLET_HELP' });
   };
 
   return (