Tweak pause overlay design, remove Step Over button (#44118)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/44118

Changelog: [Internal]

TSIA - following design feedback from huntie.

Reviewed By: huntie, hoxyq

Differential Revision: D56191051

fbshipit-source-id: 6497a0ec6c51808410c3745ce97ed44085add0ac
This commit is contained in:
Moti Zilberman
2024-04-17 04:05:36 -07:00
committed by Facebook GitHub Bot
parent 8872652236
commit f9eb35a581
4 changed files with 37 additions and 88 deletions
+12 -23
View File
@@ -211,29 +211,18 @@ class RCTBridgeHostTargetDelegate : public facebook::react::jsinspector_modern::
} else {
__weak RCTBridge *bridgeWeak = bridge_;
[pauseOverlayController_ showWithMessage:@(request.message.value().c_str())
onResume:^{
RCTAssertMainQueue();
RCTBridge *bridgeStrong = bridgeWeak;
if (!bridgeStrong) {
return;
}
if (!bridgeStrong.inspectorTarget) {
return;
}
bridgeStrong.inspectorTarget->sendCommand(facebook::react::jsinspector_modern::HostCommand::DebuggerResume);
}
onStepOver:^{
RCTAssertMainQueue();
RCTBridge *bridgeStrong = bridgeWeak;
if (!bridgeStrong) {
return;
}
if (!bridgeStrong.inspectorTarget) {
return;
}
bridgeStrong.inspectorTarget->sendCommand(
facebook::react::jsinspector_modern::HostCommand::DebuggerStepOver);
}];
onResume:^{
RCTAssertMainQueue();
RCTBridge *bridgeStrong = bridgeWeak;
if (!bridgeStrong) {
return;
}
if (!bridgeStrong.inspectorTarget) {
return;
}
bridgeStrong.inspectorTarget->sendCommand(
facebook::react::jsinspector_modern::HostCommand::DebuggerResume);
}];
}
}
@@ -9,7 +9,7 @@
@interface RCTPausedInDebuggerOverlayController : NSObject
- (void)showWithMessage:(NSString *)message onResume:(void (^)(void))onResume onStepOver:(void (^)(void))onStepOver;
- (void)showWithMessage:(NSString *)message onResume:(void (^)(void))onResume;
- (void)hide;
@end
@@ -11,7 +11,6 @@
@interface RCTPausedInDebuggerViewController : UIViewController
@property (nonatomic, copy) void (^onResume)(void);
@property (nonatomic, copy) void (^onStepOver)(void);
@property (nonatomic, strong) NSString *message;
@end
@@ -41,7 +40,7 @@
messageLabel.text = self.message;
messageLabel.textAlignment = NSTextAlignmentCenter;
messageLabel.numberOfLines = 0;
messageLabel.font = [UIFont boldSystemFontOfSize:14];
messageLabel.font = [UIFont boldSystemFontOfSize:16];
messageLabel.textColor = [UIColor blackColor];
messageLabel.translatesAutoresizingMaskIntoConstraints = NO;
UIView *messageContainer = [[UIView alloc] init];
@@ -49,8 +48,8 @@
[NSLayoutConstraint activateConstraints:@[
[messageLabel.topAnchor constraintEqualToAnchor:messageContainer.topAnchor],
[messageLabel.bottomAnchor constraintEqualToAnchor:messageContainer.bottomAnchor],
[messageLabel.leadingAnchor constraintEqualToAnchor:messageContainer.leadingAnchor constant:12],
[messageLabel.trailingAnchor constraintEqualToAnchor:messageContainer.trailingAnchor constant:-12]
[messageLabel.leadingAnchor constraintEqualToAnchor:messageContainer.leadingAnchor constant:14],
[messageLabel.trailingAnchor constraintEqualToAnchor:messageContainer.trailingAnchor],
]];
UIButton *resumeButton = [UIButton buttonWithType:UIButtonTypeCustom];
@@ -62,46 +61,23 @@
[resumeButton.heightAnchor constraintEqualToConstant:48],
]];
UIView *divider1 = [[UIView alloc] init];
divider1.backgroundColor = [UIColor colorWithRed:0.79 green:0.79 blue:0.79 alpha:1];
divider1.translatesAutoresizingMaskIntoConstraints = NO;
[NSLayoutConstraint activateConstraints:@[
[divider1.widthAnchor constraintEqualToConstant:1.0],
[divider1.heightAnchor constraintEqualToConstant:48.0],
]];
UIButton *stepOverButton = [UIButton buttonWithType:UIButtonTypeCustom];
[stepOverButton setImage:[UIImage systemImageNamed:@"hand.point.up.left.and.text.fill"]
forState:UIControlStateNormal];
[stepOverButton addTarget:self action:@selector(stepOverButtonTapped) forControlEvents:UIControlEventTouchUpInside];
[NSLayoutConstraint activateConstraints:@[
[stepOverButton.widthAnchor constraintEqualToConstant:48],
[stepOverButton.heightAnchor constraintEqualToConstant:48],
]];
UIView *divider2 = [[UIView alloc] init];
divider2.backgroundColor = [UIColor colorWithRed:0.79 green:0.79 blue:0.79 alpha:1];
divider2.translatesAutoresizingMaskIntoConstraints = NO;
[NSLayoutConstraint activateConstraints:@[
[divider2.widthAnchor constraintEqualToConstant:1.0],
[divider2.heightAnchor constraintEqualToConstant:48.0],
]];
UIStackView *stackView = [[UIStackView alloc]
initWithArrangedSubviews:@[ messageContainer, divider1, resumeButton, divider2, stepOverButton ]];
UIStackView *stackView = [[UIStackView alloc] initWithArrangedSubviews:@[ messageContainer, resumeButton ]];
stackView.backgroundColor = [UIColor colorWithRed:1 green:1 blue:0.757 alpha:1];
stackView.layer.cornerRadius = 12;
stackView.layer.borderWidth = 2;
stackView.layer.borderColor = [UIColor colorWithRed:0.816 green:0.816 blue:0.723 alpha:1].CGColor;
stackView.translatesAutoresizingMaskIntoConstraints = NO;
stackView.axis = UILayoutConstraintAxisHorizontal;
stackView.distribution = UIStackViewDistributionFill;
stackView.alignment = UIStackViewAlignmentCenter;
[self.view addSubview:stackView];
stackView.translatesAutoresizingMaskIntoConstraints = NO;
[NSLayoutConstraint activateConstraints:@[
[stackView.topAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.topAnchor constant:10],
[stackView.topAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.topAnchor constant:12],
[stackView.centerXAnchor constraintEqualToAnchor:self.view.safeAreaLayoutGuide.centerXAnchor],
]];
stackView.backgroundColor = [UIColor colorWithRed:1 green:1 blue:0.76 alpha:1];
stackView.semanticContentAttribute = UISemanticContentAttributeForceLeftToRight;
}
@@ -109,11 +85,6 @@
{
self.onResume();
}
- (void)stepOverButtonTapped
{
self.onStepOver();
}
@end
@implementation RCTPausedInDebuggerOverlayController
@@ -132,7 +103,7 @@
return _alertWindow;
}
- (void)showWithMessage:(NSString *)message onResume:(void (^)(void))onResume onStepOver:(void (^)(void))onStepOver
- (void)showWithMessage:(NSString *)message onResume:(void (^)(void))onResume
{
[self hide];
@@ -140,7 +111,6 @@
view.modalPresentationStyle = UIModalPresentationOverFullScreen;
view.message = message;
view.onResume = onResume;
view.onStepOver = onStepOver;
[self.alertWindow makeKeyAndVisible];
[self.alertWindow.rootViewController presentViewController:view animated:NO completion:nil];
}
@@ -53,29 +53,19 @@ class RCTHostHostTargetDelegate : public facebook::react::jsinspector_modern::Ho
[pauseOverlayController_ hide];
} else {
__weak RCTHost *hostWeak = host_;
[pauseOverlayController_ showWithMessage:@(request.message.value().c_str())
onResume:^{
RCTAssertMainQueue();
RCTHost *hostStrong = hostWeak;
if (!hostStrong) {
return;
}
if (!hostStrong.inspectorTarget) {
return;
}
hostStrong.inspectorTarget->sendCommand(jsinspector_modern::HostCommand::DebuggerResume);
}
onStepOver:^{
RCTAssertMainQueue();
RCTHost *hostStrong = hostWeak;
if (!hostStrong) {
return;
}
if (!hostStrong.inspectorTarget) {
return;
}
hostStrong.inspectorTarget->sendCommand(jsinspector_modern::HostCommand::DebuggerStepOver);
}];
[pauseOverlayController_
showWithMessage:@(request.message.value().c_str())
onResume:^{
RCTAssertMainQueue();
RCTHost *hostStrong = hostWeak;
if (!hostStrong) {
return;
}
if (!hostStrong.inspectorTarget) {
return;
}
hostStrong.inspectorTarget->sendCommand(jsinspector_modern::HostCommand::DebuggerResume);
}];
}
}