4.3 C
New York
Saturday, February 1, 2025

on a react native app (naked) I open pockets join modal, select the pockets the app crashes (ONLY iOS)

on a react native app (naked) I open pockets join modal, select the pockets the app crashes (ONLY iOS)


attempting simply to attach this app to a pockets, following the docs (https://docs.reown.com/superior/walletconnectmodal/about?platform=react-native), acquired the pockets join button, I press it, select the pockets, it crashes.
It does work on android emulator and android bodily gadget, it doesn’t on iPhone emulator and bodily gadget.

arrange:
npx @react-native-community/[email protected] init waak –version 0.76.0
npm set up @walletconnect/modal-react-native
npm set up @react-native-async-storage/async-storage react-native-get-random-values react-native-modal react-native-svg @react-native-community/netinfo @walletconnect/react-native-compat

code:

//App.tsx
.......
//WALLET CONNECT
import '@walletconnect/react-native-compat';
import { WalletConnectModal } from '@walletconnect/modal-react-native';
import { useWalletConnectModal } from '@walletconnect/modal-react-native';

//WALLET CONNECT SETTINGS
const APP_WALLET_CONNECT_PROJECT_ID="...."
const   providerMetadata  = {
    identify: 'you venture identify',
    description: 'YOUR_PROJECT_DESCRIPTION',
    url: 'https://your-project-website.com/',
    icons: ['https://your-project-logo.com/'],
    redirect: {
      native: 'com.dapp://', 
    },
  };
const  sessionParams = {
    namespaces: {
      eip155: {
        strategies: [
          "eth_requestAccounts",
          "eth_accounts",
          "eth_chainId",
          "eth_blockNumber",
          "eth_getBalance",
          "eth_getStorageAt",
          "eth_getTransactionCount",
          "eth_getBlockByNumber",
          "eth_getBlockByHash",
          "eth_getTransactionByHash",
          "eth_getTransactionReceipt",
          "eth_sendTransaction",
          "eth_signTransaction",
          "eth_sign",
          "personal_sign",
          "eth_signTypedData",
          "eth_signTypedData_v4",
          "wallet_switchEthereumChain",
          "wallet_addEthereumChain",
          "wallet_watchAsset",
          "eth_call",
          "eth_estimateGas",
          "eth_gasPrice",
          "eth_feeHistory",
          "net_version",
          "eth_subscribe",
          "eth_unsubscribe",
          "eth_getLogs",
          "web3_clientVersion",
          "eth_mining",
          "eth_hashrate",
          "eth_getCode",
          "eth_protocolVersion"
        ],
        chains: ['eip155:31337'],
        occasions: [
          "chainChanged",
          "accountsChanged",
          "disconnect",
          "connect",
          "message",
          "networkChanged"
        ],
        rpcMap: { },
      },
    },
  };
.....
perform App(): React.JSX.Component {
  const { isOpen, open, shut, supplier, isConnected, deal with } = useWalletConnectModal();
.....
  return (
    <NavigationContainer>
      <Tab.Navigator>
....
      {/* Modal for Connection */}
      <Modal animationType="slide" clear={true} seen={modalVisible}>
        <View model={kinds.modalContainer}>
          <View model={kinds.modalView}>
            <Textual content model={kinds.modalTitle}>Pockets Not Related</Textual content>
            <Pressable model={kinds.connectButton} onPress={join}>
              <Textual content model={kinds.buttonText}>Join</Textual content>
            </Pressable>
          </View>
        </View>
      </Modal>
      <WalletConnectModal projectId={APP_WALLET_CONNECT_PROJECT_ID} providerMetadata={providerMetadata} sessionParams={sessionParams} />
    </NavigationContainer>
);
}
....
export default app;


//index.js
import 'react-native-get-random-values';
import '@walletconnect/react-native-compat';


import {AppRegistry} from 'react-native';
import App from './App';
import {identify as appName} from './app.json';

AppRegistry.registerComponent(appName, () => App);

AppDelegate.mm
#import "AppDelegate.h"

#import <React/RCTBundleURLProvider.h>
#import <React/RCTLinkingManager.h>

@implementation AppDelegate

- (BOOL)utility:(UIApplication *)utility
            openURL:(NSURL *)url
            choices:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)choices {
    return [RCTLinkingManager application:application openURL:url options:options];
}

- (BOOL)utility:(UIApplication *)utility didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
  self.moduleName = @"dapp";
  // You possibly can add your customized preliminary props within the dictionary beneath.
  // They are going to be handed all the way down to the ViewController utilized by React Native.
  self.initialProps = @{};

  return [super application:application didFinishLaunchingWithOptions:launchOptions];
}

- (NSURL *)sourceURLForBridge:(RCTBridge *)bridge
{
  return [self bundleURL];
}

- (NSURL *)bundleURL
{
#if DEBUG
  return [[RCTBundleURLProvider sharedSettings] jsBundleURLForBundleRoot:@"index"];
#else
  return [[NSBundle mainBundle] URLForResource:@"principal" withExtension:@"jsbundle"];
#endif
}

@finish

