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

fix(iOS, Paper): possibility of infinite loop when swiping back in nested stack #2223

Merged
merged 3 commits into from
Jul 2, 2024
Merged
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions apps/test-examples/App.js
Original file line number Diff line number Diff line change
@@ -103,6 +103,7 @@ import Test2048 from './src/Test2048';
import Test2069 from './src/Test2069';
import Test2118 from './src/Test2118';
import Test2184 from './src/Test2184';
import Test2223 from './src/Test2223';
import TestScreenAnimation from './src/TestScreenAnimation';
import TestHeader from './src/TestHeader';

92 changes: 92 additions & 0 deletions apps/test-examples/src/Test2223.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,92 @@
import React from 'react';
import { View, Text, Button, Pressable, StyleSheet, Alert } from 'react-native';
import { NavigationContainer, useNavigation } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';

const Stack = createNativeStackNavigator(); // <-- change to createStackNavigator to see a difference
const NestedStack = createNativeStackNavigator();

export default function App() {
return (
<NavigationContainer>
<Stack.Navigator screenOptions={{ animation: 'slide_from_left' }}>
<Stack.Screen name="Home" component={HomeScreen} />
<Stack.Screen name="DetailsStack" component={DetailsScreen} />
<Stack.Screen name="NestedStack" component={NestedStackScreen} />
</Stack.Navigator>
</NavigationContainer>
);
}

function NestedStackScreen() {
return (
<NestedStack.Navigator>
<NestedStack.Screen name="NSHome" component={HomeScreen} />
<NestedStack.Screen name="NSDetailsStack" component={DetailsScreen} />
</NestedStack.Navigator>
);
}

function HomeScreen() {
const navigation = useNavigation();
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text>Home Screen</Text>
<Button
title="Go to Details"
onPress={() => navigation.navigate('DetailsStack')}
/>
<Button
title="Go to NestedStack"
onPress={() => navigation.navigate('NestedStack')}
/>
<Button
title="Go to NestedStack Details"
onPress={() => navigation.navigate('NSDetailsStack')}
/>
</View>
);
}

function DetailsScreen() {
const navigation = useNavigation();
return (
<View style={{ flex: 1, alignItems: 'center' }}>
<Button
title="Go to Details"
onPress={() => navigation.navigate('DetailsStack2')}
/>
{new Array(10).fill(0).map((_, i) => (
<Pressable
key={i.toString()}
onPress={() => {
Alert.alert('Pressed!');
}}
style={({ pressed }) => [
{
backgroundColor: pressed ? 'rgb(210, 230, 255)' : 'white',
},
styles.wrapperCustom,
]}>
{({ pressed }) => (
<Text style={styles.text}>{pressed ? 'Pressed!' : 'Press Me'}</Text>
)}
</Pressable>
))}
</View>
);
}

const styles = StyleSheet.create({
wrapperCustom: {
width: '100%',
height: 100,
marginHorizontal: 30,
borderRadius: 10,
margin: 10,
},
text: {
fontSize: 20,
color: 'black',
},
});
2 changes: 1 addition & 1 deletion ios/utils/UIView+RNSUtility.mm
Original file line number Diff line number Diff line change
@@ -9,7 +9,7 @@ @implementation UIView (RNSUtility)

- (nullable RNS_TOUCH_HANDLER_ARCH_TYPE *)rnscreens_findTouchHandlerInAncestorChain
{
UIView *parent = self;
UIView *parent = self.superview;

#ifdef RCT_NEW_ARCH_ENABLED
// On Fabric there is no view that exposes touchHandler above us in the view hierarchy, however it is still
Loading