Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

UI freezes on nested modals: Contained modal -> (any other modal) #1813

Closed
tboba opened this issue Jul 7, 2023 · 1 comment · Fixed by #1996
Closed

UI freezes on nested modals: Contained modal -> (any other modal) #1813

tboba opened this issue Jul 7, 2023 · 1 comment · Fixed by #1996
Assignees
Labels
Area: Modal Issue related with iOS modal stack presentation Bug Something isn't working Platform: iOS This issue is specific to iOS

Comments

@tboba
Copy link
Member

tboba commented Jul 7, 2023

Description

When I'm trying to open modal in a contained modal, it successfully opens, but after trying to go to the previous screen (which is a parent modal in our case) it doesn't close. However, swiping down a modal works as usual.

Example.-.UI.Freezes.mov

Steps to reproduce

With classic RN application approach:

  1. Create a contained modal that opens a prompt to open another modal.
  2. Open a contained modal and click a prompt to open submodal.
  3. Try to close a modal.

With react-native-screens example approach:

  1. In modals section create a screen in a main App component:
const App = (): JSX.Element => (
  // [...]
    <Stack.Screen
      name="ContainedModal"
      component={ModalScreen}
      options={{ stackPresentation: 'containedModal' }}
    />
  1. In StackParamList create a type for contained modal:
type StackParamList = {
  // [...]
  ContainedModal: undefined;
  // [...]
  1. In MainScreen component create a button, navigating to the newly created screen:
const MainScreen = ({ navigation }: MainScreenProps): JSX.Element => (
  <View style={{ ...styles(0).container, backgroundColor: 'bisque' }}>
    // [...]
    <Button
      title="Open contained modal"
      onPress={() => navigation.navigate('ContainedModal')}
    />
  1. Start the application and try to test cases, written in classic RN application approach.

Please also note that both containedModal and containedTransparentModal types should be tested.

Snack or a link to a repository

https://github.com/software-mansion/react-native-screens/tree/main/Example
(For reproduction, add steps mentioned above to the Modals file.)

Screens version

3.22.1

React Native version

0.69.7

Platforms

iOS

JavaScript runtime

None

Workflow

React Native (without Expo)

Architecture

Paper (Old Architecture)

Build type

Debug mode

Device

iOS simulator

Device model

iPhone 14 Pro (iOS 16.4)

Acknowledgements

Yes

@github-actions github-actions bot added Platform: iOS This issue is specific to iOS Missing repro This issue need minimum repro scenario labels Jul 7, 2023
@github-actions
Copy link

github-actions bot commented Jul 7, 2023

Hey! 👋

The issue doesn't seem to contain a minimal reproduction.

Could you provide a snack or a link to a GitHub repository under your username that reproduces the problem?

@tboba tboba added Bug Something isn't working Area: Modal Issue related with iOS modal stack presentation and removed Missing repro This issue need minimum repro scenario labels Jul 7, 2023
@github-actions github-actions bot added the Missing repro This issue need minimum repro scenario label Jul 7, 2023
@tboba tboba removed the Missing repro This issue need minimum repro scenario label Jul 7, 2023
@kkafar kkafar self-assigned this Dec 27, 2023
kkafar added a commit that referenced this issue Jan 2, 2024
…ntained modal (#1996)

## Description

Updated logic in `RNSScreenStackView#setModalViewControllers:` so that
it handles case when navigating back from top-level VC that was not
presented
by the screen stack itself, as it happens with
`UIModalPresentationCurrentContext` &
`UIModalPresentationOverCurrentContext`.

Fixes #1813

## Changes

We now check whether the top-level VC should be dismissed by the stack
being asked.

## Test code and steps to reproduce

See #1813 for reproduction steps.

I'm also adding these in `Example` application.

## Checklist

- [x] Included code example that can be used to test this change
- [x] Ensured that CI passes
ja1ns pushed a commit to WiseOwlTech/react-native-screens that referenced this issue Oct 9, 2024
…ntained modal (software-mansion#1996)

## Description

Updated logic in `RNSScreenStackView#setModalViewControllers:` so that
it handles case when navigating back from top-level VC that was not
presented
by the screen stack itself, as it happens with
`UIModalPresentationCurrentContext` &
`UIModalPresentationOverCurrentContext`.

Fixes software-mansion#1813

## Changes

We now check whether the top-level VC should be dismissed by the stack
being asked.

## Test code and steps to reproduce

See software-mansion#1813 for reproduction steps.

I'm also adding these in `Example` application.

## Checklist

- [x] Included code example that can be used to test this change
- [x] Ensured that CI passes
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Area: Modal Issue related with iOS modal stack presentation Bug Something isn't working Platform: iOS This issue is specific to iOS
Projects
None yet
2 participants