//data.plist:
<?xml model="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist model="1.0">
<dict>
    <key>CFBundleDevelopmentRegion</key>
    <string>en</string>
    <key>CFBundleDisplayName</key>
    <string>dapp</string>
    <key>CFBundleExecutable</key>
    <string>$(EXECUTABLE_NAME)</string>
    <key>CFBundleIdentifier</key>
    <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
    <key>CFBundleInfoDictionaryVersion</key>
    <string>6.0</string>
    <key>CFBundleName</key>
    <string>$(PRODUCT_NAME)</string>
    <key>CFBundlePackageType</key>
    <string>APPL</string>
    <key>CFBundleShortVersionString</key>
    <string>$(MARKETING_VERSION)</string>
    <key>CFBundleSignature</key>
    <string>????</string>
    <key>CFBundleURLTypes</key>
    <array>
        <dict>
            <key>CFBundleTypeRole</key>
            <string>Editor</string>
            <key>CFBundleURLName</key>
            <string>com.dapp</string>
            <key>CFBundleURLSchemes</key>
            <array>
                <string>com.dapp</string>
            </array>
        </dict>
    </array>
    <key>CFBundleVersion</key>
    <string>$(CURRENT_PROJECT_VERSION)</string>
    <key>LSApplicationQueriesSchemes</key>
    <array>
        <string>metamask</string>
    </array>
    <key>LSRequiresIPhoneOS</key>
    <true/>
    <key>NSAppTransportSecurity</key>
    <dict>
        <key>NSAllowsArbitraryLoads</key>
        <false/>
        <key>NSAllowsLocalNetworking</key>
        <true/>
    </dict>
    <key>NSCameraUsageDescription</key>
    <string>$(PRODUCT_NAME) wants entry to your Digital camera.</string>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string></string>
    <key>UIBackgroundModes</key>
    <array>
        <string>fetch</string>
        <string>remote-notification</string>
        <string>processing</string>
    </array>
    <key>UILaunchStoryboardName</key>
    <string>LaunchScreen</string>
    <key>UIRequiredDeviceCapabilities</key>
    <array>
        <string>arm64</string>
    </array>
    <key>UISupportedInterfaceOrientations</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
        <string>UIInterfaceOrientationLandscapeLeft</string>
        <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>UIViewControllerBasedStatusBarAppearance</key>
    <false/>
</dict>
</plist>


//app.json
{
  "identify": "dapp",
  "displayName": "dapp"
}

package deal.json
{
  "identify": "dapp",
  "model": "0.0.1",
  "non-public": true,
  "scripts": {
    "android": "react-native run-android",
    "ios": "react-native run-ios",
    "lint": "eslint .",
    "begin": "react-native begin",
    "take a look at": "jest"
  },
  "dependencies": {
    "@react-native-async-storage/async-storage": "^1.24.0",
    "@react-native-community/netinfo": "^11.4.1",
    "@react-navigation/bottom-tabs": "^7.2.0",
    "@react-navigation/native": "^7.0.14",
    "@walletconnect/modal-react-native": "^1.1.0",
    "@walletconnect/react-native-compat": "^2.17.5",
    "react": "18.3.1",
    "react-native": "0.76.0",
    "react-native-dotenv": "^3.4.11",
    "react-native-file-viewer": "^2.1.5",
    "react-native-fs": "^2.20.0",
    "react-native-get-random-values": "^1.11.0",
    "react-native-modal": "^13.0.1",
    "react-native-safe-area-context": "^5.1.0",
    "react-native-screens": "^4.5.0",
    "react-native-svg": "^15.11.1",
    "react-native-vision-camera": "^4.6.3"
  },
  "devDependencies": {
    "@babel/core": "^7.25.2",
    "@babel/preset-env": "^7.25.3",
    "@babel/runtime": "^7.25.0",
    "@react-native-community/cli": "15.0.0-alpha.2",
    "@react-native-community/cli-platform-android": "15.0.0-alpha.2",
    "@react-native-community/cli-platform-ios": "15.0.0-alpha.2",
    "@react-native/babel-preset": "0.76.0",
    "@react-native/eslint-config": "0.76.0",
    "@react-native/metro-config": "0.76.0",
    "@react-native/typescript-config": "0.76.0",
    "@varieties/react": "^18.2.6",
    "@varieties/react-test-renderer": "^18.0.0",
    "babel-jest": "^29.6.3",
    "eslint": "^8.19.0",
    "jest": "^29.6.3",
    "prettier": "2.8.8",
    "react-test-renderer": "18.3.1",
    "typescript": "5.0.4"
  },
  "engines": {
    "node": ">=18"
  }
}

Xcode stack hint:

enter picture description right here

enter picture description right here

author avatar
roosho Senior Engineer (Technical Services)
I am Rakib Raihan RooSho, Jack of all IT Trades. You got it right. Good for nothing. I try a lot of things and fail more than that. That's how I learn. Whenever I succeed, I note that in my cookbook. Eventually, that became my blog. 
rooshohttps://www.roosho.com
I am Rakib Raihan RooSho, Jack of all IT Trades. You got it right. Good for nothing. I try a lot of things and fail more than that. That's how I learn. Whenever I succeed, I note that in my cookbook. Eventually, that became my blog. 

Related Articles

LEAVE A REPLY

Please enter your comment!
Please enter your name here


Latest Articles

author avatar
roosho Senior Engineer (Technical Services)
I am Rakib Raihan RooSho, Jack of all IT Trades. You got it right. Good for nothing. I try a lot of things and fail more than that. That's how I learn. Whenever I succeed, I note that in my cookbook. Eventually, that became my blog.