[0.83] Backport initial implementation of RedBox 2.0 for iOS (facebook#56574)

* Add per-platform redBoxV2 feature flags

Cherry-pick of d6ed561 with feature flag files regenerated
for the 0.83-stable branch.

* Extract RCTRedBoxController from RCTRedBox.mm (facebook#56509)

Summary:
Pull Request resolved: facebook#56509

Moves the `RCTRedBoxController` class, previously inlined in `RCTRedBox.mm`, into its own implementation and header files (`RCTRedBoxController.mm`, `RCTRedBoxController+Internal.h`). An upcoming diff will fork these files for the experimental RedBox 2.0.

Changelog: [Internal]

Reviewed By: christophpurrer

Differential Revision: D101484586

fbshipit-source-id: 0b0c80caa790ee5286c48adfce5c22d22bef47b6

* Add LogBox-styled error overlay (facebook#56550)

Summary:
Pull Request resolved: facebook#56550

Replace the legacy red-on-black RedBox design with a LogBox-inspired design for RedBox 2.0: charcoal background, salmon header bar, structured call stack, 3-button footer, full-screen view with no animated transition. Gated behind `redBoxV2IOS`.

This diff is just for the low-hanging fruit - setting up the split implementation and borrowing the broad visual style of LogBox. Further up this stack we will port more functionality and improve on this baseline.

Changelog: [Internal]

Reviewed By: cipolleschi

Differential Revision: D98115368

fbshipit-source-id: 7c14137c94c812f42b6af0c376762e068cfcdaaa

* Add shared C++ error parser and ANSI renderer (facebook#56553)

Summary:
Pull Request resolved: facebook#56553

Add a platform-independent C++ library (`ReactCommon/react/debug/redbox/`) for error message parsing and ANSI escape sequence rendering, shared by both iOS and Android.

`RedBoxErrorParser` — C++ port of `parseLogBoxException`. Classifies Metro errors, Babel transform errors, bundle loading errors, and code frame errors into a structured `ParsedError`.

`AnsiParser` — converts ANSI SGR sequences into styled spans with foreground/background colors using the Afterglow theme.

Uses `facebook::react::unstable_redbox` namespace to exclude from C++ API snapshots.

Changelog: [Internal]

Reviewed By: robhogan

Differential Revision: D101357709

fbshipit-source-id: d2ecf9d12897e00f9590e1bec57ecf5d5895fcd5

* Show syntax-highlighted code frames (facebook#56551)

Summary:
Pull Request resolved: facebook#56551

TSIA

Changelog: [Internal]

Reviewed By: cipolleschi

Differential Revision: D98113191

fbshipit-source-id: 00b640de69a5a3e48dae624dd24c25a1da3c7548

* Mark all errors as retryable (facebook#56552)

Summary:
Pull Request resolved: facebook#56552

Adds `isRetryable` and `isCompileError` to C++ `ParsedError` and its iOS wrapper, for use in RedBox 2.0. **Currently all errors are assumed to be retryable under RedBox 2.0.**

Changelog: [Internal]

Reviewed By: robhogan

Differential Revision: D101357708

fbshipit-source-id: 6a83b5944e5451a7818c66a321bf8d45a1951970

* Auto-reload on retryable errors (facebook#56549)

Summary:
Pull Request resolved: facebook#56549

Adds an automatic reload countdown to the RedBox 2.0 overlay for errors marked as retryable by the error parser. (Currently all of them, see D101357708.)

Changelog: [Internal]

Reviewed By: cipolleschi

Differential Revision: D98107027

fbshipit-source-id: 9f39491e4ecf5086a76b7f6446c34231a5d4eb0d

* Attempt to clear RedBox by automatically reloading on Metro file change (facebook#56554)

Summary:
Pull Request resolved: facebook#56554

While RedBox is displayed, open a native WebSocket to Metro's `/hot` endpoint. On file change, automatically reload — bridging the gap for bundle loading errors where the JS HMR client is unavailable.

Changelog: [Internal]

Reviewed By: robhogan

Differential Revision: D98350597

fbshipit-source-id: 9d11d99226483d937be45d75be008b0f9f25572b

* Fix truncated filenames in call stack frames (facebook#56565)

Summary:
Pull Request resolved: facebook#56565

Stack frame file paths in RedBox 2.0 were displaying as truncated jsc-safe-url fragments (e.g. `dev=true` instead of `index.bundle`). This happened because `lastPathComponent` treats the `//&` path-encoded query as additional path segments.

Here, we port the `jsc-safe-url` npm package to shared C++ (matching the JS implementation line-for-line, including the RFC 3986 appendix B regex) and use it to normalize stack frame URLs before extracting filenames. Query strings are also stripped after normalization.

Changelog: [Internal]

Reviewed By: robhogan

Differential Revision: D101796395

fbshipit-source-id: 38d5a8ccb111e78f847be4a551e359dd075e6a0f

* Guard tvOS-unavailable APIs in RCTRedBox2Controller (facebook#56568)

Summary:
Pull Request resolved: facebook#56568

`separatorStyle` and `UITableViewCellSeparatorStyleNone` are unavailable on tvOS, causing the airwave-tvos-appletvos build to fail. Wrap them with `#if !TARGET_OS_TV`, matching the existing pattern in `RCTRedBoxController.mm`.

Changelog: [Internal]

Reviewed By: motiz88

Differential Revision: D102001404

fbshipit-source-id: 383e1cc64070000c258b71a60aa4b4ef6453206e

* Fix C++ syntax in Objective-C header breaking React module build (facebook#56569)

Summary:
Pull Request resolved: facebook#56569

`RCTRedBox2Controller+Internal.h` used a C++ `using` type alias, which fails when compiled as plain Objective-C. This header is currently included in the `React-Core` umbrella header (via the `CoreModulesHeaders` subspec), so it gets compiled in a pure-ObjC context and breaks the RNTester iOS CI build.

Here, we replace the `using` with an equivalent `typedef`.

NOTE: The underlying issue is that this `+Internal.h` header should not be in the umbrella header at all. I will follow up to make the RedBox 2.0 internal headers private at the CocoaPods level.

Changelog: [Internal]

___

overriding_review_checks_triggers_an_audit_and_retroactive_review
Oncall Short Name: react_native

landed-with-radar-review

Reviewed By: sbuggay

Differential Revision: D102005814

fbshipit-source-id: d0a5727ee47ea5148a371074bc74e42e503c20f8

---------

Co-authored-by: Terry Kwon <kastopia@meta.com>

Author: motiz88

packages/react-native/Package.swift

@@ -94,6 +94,7 @@ let reactRendererConsistency = RNTarget(
 let reactDebug = RNTarget(
   name: .reactDebug,
   path: "ReactCommon/react/debug",
+  excludedPaths: ["tests", "redbox/tests"],
   dependencies: [.reactNativeDependencies]
 )
 /// React-jsi.podspec
@@ -380,7 +381,7 @@ let reactCoreModules = RNTarget(
   name: .reactCoreModules,
   path: "React/CoreModules",
   excludedPaths: ["PlatformStubs/RCTStatusBarManager.mm"],
-  dependencies: [.reactNativeDependencies, .jsi, .yoga, .reactTurboModuleCore]
+  dependencies: [.reactNativeDependencies, .jsi, .yoga, .reactTurboModuleCore, .reactFeatureFlags]
 )
 
 /// React-runtimeCore.podspec

packages/react-native/React/CoreModules/RCTJscSafeUrl+Internal.h

@@ -0,0 +1,23 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#import <Foundation/Foundation.h>
+
+/**
+ * Converts between standard URLs and JSC-safe URLs.
+ *
+ * JSC (JavaScriptCore) strips query strings from source URLs in stack traces
+ * as of iOS 16.4. Metro works around this by encoding the query string into
+ * the URL path. These methods convert between the two formats.
+ */
+@interface RCTJscSafeUrl : NSObject
+
++ (nonnull NSString *)normalUrlFromJscSafeUrl:(nonnull NSString *)url;
++ (nonnull NSString *)jscSafeUrlFromNormalUrl:(nonnull NSString *)url;
++ (BOOL)isJscSafeUrl:(nonnull NSString *)url;
+
+@end

packages/react-native/React/CoreModules/RCTJscSafeUrl.mm

@@ -0,0 +1,38 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#import "RCTJscSafeUrl+Internal.h"
+
+#import <React/RCTDefines.h>
+#import <react/debug/redbox/JscSafeUrl.h>
+
+#if RCT_DEV_MENU
+
+using facebook::react::unstable_redbox::isJscSafeUrl;
+using facebook::react::unstable_redbox::toJscSafeUrl;
+using facebook::react::unstable_redbox::toNormalUrl;
+
+@implementation RCTJscSafeUrl
+
++ (NSString *)normalUrlFromJscSafeUrl:(NSString *)url
+{
+  return [NSString stringWithUTF8String:toNormalUrl(url.UTF8String).c_str()];
+}
+
++ (NSString *)jscSafeUrlFromNormalUrl:(NSString *)url
+{
+  return [NSString stringWithUTF8String:toJscSafeUrl(url.UTF8String).c_str()];
+}
+
++ (BOOL)isJscSafeUrl:(NSString *)url
+{
+  return isJscSafeUrl(url.UTF8String);
+}
+
+@end
+
+#endif

packages/react-native/React/CoreModules/RCTRedBox+Internal.h

@@ -0,0 +1,42 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+#import <React/RCTDefines.h>
+#import <UIKit/UIKit.h>
+
+#if RCT_DEV_MENU
+
+@class RCTJSStackFrame;
+
+@protocol RCTRedBoxControllerActionDelegate <NSObject>
+
+- (void)redBoxController:(UIViewController *)redBoxController openStackFrameInEditor:(RCTJSStackFrame *)stackFrame;
+- (void)reloadFromRedBoxController:(UIViewController *)redBoxController;
+- (void)loadExtraDataViewController;
+
+@end
+
+@protocol RCTRedBoxControlling <NSObject>
+
+@property (nonatomic, weak) id<RCTRedBoxControllerActionDelegate> actionDelegate;
+
+- (void)showErrorMessage:(NSString *)message
+               withStack:(NSArray<RCTJSStackFrame *> *)stack
+                isUpdate:(BOOL)isUpdate
+             errorCookie:(int)errorCookie;
+
+- (void)dismiss;
+
+@end
+
+@protocol RCTRedBox2Controlling <RCTRedBoxControlling>
+
+@property (nonatomic, strong, nullable) NSURL *bundleURL;
+
+@end
+
+#endif