enesozturk / react-native-hold-menu

📱 A performant, easy to use hold to open context menu for React Native powered by Reanimated 🚀
https://enesozturk.github.io/react-native-hold-menu/
MIT License
1.4k stars 91 forks source link

Menu list items are pressable after close #76

Open SohelIslamImran opened 2 years ago

SohelIslamImran commented 2 years ago

Describe the bug When you first time open manu, the area of where the menu list items were opened, are pressable. Menu is hidden, But still can press the menu items. Can't understand what is the problem .. Please fix.

Package versions "react": "17.0.2", "react-native": "0.68.2", "react-native-reanimated": "~2.8.0", "react-native-hold-menu": "^0.1.5", "expo": "^45.0.6",

SohelIslamImran commented 2 years ago

@enesozturk

SohelIslamImran commented 2 years ago

I think you need to minus (-) zindex of menu, when close/inactive

SohelIslamImran commented 2 years ago

Another problem found @enesozturk , items props on HoldItem component are not changing, it kept memorized. So it is causing problems with multiple HoldItem on multiple screens. When I open a hold menu and then go to another screen and open another hold menu, it keeps the previous items, not showing this new menu items.

SohelIslamImran commented 2 years ago

Unfortunately, this package is not working as expected and as shown in the documentation, examples and gif. So sad☹️.

enesozturk commented 2 years ago

This is indeed unexpected and I cannot reproduce the same issue you recorded. Do you get the same with all the use cases? Which version are you using?

items props on HoldItem component are not changing

This was one of the old issues and I remember it's solved. When I run the example on the same device (It's Expo, so would be easy to test), I cannot see the same issue between the examples.

SohelIslamImran commented 2 years ago

Alright. But let's quick fix the first and main issue. (The Menu list items pressable issue on android) @enesozturk

SohelIslamImran commented 2 years ago

This is indeed unexpected and I cannot reproduce the same issue you recorded. Do you get the same with all the use cases? Which version are you using?

items props on HoldItem component are not changing

This was one of the old issues and I remember it's solved. When I run the example on the same device (It's Expo, so would be easy to test), I cannot see the same issue between the examples.

Actually, I found the exact issue. The deepEqual in react-native-hold-menu\src\components\menu\MenuList.tsx are returning true, even they are not equal. Please check and fix the deepEqual. @enesozturk image

Mainly, this condition is not working on React native. It always returns true even if functions are not equal.

image

SohelIslamImran commented 2 years ago

Please try to fix these two issues ASAP @enesozturk 🙏🙏!!

SohelIslamImran commented 2 years ago

In browser or node, function.toString() convert the function body to string. Like this

image

But in React Native, it always converts to this. So the equal (===) condition always returns true.

image

Is it clear? @enesozturk

SohelIslamImran commented 2 years ago

I found this issue https://github.com/facebook/hermes/issues/114 and https://github.com/facebook/hermes/issues/612#issuecomment-1181514087

SohelIslamImran commented 2 years ago

Bump. Waiting

SohelIslamImran commented 2 years ago

In browser or node, function.toString() convert the function body to string. Like this

image

But in React Native, it always converts to this. So the equal (===) condition always returns true.

image

Is it clear? @enesozturk

I console logged normal function. It is showing the function body. The reason of the above issue is you used useSharedValue for store items. I think you need to use react state or context. @enesozturk

image

SohelIslamImran commented 2 years ago

@enesozturk Can you please fix these issues ASAP? My app is buggy for this package now. Or instead, I should find another package?

kesha-antonov commented 9 months ago

Hi I encountered this issue also on Android 11 Area where menu was remains tappable

I use latest version of the lib

UPD. Created PR for this

https://github.com/enesozturk/react-native-hold-menu/pull/115