Skip to content

Commit

Permalink
Change Wrapper of InspectorPanel from View to SafeAreaView (#34500)
Browse files Browse the repository at this point in the history
Summary:
Currently, the `InspectorPanel` component is wrapped in `View`, which is a little difficult to click the panel button when in a device with a notch screen.

## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://reactnative.dev/contributing/changelogs-in-pull-requests
-->

[General] [Fixed] - Change Wrapper of `InspectorPanel` from `View` to `SafeAreaView`

Pull Request resolved: #34500

Test Plan:
**From:**

<img alt="" height="500" src="https://user-images.githubusercontent.com/3097366/186088404-32cb2707-a4f1-45d6-9f83-f0992d5ba64d.png"> <img alt="" height="500" src="https://user-images.githubusercontent.com/3097366/186088438-863fd7da-b827-4cc1-b873-f0bf38764e83.png">

**To:**

<img alt="" height="500" src="https://user-images.githubusercontent.com/3097366/186088518-6e131a8e-27ae-4eed-b97d-ee6f6ab5e669.png"> <img alt="" height="500" src="https://user-images.githubusercontent.com/3097366/186088550-35ce0512-ac4f-4ef1-b5db-f2a3ec434b24.png"> <img alt="" height="500" src="https://user-images.githubusercontent.com/3097366/186088579-ff42ee60-6b1c-4179-aae8-764f4d04e680.png">

Reviewed By: cipolleschi

Differential Revision: D39175153

Pulled By: lunaleaps

fbshipit-source-id: cba8b78a0dd3cbac27ee098dd1bb006d7af25987
  • Loading branch information
raykle authored and facebook-github-bot committed Aug 31, 2022
1 parent 823f6b7 commit afad68f
Showing 1 changed file with 3 additions and 2 deletions.
5 changes: 3 additions & 2 deletions Libraries/Inspector/InspectorPanel.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,6 +19,7 @@ const StyleSheet = require('../StyleSheet/StyleSheet');
const Text = require('../Text/Text');
const TouchableHighlight = require('../Components/Touchable/TouchableHighlight');
const View = require('../Components/View/View');
import SafeAreaView from '../Components/SafeAreaView/SafeAreaView';

import type {ViewStyleProp} from '../StyleSheet/StyleSheet';

Expand Down Expand Up @@ -84,7 +85,7 @@ class InspectorPanel extends React.Component<Props> {
contents = <View style={styles.waiting}>{this.renderWaiting()}</View>;
}
return (
<View style={styles.container}>
<SafeAreaView style={styles.container}>
{!this.props.devtoolsIsOpen && contents}
<View style={styles.buttonRow}>
<InspectorPanelButton
Expand All @@ -108,7 +109,7 @@ class InspectorPanel extends React.Component<Props> {
onClick={this.props.setTouchTargeting}
/>
</View>
</View>
</SafeAreaView>
);
}
}
Expand Down

0 comments on commit afad68f

Please sign in to comment.