Skip to content

Commit

Permalink
fix details page crash without route params
Browse files Browse the repository at this point in the history
  • Loading branch information
@bernhardoj
bernhardoj committed Mar 23, 2023
1 parent f79a0ba commit 6ccfc4b
Showing 1 changed file with 89 additions and 94 deletions.
183 changes: 89 additions & 94 deletions src/pages/DetailsPage.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,7 @@ import PressableWithoutFocus from '../components/PressableWithoutFocus';
import * as Report from '../libs/actions/Report';
import OfflineWithFeedback from '../components/OfflineWithFeedback';
import AutoUpdateTime from '../components/AutoUpdateTime';
import FullPageNotFoundView from '../components/BlockingViews/FullPageNotFoundView';

const matchType = PropTypes.shape({
params: PropTypes.shape({
Expand Down Expand Up @@ -72,20 +73,12 @@ const getPhoneNumber = (details) => {
};

class DetailsPage extends React.PureComponent {
componentDidMount() {
if (lodashGet(this.props.route.params, 'login')) {
return;
}

// Leave the page when the login information is not available
Navigation.dismissModal();
}

render() {
let details = lodashGet(this.props.personalDetails, lodashGet(this.props.route.params, 'login'));
const login = lodashGet(this.props.route.params, 'login', '');
const reportID = lodashGet(this.props.route.params, 'reportID', '');
let details = lodashGet(this.props.personalDetails, login);

if (!details) {
const login = lodashGet(this.props.route.params, 'login');
details = {
login,
displayName: ReportUtils.getDisplayNameForParticipant(login),
Expand All @@ -97,7 +90,7 @@ class DetailsPage extends React.PureComponent {

// If we have a reportID param this means that we
// arrived here via the ParticipantsPage and should be allowed to navigate back to it
const shouldShowBackButton = Boolean(this.props.route.params.reportID);
const shouldShowBackButton = Boolean(reportID);
const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
let pronouns = details.pronouns;

Expand All @@ -108,91 +101,93 @@ class DetailsPage extends React.PureComponent {

return (
<ScreenWrapper>
<HeaderWithCloseButton
title={this.props.translate('common.details')}
shouldShowBackButton={shouldShowBackButton}
onBackButtonPress={() => Navigation.goBack()}
onCloseButtonPress={() => Navigation.dismissModal()}
/>
<View
pointerEvents="box-none"
style={[
styles.containerWithSpaceBetween,
]}
>
{details ? (
<ScrollView>
<View style={styles.avatarSectionWrapper}>
<AttachmentModal
headerTitle={isSMSLogin ? this.props.toLocalPhone(details.displayName) : details.displayName}
source={ReportUtils.getFullSizeAvatar(details.avatar, details.login)}
isAuthTokenRequired
>
{({show}) => (
<PressableWithoutFocus
style={styles.noOutline}
onPress={show}
>
<OfflineWithFeedback
pendingAction={lodashGet(details, 'pendingFields.avatar', null)}
<FullPageNotFoundView shouldShow={!Boolean(login)}>
<HeaderWithCloseButton
title={this.props.translate('common.details')}
shouldShowBackButton={shouldShowBackButton}
onBackButtonPress={() => Navigation.goBack()}
onCloseButtonPress={() => Navigation.dismissModal()}
/>
<View
pointerEvents="box-none"
style={[
styles.containerWithSpaceBetween,
]}
>
{details ? (
<ScrollView>
<View style={styles.avatarSectionWrapper}>
<AttachmentModal
headerTitle={isSMSLogin ? this.props.toLocalPhone(details.displayName) : details.displayName}
source={ReportUtils.getFullSizeAvatar(details.avatar, details.login)}
isAuthTokenRequired
>
{({show}) => (
<PressableWithoutFocus
style={styles.noOutline}
onPress={show}
>
<Avatar
containerStyles={[styles.avatarLarge, styles.mb3]}
imageStyles={[styles.avatarLarge]}
source={ReportUtils.getAvatar(details.avatar, details.login)}
size={CONST.AVATAR_SIZE.LARGE}
/>
</OfflineWithFeedback>
</PressableWithoutFocus>
<OfflineWithFeedback
pendingAction={lodashGet(details, 'pendingFields.avatar', null)}
>
<Avatar
containerStyles={[styles.avatarLarge, styles.mb3]}
imageStyles={[styles.avatarLarge]}
source={ReportUtils.getAvatar(details.avatar, details.login)}
size={CONST.AVATAR_SIZE.LARGE}
/>
</OfflineWithFeedback>
</PressableWithoutFocus>
)}
</AttachmentModal>
{details.displayName && (
<Text style={[styles.textHeadline, styles.mb6, styles.pre]} numberOfLines={1}>
{isSMSLogin ? this.props.toLocalPhone(details.displayName) : details.displayName}
</Text>
)}
</AttachmentModal>
{details.displayName && (
<Text style={[styles.textHeadline, styles.mb6, styles.pre]} numberOfLines={1}>
{isSMSLogin ? this.props.toLocalPhone(details.displayName) : details.displayName}
</Text>
{details.login ? (
<View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
<Text style={[styles.textLabelSupporting, styles.mb1]} numberOfLines={1}>
{this.props.translate(isSMSLogin
? 'common.phoneNumber'
: 'common.email')}
</Text>
<CommunicationsLink value={isSMSLogin ? getPhoneNumber(details) : details.login}>
<Tooltip text={isSMSLogin ? getPhoneNumber(details) : details.login}>
<Text numberOfLines={1}>
{isSMSLogin
? this.props.toLocalPhone(getPhoneNumber(details))
: details.login}
</Text>
</Tooltip>
</CommunicationsLink>
</View>
) : null}
{pronouns ? (
<View style={[styles.mb6, styles.detailsPageSectionContainer]}>
<Text style={[styles.textLabelSupporting, styles.mb1]} numberOfLines={1}>
{this.props.translate('profilePage.preferredPronouns')}
</Text>
<Text numberOfLines={1}>
{pronouns}
</Text>
</View>
) : null}
{shouldShowLocalTime && <AutoUpdateTime timezone={details.timezone} />}
</View>
{details.login !== this.props.session.email && (
<MenuItem
title={`${this.props.translate('common.message')}${details.displayName}`}
icon={Expensicons.ChatBubble}
onPress={() => Report.navigateToAndOpenReport([details.login])}
wrapperStyle={styles.breakAll}
shouldShowRightIcon
/>
)}
{details.login ? (
<View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
<Text style={[styles.textLabelSupporting, styles.mb1]} numberOfLines={1}>
{this.props.translate(isSMSLogin
? 'common.phoneNumber'
: 'common.email')}
</Text>
<CommunicationsLink value={isSMSLogin ? getPhoneNumber(details) : details.login}>
<Tooltip text={isSMSLogin ? getPhoneNumber(details) : details.login}>
<Text numberOfLines={1}>
{isSMSLogin
? this.props.toLocalPhone(getPhoneNumber(details))
: details.login}
</Text>
</Tooltip>
</CommunicationsLink>
</View>
) : null}
{pronouns ? (
<View style={[styles.mb6, styles.detailsPageSectionContainer]}>
<Text style={[styles.textLabelSupporting, styles.mb1]} numberOfLines={1}>
{this.props.translate('profilePage.preferredPronouns')}
</Text>
<Text numberOfLines={1}>
{pronouns}
</Text>
</View>
) : null}
{shouldShowLocalTime && <AutoUpdateTime timezone={details.timezone} />}
</View>
{details.login !== this.props.session.email && (
<MenuItem
title={`${this.props.translate('common.message')}${details.displayName}`}
icon={Expensicons.ChatBubble}
onPress={() => Report.navigateToAndOpenReport([details.login])}
wrapperStyle={styles.breakAll}
shouldShowRightIcon
/>
)}
</ScrollView>
) : null}
</View>
</ScrollView>
) : null}
</View>
</FullPageNotFoundView>
</ScreenWrapper>
);
}
Expand Down

0 comments on commit 6ccfc4b

Please sign in to comment.