fix event not firing (#5603)

Co-authored-by: Samuel Newman <[email protected]>

modules/bottom-sheet/ios/SheetView.swift

@@ -129,11 +129,7 @@ class SheetView: ExpoView, UISheetPresentationControllerDelegate {
     if let sheet = sheetVc.sheetPresentationController {
       sheet.delegate = self
       sheet.preferredCornerRadius = self.cornerRadius
-      if sheet.detents.count == 1 {
-        self.selectedDetentIdentifier = .large
-      } else {
-        self.selectedDetentIdentifier = sheet.selectedDetentIdentifier
-      }
+      self.selectedDetentIdentifier = sheet.selectedDetentIdentifier
     }
     sheetVc.view.addSubview(innerView)
 

modules/bottom-sheet/ios/SheetViewController.swift

@@ -31,6 +31,7 @@ class SheetViewController: UIViewController {
       sheet.detents = [
         .large()
       ]
+      sheet.selectedDetentIdentifier = .large
     } else {
       if #available(iOS 16.0, *) {
         sheet.detents = [
@@ -47,6 +48,7 @@ class SheetViewController: UIViewController {
       if !preventExpansion {
         sheet.detents.append(.large())
       }
+      sheet.selectedDetentIdentifier = .medium
     }
   }
 

modules/bottom-sheet/src/BottomSheet.tsx

@@ -1,11 +1,9 @@
 import * as React from 'react'
 import {
-  ColorValue,
   Dimensions,
   NativeSyntheticEvent,
   Platform,
   StyleProp,
-  StyleSheet,
   View,
   ViewStyle,
 } from 'react-native'
@@ -57,17 +55,6 @@ export class BottomSheet extends React.Component<
     this.props.onStateChange?.(event)
   }
 
-  private getBackgroundColor = (): ColorValue | undefined => {
-    const parent = React.Children.toArray(
-      this.props.children,
-    )[0] as React.ReactElement
-    if (parent?.props?.style) {
-      const parentStyle = StyleSheet.flatten(parent.props.style) as ViewStyle
-      return parentStyle.backgroundColor ?? 'transparent'
-    }
-    return undefined
-  }
-
   private updateLayout = () => {
     this.ref.current?.updateLayout()
   }
@@ -77,7 +64,7 @@ export class BottomSheet extends React.Component<
   }
 
   render() {
-    const {children, ...rest} = this.props
+    const {children, backgroundColor, ...rest} = this.props
     const topInset = rest.topInset ?? 0
     const bottomInset = rest.bottomInset ?? 0
     const cornerRadius = rest.cornerRadius ?? 0
@@ -86,7 +73,6 @@ export class BottomSheet extends React.Component<
       return null
     }
 
-    const backgroundColor = this.getBackgroundColor()
     return (
       <NativeView
         {...rest}

modules/bottom-sheet/src/BottomSheet.types.ts

@@ -9,23 +9,28 @@ export enum BottomSheetSnapPoint {
   Full,
 }
 
+export type BottomSheetAttemptDismissEvent = NativeSyntheticEvent<object>
+export type BottomSheetSnapPointChangeEvent = NativeSyntheticEvent<{
+  snapPoint: BottomSheetSnapPoint
+}>
+export type BottomSheetStateChangeEvent = NativeSyntheticEvent<{
+  state: BottomSheetState
+}>
+
 export interface BottomSheetViewProps {
   children: React.ReactNode
   cornerRadius?: number
   preventDismiss?: boolean
   preventExpansion?: boolean
+  backgroundColor?: ColorValue
   containerBackgroundColor?: ColorValue
   topInset?: number
   bottomInset?: number
 
   minHeight?: number
   maxHeight?: number
 
-  onAttemptDismiss?: (event: NativeSyntheticEvent<object>) => void
-  onSnapPointChange?: (
-    event: NativeSyntheticEvent<{snapPoint: BottomSheetSnapPoint}>,
-  ) => void
-  onStateChange?: (
-    event: NativeSyntheticEvent<{state: BottomSheetState}>,
-  ) => void
+  onAttemptDismiss?: (event: BottomSheetAttemptDismissEvent) => void
+  onSnapPointChange?: (event: BottomSheetSnapPointChangeEvent) => void
+  onStateChange?: (event: BottomSheetStateChangeEvent) => void
 }

package.json

@@ -137,7 +137,6 @@
     "expo-sharing": "^12.0.1",
     "expo-splash-screen": "~0.27.4",
     "expo-status-bar": "~1.12.1",
-    "expo-system-ui": "~3.0.4",
     "expo-task-manager": "~11.8.1",
     "expo-updates": "~0.25.14",
     "expo-web-browser": "~13.0.3",

patches/react-native+0.74.1.patch

@@ -38,37 +38,65 @@ index b0d71dc..41b9a0e 100644
 
  - (void)reactBlur
 diff --git a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.h b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.h
-index e9b330f..1ecdf0a 100644
+index e9b330f..ec5f58c 100644
 --- a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.h
 +++ b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.h
-@@ -16,4 +16,6 @@
+@@ -15,5 +15,8 @@
+ @property (nonatomic, copy) NSString *title;
  @property (nonatomic, copy) RCTDirectEventBlock onRefresh;
  @property (nonatomic, weak) UIScrollView *scrollView;
-
-+- (void)forwarderBeginRefreshing;
++@property (nonatomic, copy) UIColor *customTintColor;
 +
++- (void)forwarderBeginRefreshing;
+
  @end
 diff --git a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
-index b09e653..f93cb46 100644
+index b09e653..288e60c 100644
 --- a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
 +++ b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControl.m
-@@ -198,9 +198,53 @@ - (void)refreshControlValueChanged
-   [self setCurrentRefreshingState:super.refreshing];
-   _refreshingProgrammatically = NO;
+@@ -22,6 +22,7 @@ @implementation RCTRefreshControl {
+   NSString *_title;
+   UIColor *_titleColor;
+   CGFloat _progressViewOffset;
++  UIColor *_customTintColor;
+ }
 
-+  if (@available(iOS 17.4, *)) {
-+    if (_currentRefreshingState) {
-+      UIImpactFeedbackGenerator *feedbackGenerator = [[UIImpactFeedbackGenerator alloc] initWithStyle:UIImpactFeedbackStyleLight];
-+      [feedbackGenerator prepare];
-+      [feedbackGenerator impactOccurred];
-+    }
-+  }
+ - (instancetype)init
+@@ -56,6 +57,12 @@ - (void)layoutSubviews
+   _isInitialRender = false;
+ }
+
++- (void)didMoveToSuperview
++{
++  [super didMoveToSuperview];
++  [self setTintColor:_customTintColor];
++}
 +
-   if (_onRefresh) {
-     _onRefresh(nil);
+ - (void)beginRefreshingProgrammatically
+ {
+   UInt64 beginRefreshingTimestamp = _currentRefreshingStateTimestamp;
+@@ -203,4 +210,58 @@ - (void)refreshControlValueChanged
    }
  }
 
++- (void)setCustomTintColor:(UIColor *)customTintColor
++{
++  _customTintColor = customTintColor;
++  [self setTintColor:customTintColor];
++}
++
++// Fix for https://github.com/facebook/react-native/issues/43388
++// A bug in iOS 17.4 causes the haptic to not play when refreshing if the tintColor
++// is set before the refresh control gets added to the scrollview. We'll call this
++// function whenever the superview changes. We'll also call it if the value of customTintColor
++// changes.
++- (void)setTintColor:(UIColor *)tintColor
++{
++  if ([self.superview isKindOfClass:[UIScrollView class]] && self.tintColor != tintColor) {
++    [super setTintColor:tintColor];
++  }
++}
++
 +/*
 + This method is used by Bluesky's ExpoScrollForwarder. This allows other React Native
 + libraries to perform a refresh of a scrollview and access the refresh control's onRefresh
@@ -106,6 +134,24 @@ index b09e653..f93cb46 100644
 +}
 +
  @end
+diff --git a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControlManager.m b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControlManager.m
+index 40aaf9c..1c60164 100644
+--- a/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControlManager.m
++++ b/node_modules/react-native/React/Views/RefreshControl/RCTRefreshControlManager.m
+@@ -22,11 +22,12 @@ - (UIView *)view
+
+ RCT_EXPORT_VIEW_PROPERTY(onRefresh, RCTDirectEventBlock)
+ RCT_EXPORT_VIEW_PROPERTY(refreshing, BOOL)
+-RCT_EXPORT_VIEW_PROPERTY(tintColor, UIColor)
+ RCT_EXPORT_VIEW_PROPERTY(title, NSString)
+ RCT_EXPORT_VIEW_PROPERTY(titleColor, UIColor)
+ RCT_EXPORT_VIEW_PROPERTY(progressViewOffset, CGFloat)
+
++RCT_REMAP_VIEW_PROPERTY(tintColor, customTintColor, UIColor)
++
+ RCT_EXPORT_METHOD(setNativeRefreshing : (nonnull NSNumber *)viewTag toRefreshing : (BOOL)refreshing)
+ {
+   [self.bridge.uiManager addUIBlock:^(RCTUIManager *uiManager, NSDictionary<NSNumber *, UIView *> *viewRegistry) {
 diff --git a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java b/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java
 index 5f5e1ab..aac00b6 100644
 --- a/node_modules/react-native/ReactAndroid/src/main/java/com/facebook/react/modules/core/JavaTimerManager.java

src/App.native.tsx

@@ -1,6 +1,6 @@
 import 'react-native-url-polyfill/auto'
-import 'lib/sentry' // must be near top
-import 'view/icons'
+import '#/lib/sentry' // must be near top
+import '#/view/icons'
 
 import React, {useEffect, useState} from 'react'
 import {GestureHandlerRootView} from 'react-native-gesture-handler'

src/alf/util/useColorModeTheme.ts

@@ -1,9 +1,8 @@
 import React from 'react'
 import {ColorSchemeName, useColorScheme} from 'react-native'
-import * as SystemUI from 'expo-system-ui'
 
-import {isWeb} from 'platform/detection'
-import {useThemePrefs} from 'state/shell'
+import {isWeb} from '#/platform/detection'
+import {useThemePrefs} from '#/state/shell'
 import {dark, dim, light} from '#/alf/themes'
 import {ThemeName} from '#/alf/types'
 
@@ -12,7 +11,6 @@ export function useColorModeTheme(): ThemeName {
 
   React.useLayoutEffect(() => {
     updateDocument(theme)
-    SystemUI.setBackgroundColorAsync(getBackgroundColor(theme))
   }, [theme])
 
   return theme