[iOS]: Modal freezing on iPhone SE (3rd gen)

[pwltr]

Description

Using the default Modal component in 2 iOS simulators (iPhone 14 & iPhone SE 3rd generation) both running iOS 16.4 but the app freezes only on the SE.

Screen.Recording.2023-08-11.at.16.30.10.mov

I'm aware that there are similiar open issues to this one but they seemingly deal with dependency interop problems so opening a new issue since this one is more straightforward.

React Native Version

0.72.3

Output of npx react-native info

System:
  OS: macOS 13.4.1
  CPU: (8) arm64 Apple M1 Pro
  Memory: 92.56 MB / 16.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 18.16.0
    path: ~/.nvm/versions/node/v18.16.0/bin/node
  Yarn:
    version: 1.22.19
    path: /opt/homebrew/bin/yarn
  npm:
    version: 9.5.1
    path: ~/.nvm/versions/node/v18.16.0/bin/npm
  Watchman:
    version: 2023.07.10.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.12.1
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 22.4
      - iOS 16.4
      - macOS 13.3
      - tvOS 16.4
      - watchOS 9.4
  Android SDK: Not Found
IDEs:
  Android Studio: 2022.2 AI-222.4459.24.2221.9862592
  Xcode:
    version: 14.3.1/14E300c
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 11.0.20
    path: /usr/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli": Not Found
  react:
    installed: 18.2.0
    wanted: 18.2.0
  react-native:
    installed: 0.72.3
    wanted: 0.72.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: false
iOS:
  hermesEnabled: true
  newArchEnabled: false

Steps to reproduce

import React, {useState} from 'react';
import {Modal, View, Text, Button, StyleSheet} from 'react-native';

function App(): JSX.Element {
  const [isModalVisible, setModalVisible] = useState(false);

  const toggleModal = () => {
    setModalVisible(!isModalVisible);
  };

  return (
    <View style={styles.container}>
      <Button title="Show modal" onPress={toggleModal} />

      <Modal visible={isModalVisible}>
        <View style={styles.modal}>
          <Text>Hello!</Text>
          <Button title="Hide modal" onPress={toggleModal} />
        </View>
      </Modal>
    </View>
  );
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
  },
  modal: {
    flex: 1,
    alignItems: 'center',
    justifyContent: 'center',
  },
});

export default App;

Snack, screenshot, or link to a repository

Working example on expo: https://snack.expo.dev/Rmo-ac7kw?platform=ios

[pwltr]

I've reinstalled the iPhone SE simulator and now I cannot reproduce the issue anymore. Closing issue.