add spec for RedBox (#24922)

Summary:
part of #24875.

## Changelog

[General] [Added] - add TM spec for RedBox
Pull Request resolved: https://github.com/facebook/react-native/pull/24922

Reviewed By: RSNara

Differential Revision: D15423532

Pulled By: fkgozali

fbshipit-source-id: 3c30e5b32a29628caf0bb9286c0628597ac64fb7

Libraries/BugReporting/BugReporting.js

@@ -14,6 +14,7 @@ const RCTDeviceEventEmitter = require('../EventEmitter/RCTDeviceEventEmitter');
 const infoLog = require('../Utilities/infoLog');
 
 import type EmitterSubscription from '../vendor/emitter/EmitterSubscription';
+import NativeRedBox from '../NativeModules/specs/NativeRedBox';
 
 type ExtraData = {[key: string]: string};
 type SourceCallback = () => string;
@@ -127,10 +128,9 @@ class BugReporting {
       BugReportingNativeModule.setExtraData &&
       BugReportingNativeModule.setExtraData(extraData, fileData);
 
-    const RedBoxNativeModule = require('../BatchedBridge/NativeModules').RedBox;
-    RedBoxNativeModule &&
-      RedBoxNativeModule.setExtraData &&
-      RedBoxNativeModule.setExtraData(extraData, 'From BugReporting.js');
+    if (NativeRedBox != null && NativeRedBox.setExtraData != null) {
+      NativeRedBox.setExtraData(extraData, 'From BugReporting.js');
+    }
 
     return {extras: extraData, files: fileData};
   }

Libraries/NativeModules/specs/NativeRedBox.js

@@ -0,0 +1,21 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @flow
+ * @format
+ */
+
+'use strict';
+
+import type {TurboModule} from 'RCTExport';
+import * as TurboModuleRegistry from 'TurboModuleRegistry';
+
+export interface Spec extends TurboModule {
+  +setExtraData: (extraData: Object, identifier: string) => void;
+  +dismiss: () => void;
+}
+
+export default TurboModuleRegistry.get<Spec>('RedBox');

Libraries/Utilities/HMRClient.js

@@ -14,6 +14,8 @@ const invariant = require('invariant');
 
 const MetroHMRClient = require('metro/src/lib/bundle-modules/HMRClient');
 
+import NativeRedBox from '../NativeModules/specs/NativeRedBox';
+
 /**
  * HMR Client that receives from the server HMR updates and propagates them
  * runtime to reflects those changes.
@@ -72,9 +74,12 @@ Error: ${e.message}`;
     });
 
     hmrClient.on('update', () => {
-      if (Platform.OS === 'ios') {
-        const RCTRedBox = require('../BatchedBridge/NativeModules').RedBox;
-        RCTRedBox && RCTRedBox.dismiss && RCTRedBox.dismiss();
+      if (
+        Platform.OS === 'ios' &&
+        NativeRedBox != null &&
+        NativeRedBox.dismiss != null
+      ) {
+        NativeRedBox.dismiss();
       } else {
         const RCTExceptionsManager = require('../BatchedBridge/NativeModules')
           .ExceptionsManager;