Comments (5)
This seems to be a problem with hermes and it's relentless optimisation.
Depending on your setup, the call to registerSheet
may end up being passed an undefined
sheet which this library will then ignore, via this piece of code: https://github.com/ammarahm-ed/react-native-actions-sheet/blob/feb14334a0630df0e68bda85823ee90e6c6595c0/src/provider.tsx#L34C21-L34C21
What I think is happening is if hermes detects that the component you pass to registerSheet
is actually not being used in the overall component hierarchy, it will throw it away and set the component (or more precisely, all imports of it) to undefined
.
I have managed to "fix" it by having the code for the component and the registerSheet
call in the same place: an index.tsx
file. That way, hermes can't throw the component away as it is essentially being forced to run the piece of code.
from react-native-actions-sheet.
Ok after a little bit more of an investigation, I can confirm this works:
registerSheet("sheet", function Sheet() {
return (
<ActionSheet>
<Text>Hello</Text>
</ActionSheet>
);
});
So components need to be inlined, or declared in the same file as the registerSheet
call. Imports won't work.
It seems like either metro/babel or hermes is aggressively removing components that are not directly a part of the component hierarchy. I'm not sure what the library author can do about this other than a huge refactor, and I'm also not sure if there are some compiler hints to not remove components (if they are being removed at compile stage).
But in any case, there is a workaround.
from react-native-actions-sheet.
SheetManager is not working in react-antive 0.73.1 version. These action sheets cannot be managed with the provider. When SheetManager.show('sheetname') is run, no response is received. Since this feature does not work, sheets can be intervened with ref.
How can the Sheetmanager issue be resolved?
The issue is present in all 3 versions: 0.8.10, 0.8.29 and 0.9.0-alpha.24.
I think I fixed it by installing @shopify/flash-list in my project.
from react-native-actions-sheet.
![Ekran Resmi 2024-01-11 22 40 10](https://private-user-images.githubusercontent.com/48768206/296031996-abed9eed-5fc5-4154-a620-170c091a3459.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTY0OTM2OTMsIm5iZiI6MTcxNjQ5MzM5MywicGF0aCI6Ii80ODc2ODIwNi8yOTYwMzE5OTYtYWJlZDllZWQtNWZjNS00MTU0LWE2MjAtMTcwYzA5MWEzNDU5LnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA1MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNTIzVDE5NDMxM1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPTQxNDU0NzVkN2Q2NzNkNTI1ZjNiY2IxOGJiYjM4OGRjZGFjMTA2YjVkYjYxOWFhYzg1MzZmNWVmMTM2ZTYwYmMmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.fi-iqELfUUIGlybSoQ87qSilyLguNptGDD4PYArKDC0)
I am already creating registerSheet and I am sure that it is correct. SheetManager does not give any reaction or error even though everything is correct in version 0.73.1. That's why I couldn't fully understand what you said. I mentioned the unresponsiveness of the SheetManager.show function.
from react-native-actions-sheet.
![Ekran Resmi 2024-01-11 22 44 32](https://private-user-images.githubusercontent.com/48768206/296033101-29af83cb-4c50-4dab-9d98-c6d00ad7f8eb.png?jwt=eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJnaXRodWIuY29tIiwiYXVkIjoicmF3LmdpdGh1YnVzZXJjb250ZW50LmNvbSIsImtleSI6ImtleTUiLCJleHAiOjE3MTY0OTM2OTMsIm5iZiI6MTcxNjQ5MzM5MywicGF0aCI6Ii80ODc2ODIwNi8yOTYwMzMxMDEtMjlhZjgzY2ItNGM1MC00ZGFiLTlkOTgtYzZkMDBhZDdmOGViLnBuZz9YLUFtei1BbGdvcml0aG09QVdTNC1ITUFDLVNIQTI1NiZYLUFtei1DcmVkZW50aWFsPUFLSUFWQ09EWUxTQTUzUFFLNFpBJTJGMjAyNDA1MjMlMkZ1cy1lYXN0LTElMkZzMyUyRmF3czRfcmVxdWVzdCZYLUFtei1EYXRlPTIwMjQwNTIzVDE5NDMxM1omWC1BbXotRXhwaXJlcz0zMDAmWC1BbXotU2lnbmF0dXJlPWE5ZjcyNWUyYjE3ZjZkYzI3YTQzYTA5YTcwMWQ3ZDE0ZjEyOTM5MDFiNWI0NzY1NjA1YWZhNDA5ZDc4NDBiZjEmWC1BbXotU2lnbmVkSGVhZGVycz1ob3N0JmFjdG9yX2lkPTAma2V5X2lkPTAmcmVwb19pZD0wIn0.sO5RT68CrZ5BVIy5Qikf0ZfteJ8-AEQM_XjmsEDeOmE)
The error given when I do not have this library installed in my @shopify/flash-list project is different. Unfortunately, I can't get any errors. There is just a lack of reaction.
from react-native-actions-sheet.
Related Issues (20)
- Action sheet does not show 100% of the screen size. HOT 1
- 🆘 An important issue on Release Build with react-native-reanimated HOT 2
- `snapPoints` in Sheet router
- [BUG] IOS Crashes When Using this package with Webview HOT 1
- Navigating to a modal screen from action sheet causes issues in iOS with React Native 0.73 HOT 2
- [BUG] undefined value appears in the console when property animation={false} of the ActionSheet
- Is something similar to react-native's Modal presentationStyle="pageSheet" supported? HOT 1
- WebView not working
- When accessibility is turned ON, allow to set the accessibilityLabel on backdrop
- Position Tracking via useSheetRef in ActionSheet
- ScrollView crashes app HOT 3
- ScrollView from react-native-actions-sheet causes Jest to detect open handles
- Expo/Callstack Pager View does not display inside bottom sheet HOT 1
- Props.payload state updates DO NOT re-render bottom sheet. HOT 4
- Keyboard.Dismiss not working
- Action sheets not always displaying on top on iOS HOT 2
- pull to refresh is not working in FlatList
- TextInput crashes app
- BottomSafeAreaPadding HOT 2
- Keyboard handler causing full screen sheet to rapidly close and reopen, header scrolling behind dynamic island. HOT 7
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from react-native-actions-sheet.