Merge pull request #18465 from Expensify/yuwen-fixHeader

Fix header with close button styles
Expensify · May 5, 2023 · a3aa887 · a3aa887
2 parents 230b7f7 + 6fede6d
commit a3aa887
Showing 1 changed file with 23 additions and 25 deletions.
diff --git a/src/components/HeaderWithCloseButton.js b/src/components/HeaderWithCloseButton.js
@@ -165,37 +165,35 @@ class HeaderWithCloseButton extends Component {
                     styles.overflowHidden,
                 ]}
                 >
-                    <View style={[styles.flexRow, styles.flex1]}>
-                        {this.props.shouldShowBackButton && (
-                            <Tooltip text={this.props.translate('common.back')}>
-                                <Pressable
-                                    onPress={() => {
-                                        if (this.props.isKeyboardShown) {
-                                            Keyboard.dismiss();
-                                        }
-                                        this.props.onBackButtonPress();
-                                    }}
-                                    style={[styles.touchableButtonImage]}
-                                >
-                                    <Icon src={Expensicons.BackArrow} />
-                                </Pressable>
-                            </Tooltip>
-                        )}
-                        {this.props.shouldShowAvatarWithDisplay && (
-                            <AvatarWithDisplayName
-                                report={this.props.report}
-                                policies={this.props.policies}
-                                personalDetails={this.props.personalDetails}
-                            />
-                        )}
-                    </View>
+                    {this.props.shouldShowBackButton && (
+                        <Tooltip text={this.props.translate('common.back')}>
+                            <Pressable
+                                onPress={() => {
+                                    if (this.props.isKeyboardShown) {
+                                        Keyboard.dismiss();
+                                    }
+                                    this.props.onBackButtonPress();
+                                }}
+                                style={[styles.touchableButtonImage]}
+                            >
+                                <Icon src={Expensicons.BackArrow} />
+                            </Pressable>
+                        </Tooltip>
+                    )}
+                    {this.props.shouldShowAvatarWithDisplay && (
+                        <AvatarWithDisplayName
+                            report={this.props.report}
+                            policies={this.props.policies}
+                            personalDetails={this.props.personalDetails}
+                        />
+                    )}
                     {!this.props.shouldShowAvatarWithDisplay && (
                         <Header
                             title={this.props.title}
                             subtitle={this.props.stepCounter && this.props.shouldShowStepCounter ? this.props.translate('stepCounter', this.props.stepCounter) : this.props.subtitle}
                         />
                     )}
-                    <View style={[styles.reportOptions, styles.flexRow]}>
+                    <View style={[styles.reportOptions, styles.flexRow, styles.pr5]}>
                         {
                             this.props.shouldShowDownloadButton && (
                             <Tooltip text={this.props.translate('common.download')}>