web3modal-react-native icon indicating copy to clipboard operation
web3modal-react-native copied to clipboard

[bug]: Cannot convert undefined value to object (AppKit)

Open lucaskraus opened this issue 10 months ago • 3 comments

Description

Hey!

My project is a universal app with Next.js + Expo. The Reown SDK installed in Next app is working perfectly, but I just found out a bug when installing React Native SDK in the Expo project.

After run all the steps in the Reown documentation, it's gives me an error. If I remove AppKit from _layout.tsx, the app works normally.

Here's the error:

Image


This error is located at:
    in AppKit (created by RootLayoutNav)
    in QueryClientProvider (created by RootLayoutNav)
    in Hydrate (created by WagmiProvider)
    in WagmiProvider (created by RootLayoutNav)
    in ThemeProvider (created by RootLayoutNav)
    in ToastProvider (created by GluestackUIProvider)
    in PortalProvider (created by GluestackUIProvider)
    in RCTView (created by View)
    in View (created by CssInterop.View)
    in CssInterop.View (created by GluestackUIProvider)
    in GluestackUIProvider (created by RootLayoutNav)
    in RootLayoutNav (created by RootLayout)
    in RootLayout
    in Try
    in Unknown
    in Unknown (created by Route())
    in Suspense (created by Route())
    in Route (created by Route())
    in Route() (created by ContextNavigator)
    in RNCSafeAreaProvider (created by SafeAreaProvider)
    in SafeAreaProvider (created by wrapper)
    in wrapper (created by ContextNavigator)
    in ThemeProvider
    in EnsureSingleNavigator
    in BaseNavigationContainer
    in NavigationContainerInner (created by ContextNavigator)
    in ContextNavigator (created by ExpoRoot)
    in ExpoRoot (created by App)
    in App (created by ErrorOverlay)
    in ErrorToastContainer (created by ErrorOverlay)
    in ErrorOverlay (created by withDevTools(ErrorOverlay))
    in withDevTools(ErrorOverlay)
    in RCTView (created by CssInterop.View)
    in CssInterop.View (created by AppContainer)
    in RCTView (created by CssInterop.View)
    in CssInterop.View (created by AppContainer)
    in AppContainer
    in main(RootComponent)

AppKit SDK version

@reown/appkit-wagmi-react-native: "1.2.3"

