feat: Add dismissActionSheet method to ActionSheetIOS (#33189)

Summary: This PR adds a `dismissActionSheet` method to `ActionSheetIOS` in order to allow dismissing an ActionSheet programmatically. This is especially useful in apps where a user has the ability to open an ActionSheet and then open a push notification that will redirect them to another screen which usually leads to scenarios where the presented ActionSheet has no relation with the current screen. #### TODO - [ ] Submit react-native-website PR updating ActionSheetIOS documentation. ## Changelog [iOS] [Added] - Add dismissActionSheet method to ActionSheetIOS Pull Request resolved: #33189 Test Plan: 1. Open the RNTester app and navigate to the ActionSheetIOS page 2. Test `dismissActionSheet` through the `Show Action Sheet and automatically dismiss it` example https://user-images.githubusercontent.com/11707729/155867546-c6770a49-9b09-45e3-a6b1-4f7645d67dbf.mov Reviewed By: lunaleaps Differential Revision: D34518952 Pulled By: cortinico fbshipit-source-id: 912a9b83ee078f791b42efddf5abb7e1cd09d520
facebook · Mar 12, 2022 · 64ebe5b · 64ebe5b
1 parent 1042a80
commit 64ebe5b
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 0 deletions.
diff --git a/Libraries/ActionSheetIOS/ActionSheetIOS.js b/Libraries/ActionSheetIOS/ActionSheetIOS.js
@@ -143,6 +143,13 @@ const ActionSheetIOS = {
       successCallback,
     );
   },
+
+  dismissActionSheet: () => {
+    invariant(RCTActionSheetManager, "ActionSheetManager doesn't exist");
+    if (typeof RCTActionSheetManager.dismissActionSheet === 'function') {
+      RCTActionSheetManager.dismissActionSheet();
+    }
+  },
 };
 
 module.exports = ActionSheetIOS;
diff --git a/Libraries/ActionSheetIOS/NativeActionSheetManager.js b/Libraries/ActionSheetIOS/NativeActionSheetManager.js
@@ -47,6 +47,7 @@ export interface Spec extends TurboModule {
     |}) => void,
     successCallback: (completed: boolean, activityType: ?string) => void,
   ) => void;
+  +dismissActionSheet?: () => void;
 }
 
 export default (TurboModuleRegistry.get<Spec>('ActionSheetManager'): ?Spec);
diff --git a/React/CoreModules/RCTActionSheetManager.mm b/React/CoreModules/RCTActionSheetManager.mm
@@ -21,10 +21,27 @@
 using namespace facebook::react;
 
 @interface RCTActionSheetManager () <UIActionSheetDelegate, NativeActionSheetManagerSpec>
+
+@property (nonatomic, strong) NSMutableArray<UIAlertController *> *alertControllers;
+
 @end
 
 @implementation RCTActionSheetManager
 
+- (instancetype)init
+{
+  self = [super init];
+  if (self) {
+    _alertControllers = [NSMutableArray new];
+  }
+  return self;
+}
+
++ (BOOL)requiresMainQueueSetup
+{
+  return NO;
+}
+
 RCT_EXPORT_MODULE()
 
 @synthesize viewRegistry_DEPRECATED = _viewRegistry_DEPRECATED;
@@ -137,6 +154,7 @@ - (void)presentViewController:(UIViewController *)alertController
                                                          handler:^(__unused UIAlertAction *action) {
                                                            if (!callbackInvoked) {
                                                              callbackInvoked = true;
+                                                             [self->_alertControllers removeObject:alertController];
                                                              callback(@[ @(localIndex) ]);
                                                            }
                                                          }];
@@ -178,9 +196,21 @@ - (void)presentViewController:(UIViewController *)alertController
   }
 #endif
 
+  [_alertControllers addObject:alertController];
   [self presentViewController:alertController onParentViewController:controller anchorViewTag:anchorViewTag];
 }
 
+RCT_EXPORT_METHOD(dismissActionSheet)
+{
+  if (_alertControllers.count == 0) {
+    RCTLogWarn(@"Unable to dismiss action sheet");
+  }
+
+  id _alertController = [_alertControllers lastObject];
+  [_alertController dismissViewControllerAnimated:YES completion:nil];
+  [_alertControllers removeLastObject];
+}
+
 RCT_EXPORT_METHOD(showShareActionSheetWithOptions
                   : (JS::NativeActionSheetManager::SpecShowShareActionSheetWithOptionsOptions &)options failureCallback
                   : (RCTResponseSenderBlock)failureCallback successCallback

diff --git a/packages/rn-tester/js/examples/ActionSheetIOS/ActionSheetIOSExample.js b/packages/rn-tester/js/examples/ActionSheetIOS/ActionSheetIOSExample.js
@@ -204,6 +204,34 @@ class ActionSheetDisabledExample extends React.Component<Props, State> {
   };
 }
 
+class ActionSheetDismissExample extends React.Component<{...}> {
+  render() {
+    return (
+      <View>
+        <Text onPress={this.showAndDismissActionSheet} style={style.button}>
+          Click to show and automatically dismiss the ActionSheet after 3
+          seconds
+        </Text>
+      </View>
+    );
+  }
+
+  showAndDismissActionSheet = () => {
+    ActionSheetIOS.showActionSheetWithOptions(
+      {
+        options: BUTTONS,
+        cancelButtonIndex: CANCEL_INDEX,
+        destructiveButtonIndex: DESTRUCTIVE_INDEX,
+      },
+      () => {},
+    );
+
+    setTimeout(() => {
+      ActionSheetIOS.dismissActionSheet();
+    }, 3000);
+  };
+}
+
 class ShareActionSheetExample extends React.Component<
   $FlowFixMeProps,
   $FlowFixMeState,
@@ -394,6 +422,12 @@ exports.examples = [
       return <ActionSheetDisabledExample />;
     },
   },
+  {
+    title: 'Show Action Sheet and automatically dismiss it',
+    render(): React.Element<any> {
+      return <ActionSheetDismissExample />;
+    },
+  },
   {
     title: 'Show Share Action Sheet',
     render(): React.Element<any> {