From 34420b2591854165d586cc4d01e8a230836a61ca Mon Sep 17 00:00:00 2001
From: Maksymilian Galas <maksymilian.galas@swmansion.com>
Date: Fri, 5 Jul 2024 16:23:59 +0200
Subject: [PATCH] fix(iOS): shadow does not appear on manual transition during
 push and pop

---
 apps/test-examples/App.js           |  1 +
 apps/test-examples/src/Test2227.tsx | 57 +++++++++++++++++++++++++++++
 ios/RNSScreenStack.mm               |  1 +
 ios/RNSScreenStackAnimator.mm       | 15 ++++++++
 4 files changed, 74 insertions(+)
 create mode 100644 apps/test-examples/src/Test2227.tsx

diff --git a/apps/test-examples/App.js b/apps/test-examples/App.js
index a07e927bc7..84bf4263e4 100644
--- a/apps/test-examples/App.js
+++ b/apps/test-examples/App.js
@@ -104,6 +104,7 @@ import Test2069 from './src/Test2069';
 import Test2118 from './src/Test2118';
 import Test2184 from './src/Test2184';
 import Test2223 from './src/Test2223';
+import Test2227 from './src/Test2227';
 import Test2229 from './src/Test2229';
 import TestScreenAnimation from './src/TestScreenAnimation';
 import TestHeader from './src/TestHeader';
diff --git a/apps/test-examples/src/Test2227.tsx b/apps/test-examples/src/Test2227.tsx
new file mode 100644
index 0000000000..d209c4a8fd
--- /dev/null
+++ b/apps/test-examples/src/Test2227.tsx
@@ -0,0 +1,57 @@
+import * as React from 'react';
+import {NavigationContainer} from '@react-navigation/native';
+import {
+  createNativeStackNavigator,
+  NativeStackScreenProps,
+} from '@react-navigation/native-stack';
+import {Button, View, Text} from 'react-native';
+
+type RootStackParamList = {
+  Home: undefined;
+  Details: undefined;
+};
+
+type HomeScreenProps = NativeStackScreenProps<RootStackParamList, 'Home'>;
+type DetailsScreenProps = NativeStackScreenProps<RootStackParamList, 'Details'>;
+
+const Stack = createNativeStackNavigator<RootStackParamList>();
+
+function HomeScreen({navigation}: HomeScreenProps) {
+  return (
+    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+      <Text>Home Screen</Text>
+      <Button
+        title="Go to Details"
+        onPress={() => navigation.navigate('Details')}
+      />
+    </View>
+  );
+}
+
+function DetailsScreen({navigation}: DetailsScreenProps) {
+  return (
+    <View style={{flex: 1, justifyContent: 'center', alignItems: 'center'}}>
+      <Text>Details Screen</Text>
+      <Button
+        title="Go to Details Again"
+        onPress={() => navigation.push('Details')}
+      />
+      <Button title="Go Back" onPress={() => navigation.goBack()} />
+      <Button title="Go to Home" onPress={() => navigation.navigate('Home')} />
+    </View>
+  );
+}
+
+export default function App() {
+  return (
+    <NavigationContainer>
+      <Stack.Navigator
+        screenOptions={{
+          fullScreenGestureEnabled: true,
+        }}>
+        <Stack.Screen name="Home" component={HomeScreen} />
+        <Stack.Screen name="Details" component={DetailsScreen} />
+      </Stack.Navigator>
+    </NavigationContainer>
+  );
+}
\ No newline at end of file
diff --git a/ios/RNSScreenStack.mm b/ios/RNSScreenStack.mm
index 7c5b6968ba..bfb6f14c81 100644
--- a/ios/RNSScreenStack.mm
+++ b/ios/RNSScreenStack.mm
@@ -872,6 +872,7 @@ - (void)handleSwipe:(UIPanGestureRecognizer *)gestureRecognizer
         [_interactionController cancelInteractiveTransition];
       }
       _interactionController = nil;
+      _isFullWidthSwiping = NO;
     }
     default: {
       break;
diff --git a/ios/RNSScreenStackAnimator.mm b/ios/RNSScreenStackAnimator.mm
index e31d20d4ea..5ff790f7bc 100644
--- a/ios/RNSScreenStackAnimator.mm
+++ b/ios/RNSScreenStackAnimator.mm
@@ -9,6 +9,9 @@
 static const float RNSSlideCloseTransitionDurationProportion = 0.25 / 0.35;
 static const float RNSFadeCloseTransitionDurationProportion = 0.15 / 0.35;
 static const float RNSFadeCloseDelayTransitionDurationProportion = 0.1 / 0.35;
+// same value is used in other projects using similar approach for transistions
+// and it looks the most similar to the value used by Apple
+constexpr float RNSShadowViewMaxAlpha = 0.1;
 
 @implementation RNSScreenStackAnimator {
   UINavigationControllerOperation _operation;
@@ -105,15 +108,23 @@ - (void)animateSimplePushWithTransitionContext:(id<UIViewControllerContextTransi
     leftTransform = CGAffineTransformMakeTranslation(belowViewWidth, 0);
   }
 
+  auto shadowView = [[UIView alloc] initWithFrame:fromViewController.view.frame];
+  shadowView.backgroundColor = [UIColor blackColor];
+
   if (_operation == UINavigationControllerOperationPush) {
     toViewController.view.transform = rightTransform;
     [[transitionContext containerView] addSubview:toViewController.view];
+    [[transitionContext containerView] insertSubview:shadowView belowSubview:toViewController.view];
+    shadowView.alpha = 0.0;
+
     [UIView animateWithDuration:[self transitionDuration:transitionContext]
         animations:^{
           fromViewController.view.transform = leftTransform;
           toViewController.view.transform = CGAffineTransformIdentity;
+          shadowView.alpha = RNSShadowViewMaxAlpha;
         }
         completion:^(BOOL finished) {
+          [shadowView removeFromSuperview];
           fromViewController.view.transform = CGAffineTransformIdentity;
           toViewController.view.transform = CGAffineTransformIdentity;
           [transitionContext completeTransition:![transitionContext transitionWasCancelled]];
@@ -121,12 +132,16 @@ - (void)animateSimplePushWithTransitionContext:(id<UIViewControllerContextTransi
   } else if (_operation == UINavigationControllerOperationPop) {
     toViewController.view.transform = leftTransform;
     [[transitionContext containerView] insertSubview:toViewController.view belowSubview:fromViewController.view];
+    [[transitionContext containerView] insertSubview:shadowView belowSubview:fromViewController.view];
+    shadowView.alpha = RNSShadowViewMaxAlpha;
 
     void (^animationBlock)(void) = ^{
       toViewController.view.transform = CGAffineTransformIdentity;
       fromViewController.view.transform = rightTransform;
+      shadowView.alpha = 0.0;
     };
     void (^completionBlock)(BOOL) = ^(BOOL finished) {
+      [shadowView removeFromSuperview];
       fromViewController.view.transform = CGAffineTransformIdentity;
       toViewController.view.transform = CGAffineTransformIdentity;
       [transitionContext completeTransition:![transitionContext transitionWasCancelled]];