feat(iOS, Stack v5): Align Stack implementation with RFC 753

apps/src/shared/gamma/containers/stack/StackContainer.types.tsx

@@ -20,6 +20,7 @@ export type StackRouteConfig = {
 export type StackRoute = StackRouteConfig & {
   activityMode: StackScreenProps['activityMode'];
   routeKey: StackScreenProps['screenKey'];
+  isMarkedForDismissal: Boolean, // whether this route is during or after dismissal process
 };
 
 /// StackContainer props

apps/src/shared/gamma/containers/stack/reducer.tsx

@@ -81,7 +81,7 @@ function navigationActionPushHandler(
   const stack = state.stack;
   const renderedRouteIndex = stack.findIndex(
     route =>
-      route.name === action.routeName && route.activityMode === 'detached',
+      route.name === action.routeName && route.activityMode === 'detached' && !route.isMarkedForDismissal,
   );
 
   if (renderedRouteIndex !== NOT_FOUND_INDEX) {
@@ -161,12 +161,21 @@ function navigationActionPopHandler(
     return state;
   }
 
+  // Pop operation on not-top screen is forbidden and might crash.
+  const topAttachedRouteIndex = state.stack.findLastIndex(r => r.activityMode === 'attached');
+
+  if (topAttachedRouteIndex > routeIndex) {
+    console.warn(`[Stack] Can not perform pop action on route: ${action.routeKey} - not a top screen`);
+    return state;
+  }
+
   const newStack = [...stack];
   // NOTE: This modifies existing state, possibly impacting calculations done before new state is updated.
   // Consider doing deep copy of the state here.
   // EDIT: not sure really whether this is really a problem or not, since the updates are queued
   // and the original state won't be immediatelly affected.
   route.activityMode = 'detached';
+  route.isMarkedForDismissal = true;
 
   return stateWithStack(state, newStack);
 }
@@ -266,6 +275,7 @@ function createRouteFromConfig(
     ...config,
     activityMode,
     routeKey: generateRouteKeyForRouteName(config.name),
+    isMarkedForDismissal: false,
   };
 }
 
@@ -312,7 +322,7 @@ function applyPush(state: StackState, newRoute: StackRoute): StackState {
     route => route.activityMode === 'attached',
   );
 
-  if (lastAttachedIndex === -1) {
+  if (lastAttachedIndex === NOT_FOUND_INDEX) {
     throw new Error(
       `[Stack] Invalid stack state: there should be at least one attached route on the stack.`,
     );

apps/src/tests/single-feature-tests/stack-v5/index.ts

@@ -3,12 +3,14 @@ import PreventNativeDismissSingleStack from './prevent-native-dismiss-single-sta
 import PreventNativeDismissNestedStack from './prevent-native-dismiss-nested-stack';
 import AnimationAndroid from './test-animation-android';
 import TestStackHeaderModes from './test-stack-header-modes';
+import TestStackSimpleNav from './test-stack-simple-nav';
 
 const scenarios = {
   PreventNativeDismissSingleStack,
   PreventNativeDismissNestedStack,
   AnimationAndroid,
   TestStackHeaderModes,
+  TestStackSimpleNav,
 };
 
 const StackScenarioGroup: ScenarioGroup<keyof typeof scenarios> = {

apps/src/tests/single-feature-tests/stack-v5/test-stack-simple-nav/index.tsx

@@ -0,0 +1,97 @@
+import React from 'react';
+import type { Scenario } from '@apps/tests/shared/helpers';
+import { StyleSheet, Text, View } from 'react-native';
+import {
+  StackContainer,
+  useStackNavigationContext,
+} from '@apps/shared/gamma/containers/stack';
+import { CenteredLayoutView } from '@apps/shared/CenteredLayoutView';
+import Colors from '@apps/shared/styling/Colors';
+import { StackNavigationButtons } from '@apps/tests/shared/components/stack-v5/StackNavigationButtons';
+
+const SCENARIO: Scenario = {
+  name: 'Simple navigation scenario',
+  key: 'test-stack-simple-nav',
+  details:
+    'Test simple push and pop operations',
+  platforms: ['android', 'ios'],
+  AppComponent: App,
+};
+
+export default SCENARIO;
+
+export function App() {
+  return (
+    <StackSetup />
+  );
+}
+
+function StackSetup() {
+  return (
+    <StackContainer
+      routeConfigs={[
+        {
+          name: 'Home',
+          Component: HomeScreen,
+          options: {},
+        },
+        {
+          name: 'A',
+          Component: AScreen,
+          options: {},
+        },
+        {
+          name: 'B',
+          Component: BScreen,
+          options: {},
+        },
+      ]}
+    />
+  );
+}
+
+function HomeScreen() {
+  return (
+    <CenteredLayoutView style={{ backgroundColor: Colors.BlueLight40 }}>
+      <RouteInformation routeName="Home" />
+      <StackNavigationButtons isPopEnabled={false} routeNames={['A', 'B']} />
+    </CenteredLayoutView>
+  );
+}
+
+function AScreen() {
+  return (
+    <CenteredLayoutView style={{ backgroundColor: Colors.YellowLight40 }}>
+      <RouteInformation routeName="A" />
+      <StackNavigationButtons isPopEnabled={true} routeNames={['A', 'B']} />
+    </CenteredLayoutView>
+  );
+}
+
+function BScreen() {
+  return (
+    <CenteredLayoutView style={{ backgroundColor: Colors.GreenLight100 }}>
+      <RouteInformation routeName="B" />
+      <StackNavigationButtons isPopEnabled={true} routeNames={['A', 'B']} />
+    </CenteredLayoutView>
+  );
+}
+
+function RouteInformation(props: { routeName: string }) {
+  const routeKey = useStackNavigationContext().routeKey;
+
+  return (
+    <View>
+      <Text style={styles.routeInformation}>Name: {props.routeName}</Text>
+      <Text style={styles.routeInformation}>Key: {routeKey}</Text>
+    </View>
+  );
+}
+
+const styles = StyleSheet.create({
+  routeInformation: {
+    color: 'black',
+    fontSize: 20,
+    fontWeight: 'bold',
+  },
+});

ios/gamma/stack/host/RNSStackHostComponentView.h

@@ -1,18 +1,12 @@
 #pragma once
 
 #import "RNSReactBaseView.h"
-
-@class RNSStackController;
-@class RNSStackScreenComponentView;
+#import "RNSStackScreenComponentView.h"
 
 NS_ASSUME_NONNULL_BEGIN
 
 @interface RNSStackHostComponentView : RNSReactBaseView
 
-@property (nonatomic, nonnull, strong, readonly) RNSStackController *stackController;
-
-- (nonnull NSMutableArray<RNSStackScreenComponentView *> *)reactSubviews;
-
 @end
 
 #pragma mark - Communication with StackScreen