feat(iOS, SplitView): Add support for showsSecondaryOnlyButton (#3002)

## Description

Closes
software-mansion/react-native-screens-labs#231

Adding setter for showsSecondaryOnlyButton which adds native button for
toggling display mode to `secondaryOnly`.

### Notes:

- In the pure native app, when I wanted to change this value
dynamically, update for button visibility was applied after another
interaction, like swiping one of columns.

## Changes

- Added native setter
- Updated native component in JS
- Updated app

## Test code and steps to reproduce

Added this prop to `SplitViewBaseApp`

## Checklist

- [x] Included code example that can be used to test this change
- [x] Ensured that CI passes

Author: t0maboro

ios/gamma/split-view/RNSSplitViewHostComponentView.h

@@ -22,6 +22,7 @@ NS_ASSUME_NONNULL_BEGIN
 @property (nonatomic, readonly) UISplitViewControllerPrimaryEdge primaryEdge;
 @property (nonatomic, readonly) UISplitViewControllerDisplayMode displayMode;
 @property (nonatomic, readonly) BOOL presentsWithGesture;
+@property (nonatomic, readonly) BOOL showSecondaryToggleButton;
 
 @end
 

ios/gamma/split-view/RNSSplitViewHostComponentView.mm

@@ -19,6 +19,8 @@ @implementation RNSSplitViewHostComponentView {
   NSMutableArray<RNSSplitViewScreenComponentView *> *_Nonnull _reactSubviews;
 
   bool _hasModifiedReactSubviewsInCurrentTransaction;
+  // We need this information to warn users about dynamic changes to behavior being currently unsupported.
+  bool _isShowSecondaryToggleButtonSet;
 }
 
 - (instancetype)initWithFrame:(CGRect)frame
@@ -50,6 +52,9 @@ - (void)resetProps
   _primaryEdge = UISplitViewControllerPrimaryEdgeLeading;
   _displayMode = UISplitViewControllerDisplayModeAutomatic;
   _presentsWithGesture = true;
+  _showSecondaryToggleButton = false;
+
+  _isShowSecondaryToggleButtonSet = false;
 }
 
 - (void)didMoveToWindow
@@ -161,6 +166,20 @@ - (void)updateProps:(const facebook::react::Props::Shared &)props
     _controller.presentsWithGesture = _presentsWithGesture;
   }
 
+  if (oldComponentProps.showSecondaryToggleButton != newComponentProps.showSecondaryToggleButton) {
+    _showSecondaryToggleButton = newComponentProps.showSecondaryToggleButton;
+    _controller.showsSecondaryOnlyButton = _showSecondaryToggleButton;
+
+    if (_isShowSecondaryToggleButtonSet) {
+      RCTLogWarn(@"[RNScreens] changing showSecondaryToggleButton dynamically is currently unsupported");
+    }
+  }
+
+  // This flag is set to true when showsSecondaryOnlyButton prop is assigned for the first time.
+  // This allows us to identify any subsequent changes to this prop,
+  // enabling us to warn users that dynamic changes are not supported.
+  _isShowSecondaryToggleButtonSet = true;
+
   [super updateProps:props oldProps:oldProps];
 }
 

src/components/gamma/SplitViewHost.tsx

@@ -9,14 +9,7 @@ import type {
 } from '../../fabric/gamma/SplitViewHostNativeComponent';
 
 export type SplitViewNativeProps = NativeProps & {
-  // SplitView appearance
-
-  displayMode?: SplitViewDisplayMode;
-  splitBehavior?: SplitViewSplitBehavior;
-
-  // SplitView interactions
-
-  presentsWithGesture?: boolean;
+  // Overrides
 };
 
 type SplitViewHostProps = {

src/fabric/gamma/SplitViewHostNativeComponent.ts

@@ -28,6 +28,9 @@ export interface NativeProps extends ViewProps {
   splitBehavior?: WithDefault<SplitViewSplitBehavior, 'automatic'>;
   primaryEdge?: WithDefault<SplitViewPrimaryEdge, 'leading'>;
 
+  // NOTE: this setter cannot change the value dynamically, even in pure native app
+  showSecondaryToggleButton?: WithDefault<boolean, false>;
+
   // Interactions
 
   presentsWithGesture?: WithDefault<boolean, true>;