undefined is not an object (evaluating '_useInternal.state')

[kacperkwapisz]

That's the only error showing up which won't allow me to use the react-native-hold-menu.
Do you know how to fix this?

undefined is not an object (evaluating '_useInternal.state')

[ksitko]

What version of Reanimated are you using? There should be no error with the latest release, "react-native-reanimated": "2.1.0"

[kacperkwapisz]

I'm using the 2.1.0. I'm not sure what is the problem here

[enesozturk]

Hi @kacperkwapisz, is the problem still exist? If yes could you provide more details how did you used the Hold Menu with code snippets, provide versions and other details in issue template.

[filiptronicek]

@enesozturk, I think I might be getting the same problem as @kacperkwapisz on iOS, which is undefined is not an object (evaluating 'O.state'). This is my package.json:

{
  "dependencies": {
    "react-native-paper": "3.6.0",
    "expo-constants": "~10.1.3",
    "react-native-hold-menu": "*",
    "react-native-reanimated": "~2.1.0",
    "expo-blur": "~9.0.3",
    "react-native-gesture-handler": "~1.10.2"
  }
}

This is my App.js:

import React from 'react';
import { View } from 'react-native';

import { HoldItem } from 'react-native-hold-menu';

const MenuItems = [
  { text: 'Actions', icon: 'home', isTitle: true, onPress: () => {} },
  { text: 'Action 1', icon: 'edit', onPress: () => {} },
  { text: 'Action 2', icon: 'map-pin', withSeparator: true, onPress: () => {} },
  { text: 'Action 3', icon: 'trash', isDestructive: true, onPress: () => {} },
];

const Example = () => {
  return (
    <HoldItem
      items={[
        { text: 'Actions', isTitle: true, onPress: () => {} },
        { text: 'Reply', onPress: () => {} },
        { text: 'Edit', onPress: () => {} },
        { text: 'Delete', onPress: () => {} },
      ]}
    />
  );
};

export default Example;

This is an Expo snack as a demo: https://snack.expo.io/@filiptronicek/react-native-hold-menu-bug

[filiptronicek]

When I ran this locally with Expo, this error I got seems to be the exact same as @kacperkwapisz!

TypeError: undefined is not an object (evaluating '_useInternal.state')

This error is located at:
    in HoldItemComponent (at App.js:10)
    in RCTView (at View.js:34)
    in View (at App.js:9)
    in App (created by ExpoRoot)
    in ExpoRoot (at renderApplication.js:45)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:106)
    in DevAppContainer (at AppContainer.js:121)
    in RCTView (at View.js:34)
    in View (at AppContainer.js:132)
    in AppContainer (at renderApplication.js:39)

Stack trace

 node_modules\react-native\Libraries\LogBox\LogBox.js:148:8 in registerError
  node_modules\react-native\Libraries\LogBox\LogBox.js:59:8 in errorImpl
  node_modules\react-native\Libraries\LogBox\LogBox.js:33:4 in console.error
  node_modules\expo\build\environment\react-native-logs.fx.js:27:4 in error
  node_modules\react-native\Libraries\Core\ExceptionsManager.js:104:6 in reportException
  node_modules\react-native\Libraries\Core\ExceptionsManager.js:171:19 in handleException
  node_modules\react-native\Libraries\Core\ReactFiberErrorDialog.js:43:2 in showErrorDialog
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:15257:32 in logCapturedError
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:15361:20 in logError
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:16597:12 in update.callback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:7106:2 in callCallback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:7127:20 in commitUpdateQueue
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:15801:25 in commitLifeCycles
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18744:22 in commitLayoutEffects
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:265:4 in invokeGuardedCallbackImpl
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:476:2 in invokeGuardedCallback
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18483:29 in commitRootImpl
  [native code]:null in commitRootImpl
  node_modules\scheduler\cjs\scheduler.development.js:653:23 in unstable_runWithPriority
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:18317:17 in commitRoot
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:17697:12 in performSyncWorkOnRoot
  [native code]:null in performSyncWorkOnRoot
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5321:31 in runWithPriority$argument_1
  node_modules\scheduler\cjs\scheduler.development.js:653:23 in unstable_runWithPriority
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5316:21 in flushSyncCallbackQueueImpl
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:5304:28 in flushSyncCallbackQueue
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:17741:26 in flushSync
  node_modules\react-native\Libraries\Renderer\implementations\ReactNativeRenderer-dev.js:6154:13 in scheduleRefresh
  node_modules\react-refresh\cjs\react-refresh-runtime.development.js:218:8 in mountedRoots.forEach$argument_0
  [native code]:null in forEach
  node_modules\react-refresh\cjs\react-refresh-runtime.development.js:210:4 in performReactRefresh
  node_modules\react-native\Libraries\Core\setUpReactRefresh.js:43:6 in Refresh.performReactRefresh
  node_modules\metro\src\lib\polyfills\require.js:627:10 in setTimeout$argument_0
  node_modules\react-native\Libraries\Core\Timers\JSTimers.js:130:14 in _callTimer
  node_modules\react-native\Libraries\Core\Timers\JSTimers.js:383:16 in callTimers
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:416:4 in __callFunction
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:109:6 in __guard$argument_0
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in __guard
  node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:108:4 in callFunctionReturnFlushedQueue
  [native code]:null in callFunctionReturnFlushedQueue
  ...

[enesozturk]

Hi @filiptronicek, thanks for providing all the details. I will check these as soon as possible. 👍🏽

[tcolinpa]

any updates?

[enesozturk]

Hi guys, it's been a long time. I tried to reproduce the issue in both bare workflow and managed workflow by Expo but could not handle it. Anyone still having the issue?

[filiptronicek]

@enesozturk I still am, just checked with my iPhone XS running iOS 15.3 (tried the provided Expo Snack with the Expo Go app)

[Joehoel]

Did you use the HoldMenuProvider like in the docs?

import React from 'react';

import { HoldMenuProvider } from 'react-native-hold-menu';

const App = () => {
  return (
    <HoldMenuProvider theme="light">
      {/* Your app components */}
    </HoldMenuProvider>
  );
};

export default App;

[kesha-antonov]

Same error here

[kesha-antonov]

[kesha-antonov]

I forgot to use

import { HoldMenuProvider } from 'react-native-hold-menu'

<HoldMenuProvider>
  ...
</HoldMenuProvider>

now it works