react-native: Apple TV react-native doesn't follow Apple's tvOS guidelines for menu key behavior

Going forward, Apple TV is going to be supported in a community repo separate from RN core… https://github.com/react-native-community/react-native-tvos . Just added a commit that fixes this issue by adding a new TVMenuControl module, with methods to enable and disable the menu key gesture handler. The commit includes changes to the RNTester app to show how to use the new module to enable the menu key when pushing a screen, and disabling the menu key when you’re back to the bottom level of your navigation.

Sure.

I made a method that will look for the GestureHandler. Keep a reference to it in the AppDegelate. Later you can remove the GestureHandler when your app reaches the Top level. In this case the App will close and go to the Home screen. You can re-add the GestureRecognizer when necessary.

- (void)findMenuHandler:(UIView*)rootView {
  for(UIGestureRecognizer *gr in rootView.gestureRecognizers) {
    if ([gr.allowedPressTypes.firstObject isEqualToValue:@(UIPressTypeMenu)]) {
      self.menuGestureRecognizer = gr;
    }
  }
}


- (void)setMenuHandlerEnabled:(BOOL)enabled {
  UIWindow * window = [[UIApplication sharedApplication] keyWindow];
  RCTRootView *rootView = (RCTRootView*)window.rootViewController.view;
  if (enabled) {
    [rootView addGestureRecognizer:self.menuGestureRecognizer];
  } else {
    [rootView removeGestureRecognizer:self.menuGestureRecognizer];
  }
}

In case it helps anybody else, this was my workaround.

I added the below method to my bridge that lets me enable/disable the menu button gesture recognizer. If the gesture recognizer is enabled, we can handle the menu button and go back a screen. If the gesture recognizer is NOT enabled, the app will close.

#import <React/RCTRootView.h>
#import <React/RCTTVRemoteHandler.h>
#import <React/RCTRootViewInternal.h>

RCT_EXPORT_METHOD(setMenuHandlerEnabled: (nonnull NSNumber*)enabled) {
    dispatch_async(dispatch_get_main_queue(), ^{
        // get your RCTRootView somehow - your code may differ here
        RSTVAppDelegate *appDelegate = (RSTVAppDelegate*)[[UIApplication sharedApplication] delegate];
        RCTRootView *rootView = (RCTRootView*)appDelegate.rootViewController.view;

        // get the menu button gesture recognizer and enable/disable it
        UITapGestureRecognizer *menuTapRecognizer = [rootView.tvRemoteHandler.tvRemoteGestureRecognizers objectForKey:RCTTVRemoteEventMenu];
        menuTapRecognizer.enabled = [enabled boolValue];
    });
}

Then in my javascript I call NativeModules.YourBridge.setMenuHandlerEnabled(false); when my home screen mounts or the user returns to my homescreen. I call NativeModules.YourBridge.setMenuHandlerEnabled(true); when the user visits any other screen.

I thought the Menu button would go back to the previous screen, and when the root screen of the app is reached, it would exit to the Apple TV home screen? The home button will always exit the app?

From the Apple Docs:

" Users expect to press the Menu button on the remote and return to a previous screen or the main Apple TV Home screen. Pressing Menu at the top level of an app or game should always exit to the Apple TV Home screen. During gameplay, pressing Menu should show or hide an in-game pause menu that includes an option to navigate back to the game’s main menu. "