Output of `npx react-native info

System:
  OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
  CPU: (16) x64 11th Gen Intel(R) Core(TM) i7-11800H @ 2.30GHz
  Memory: 14.06 GB / 15.51 GB
  Shell:
    version: 5.1.16
    path: /bin/bash
Binaries:
  Node:
    version: 22.14.0
    path: ~/.nvm/versions/node/v22.14.0/bin/node
  Yarn:
    version: 1.22.22
    path: ~/.nvm/versions/node/v22.14.0/bin/yarn
  npm:
    version: 11.2.0
    path: ~/.nvm/versions/node/v22.14.0/bin/npm
  Watchman: Not Found
SDKs:
  Android SDK: Not Found
IDEs:
  Android Studio: Not Found
Languages:
  Java:
    version: javac 22
    path: /home/lucas/.sdkman/candidates/java/current/bin/javac
  Ruby: Not Found
npmPackages:
  "@react-native-community/cli": Not Found
  react: Not Found
  react-native: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: Not found
  newArchEnabled: Not found
iOS:
  hermesEnabled: Not found
  newArchEnabled: Not found

info React Native v0.79.0 is now available (your project is running on v0.76.9).
info Changelog: https://github.com/facebook/react-native/releases/tag/v0.79.0
info Diff: https://react-native-community.github.io/upgrade-helper/?from=0.76.9&to=0.79.0
info For more info, check out "https://reactnative.dev/docs/upgrading?os=linux".

Expo Version (if applies)

Expo 52.0.44

Steps to reproduce

  • Run yarn in the root to install all dependencies
  • Change Project ID in const projectId = "SET_ID_HERE" apps/expo-app/app/_layout.tsx
  • Run yarn run:expo to initialize the Expo locally.
  • Open Expo app in Android or iOS (I mainly using Android for testing purposes in my project)

Snack, code example, screenshot, or link to a repository

https://github.com/lucaskraus/reown-reproducible-error

lucaskraus avatar Apr 10 '25 12:04 lucaskraus

hey @lucaskraus 👋 sorry for the delay. The issue happens because there are two versions of valtio installed in your project. 1.13.x for AppKit web and 1.11.2 for AppKit react-native, and apparently yarn is resolving to the incorrect version on native.

Adding "valtio": "1.11.2" in your expo app package.json should fix the issue. Can you try that?

ignaciosantise avatar May 02 '25 13:05 ignaciosantise

I have the same issue but I use the bare React Native workflow. I added "valtio": "1.11.2" like you suggest, the error did not show up anymore but I got another error, which is connection declined when I tap on one of the wallet option.

dip-angelhack avatar May 07 '25 10:05 dip-angelhack

@dip-angelhack can you upload a video with the issue? what's the error?

ignaciosantise avatar May 09 '25 13:05 ignaciosantise

@lucaskraus were you able to solve the issue?

ignaciosantise avatar May 20 '25 19:05 ignaciosantise

hey @lucaskraus 👋 sorry for the delay. The issue happens because there are two versions of valtio installed in your project. 1.13.x for AppKit web and 1.11.2 for AppKit react-native, and apparently yarn is resolving to the incorrect version on native.

Adding "valtio": "1.11.2" in your expo app package.json should fix the issue. Can you try that?

It work for me, i meet the problem.

(NOBRIDGE) ERROR Warning: TypeError: undefined is not an object (evaluating '_ref5[0]')

This error is located at: in AppKitButton (created by OtherOptions) in RCTSafeAreaView (created by OtherOptions) in OtherOptions (created by SceneView) in StaticContainer in EnsureSingleNavigator (created by SceneView) in SceneView (created by CardContainer)

yucheng-Li avatar May 27 '25 16:05 yucheng-Li

Closing the issue. The problem was that yarn was resolving valtio's version incorrectly, and its solved by overriding valtio to 1.11.2.

For YARN users:

//package.json

...
"resolutions": {
    "valtio": "1.11.2"
  },

For NPM users:

//package.json

...
"overrides": {
    "valtio": "1.11.2"
  },

ignaciosantise avatar Jun 11 '25 17:06 ignaciosantise

"overrides": { "valtio": "1.11.2" },

This issue is still there and this resolution doesn't work for pnpm users. @ignaciosantise

An0nym0usAng3l avatar Aug 07 '25 00:08 An0nym0usAng3l

已收到

yucheng-Li avatar Aug 07 '25 00:08 yucheng-Li

That’s because pnpm overrides are different. Check here https://github.com/orgs/pnpm/discussions/4604#discussioncomment-2616462

El El mié, 6 ago 2025 a la(s) 21:30, Alhaji sama @.***> escribió:

An0nym0usAng3l left a comment (reown-com/appkit-react-native#334) https://github.com/reown-com/appkit-react-native/issues/334#issuecomment-3162024221

"overrides": { "valtio": "1.11.2" },

This issue is still there and this resolution doesn't work for pnpm users. @ignaciosantise https://github.com/ignaciosantise

— Reply to this email directly, view it on GitHub https://github.com/reown-com/appkit-react-native/issues/334#issuecomment-3162024221, or unsubscribe https://github.com/notifications/unsubscribe-auth/AGF24ZQ2SDXF4JWA5R7RTOL3MKMYXAVCNFSM6AAAAAB23RFOH6VHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZTCNRSGAZDIMRSGE . You are receiving this because you were mentioned.Message ID: @.***>

ignaciosantise avatar Aug 07 '25 01:08 ignaciosantise

Thank you

An0nym0usAng3l avatar Aug 07 '25 05:08 An0nym0usAng3l