From fd1b6e9b7bc7fa348c6fe83e6e46542a102ab907 Mon Sep 17 00:00:00 2001 From: Yuwen Memon Date: Thu, 4 May 2023 22:22:27 -0700 Subject: [PATCH 1/4] Fix padding on Avatar with display --- src/components/AvatarWithDisplayName.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/AvatarWithDisplayName.js b/src/components/AvatarWithDisplayName.js index 9fcde2ab8518..dfee2ca605b9 100644 --- a/src/components/AvatarWithDisplayName.js +++ b/src/components/AvatarWithDisplayName.js @@ -78,7 +78,7 @@ const AvatarWithDisplayName = (props) => { containerStyles={props.size === CONST.AVATAR_SIZE.SMALL ? styles.emptyAvatarSmall : styles.emptyAvatar} /> )} - + Date: Thu, 4 May 2023 22:24:14 -0700 Subject: [PATCH 2/4] Fix avatar with display name not showing on mobile native --- src/components/HeaderWithCloseButton.js | 46 +++++++++++++------------ 1 file changed, 24 insertions(+), 22 deletions(-) diff --git a/src/components/HeaderWithCloseButton.js b/src/components/HeaderWithCloseButton.js index f47874411f24..6b012a3ee021 100755 --- a/src/components/HeaderWithCloseButton.js +++ b/src/components/HeaderWithCloseButton.js @@ -165,28 +165,30 @@ class HeaderWithCloseButton extends Component { styles.overflowHidden, ]} > - {this.props.shouldShowBackButton && ( - - { - if (this.props.isKeyboardShown) { - Keyboard.dismiss(); - } - this.props.onBackButtonPress(); - }} - style={[styles.touchableButtonImage]} - > - - - - )} - {this.props.shouldShowAvatarWithDisplay && ( - - )} + + {this.props.shouldShowBackButton && ( + + { + if (this.props.isKeyboardShown) { + Keyboard.dismiss(); + } + this.props.onBackButtonPress(); + }} + style={[styles.touchableButtonImage]} + > + + + + )} + {this.props.shouldShowAvatarWithDisplay && ( + + )} + {!this.props.shouldShowAvatarWithDisplay && (
Date: Fri, 5 May 2023 13:22:18 -0700 Subject: [PATCH 3/4] Fix up styles --- src/components/AvatarWithDisplayName.js | 96 ++++++++++++------------- src/components/HeaderWithCloseButton.js | 46 ++++++------ 2 files changed, 69 insertions(+), 73 deletions(-) diff --git a/src/components/AvatarWithDisplayName.js b/src/components/AvatarWithDisplayName.js index dfee2ca605b9..cb56b27b482d 100644 --- a/src/components/AvatarWithDisplayName.js +++ b/src/components/AvatarWithDisplayName.js @@ -51,59 +51,57 @@ const AvatarWithDisplayName = (props) => { const ownerPersonalDetails = OptionsListUtils.getPersonalDetailsForLogins([props.report.ownerEmail], props.personalDetails); const displayNamesWithTooltips = ReportUtils.getDisplayNamesWithTooltips(ownerPersonalDetails, false); return ( - - - {Boolean(props.report && title) && ( - + {Boolean(props.report && title) && ( + + {isExpenseReport ? ( + + ) : ( + + )} + + + {!_.isEmpty(subtitle) && ( + - {isExpenseReport ? ( - - ) : ( - - )} - - - {!_.isEmpty(subtitle) && ( - - {subtitle} - - )} - - - )} + {subtitle} + + )} + + )} ); }; diff --git a/src/components/HeaderWithCloseButton.js b/src/components/HeaderWithCloseButton.js index 6b012a3ee021..0ec4726558f1 100755 --- a/src/components/HeaderWithCloseButton.js +++ b/src/components/HeaderWithCloseButton.js @@ -165,30 +165,28 @@ class HeaderWithCloseButton extends Component { styles.overflowHidden, ]} > - - {this.props.shouldShowBackButton && ( - - { - if (this.props.isKeyboardShown) { - Keyboard.dismiss(); - } - this.props.onBackButtonPress(); - }} - style={[styles.touchableButtonImage]} - > - - - - )} - {this.props.shouldShowAvatarWithDisplay && ( - - )} - + {this.props.shouldShowBackButton && ( + + { + if (this.props.isKeyboardShown) { + Keyboard.dismiss(); + } + this.props.onBackButtonPress(); + }} + style={[styles.touchableButtonImage]} + > + + + + )} + {this.props.shouldShowAvatarWithDisplay && ( + + )} {!this.props.shouldShowAvatarWithDisplay && (
Date: Fri, 5 May 2023 13:53:25 -0700 Subject: [PATCH 4/4] Get rid of container styles --- src/components/HeaderWithCloseButton.js | 17 ++++++----------- src/components/MoneyRequestHeader.js | 1 - 2 files changed, 6 insertions(+), 12 deletions(-) diff --git a/src/components/HeaderWithCloseButton.js b/src/components/HeaderWithCloseButton.js index 0ec4726558f1..8bfe6c582c7d 100755 --- a/src/components/HeaderWithCloseButton.js +++ b/src/components/HeaderWithCloseButton.js @@ -96,10 +96,6 @@ const propTypes = { /** Policies, if we're showing the details for a report and need participant details for AvatarWithDisplay */ personalDetails: PropTypes.objectOf(participantPropTypes), - /** Additional styles to render on the container of this component */ - // eslint-disable-next-line react/forbid-prop-types - containerStyles: PropTypes.arrayOf(PropTypes.object), - ...withLocalizePropTypes, ...withDelayToggleButtonStatePropTypes, ...keyboardStatePropTypes, @@ -130,7 +126,6 @@ const defaultProps = { top: 0, left: 0, }, - containerStyles: [], }; class HeaderWithCloseButton extends Component { @@ -155,7 +150,7 @@ class HeaderWithCloseButton extends Component { render() { return ( - + )} {this.props.shouldShowAvatarWithDisplay && ( - + )} {!this.props.shouldShowAvatarWithDisplay && (
{ report={props.report} policies={props.policies} personalDetails={props.personalDetails} - containerStyles={[styles.pt5, styles.pb3, styles.pr1]} shouldShowCloseButton={false} shouldShowBackButton={props.isSmallScreenWidth} onBackButtonPress={() => Navigation.navigate(ROUTES.HOME)}