search

Giphy / giphy-react-native-sdk

GIPHY React Native SDK
https://developers.giphy.com
Apache License 2.0
67 stars 25 forks source link

GiphyDialog does not work with formSheet modal #166

Closed timothyerwin closed 6 months ago

timothyerwin commented 6 months ago

🐛 Bug Report

(A clear and concise description of what the bug is)

Using react-navigation and presentation: 'formSheet' means the dialog will not show. It only seems to work with 'card' type.

To Reproduce

(Write your steps here:)

  1. Use react-navigation with StackNavigator and presentation: 'formSheet'
  2. Call GiphyDialog.show();

Expected behavior

(Write what you thought would happen.)

...should show the Giphy dialog

Actual Behavior

(Write what happened. Add screenshots, if applicable.)

Shows nothing.

Your Environment

Reproducible Demo

ALexanderLonsky commented 6 months ago

Hey @timothyerwin,

Indeed, that is strange. When using the native-stack + modal/formSheet, the dialog does not appear on iOS. Since you mentioned using an iPhone device, I believe you actually need a modal rather than a formSheet, as the last one is more suitable for larger screens. I'm not sure of the root cause of the issue, I'll need to investigate how the native-stack works under the hood. By the way, I've checked: on Android, the native-stack + modal also does not open up as a modal. However, react-navigation/stack behaves as expected. You can switch to it for now:

import { createStackNavigator } from '@react-navigation/stack';
const Stack = createStackNavigator();
<NavigationContainer>
    <Stack.Navigator>
        <Stack.Screen name="Home" component={Home} />
        <Stack.Screen name="NewScreen" component={NewScreen} options={{ presentation: 'modal' }} />
    </Stack.Navigator>
</NavigationContainer>

Please let me know if that works for you.

P.S. Just found this.

ALexanderLonsky commented 6 months ago

Okay, it seems I've found a solution to fix the issue on iOS for thenative-stack. I'll release a new version next week.

ALexanderLonsky commented 6 months ago

@timothyerwin, The issue should be resolved in version 3.2.3.

timothyerwin commented 6 months ago

https://github.com/Giphy/giphy-react-native-sdk/assets/2653209/a9663a6b-6407-45be-a702-aa35c2b7e326

It's working awesome. Thanks for the quick turnaround!