From 8c8065bfaaeb93ce94acd0f518808a644c2b8ec8 Mon Sep 17 00:00:00 2001
From: someone-here <eshgupta1217@gmail.com>
Date: Tue, 13 Jun 2023 17:52:45 +0530
Subject: [PATCH 1/4] Fix conflict

---
 src/pages/DetailsPage.js | 221 +++++++++++++++++++--------------------
 1 file changed, 110 insertions(+), 111 deletions(-)

diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
index 1cb2c0ef76f0..8fd6846c4e54 100755
--- a/src/pages/DetailsPage.js
+++ b/src/pages/DetailsPage.js
@@ -87,126 +87,125 @@ const getPhoneNumber = (details) => {
     return details.login ? Str.removeSMSDomain(details.login) : '';
 };
 
-class DetailsPage extends React.PureComponent {
-    render() {
-        const login = lodashGet(this.props.route.params, 'login', '');
-        let details = lodashGet(this.props.personalDetails, login);
-
-        if (!details) {
-            details = {
-                login,
-                displayName: ReportUtils.getDisplayNameForParticipant(login),
-                avatar: UserUtils.getAvatar(lodashGet(details, 'avatar', ''), login),
-            };
-        }
-
-        const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;
-
-        const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
-        let pronouns = details.pronouns;
-
-        if (pronouns && pronouns.startsWith(CONST.PRONOUNS.PREFIX)) {
-            const localeKey = pronouns.replace(CONST.PRONOUNS.PREFIX, '');
-            pronouns = this.props.translate(`pronouns.${localeKey}`);
-        }
-
-        const phoneNumber = getPhoneNumber(details);
-        const phoneOrEmail = isSMSLogin ? getPhoneNumber(details) : details.login;
-
-        const isCurrentUser = _.keys(this.props.loginList).includes(details.login);
-
-        return (
-            <ScreenWrapper>
-                <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
-                    <HeaderWithBackButton
-                        title={this.props.translate('common.details')}
-                        onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
-                    />
-                    <View
-                        pointerEvents="box-none"
-                        style={[styles.containerWithSpaceBetween]}
-                    >
-                        {details ? (
-                            <ScrollView>
-                                <View style={styles.avatarSectionWrapper}>
-                                    <AttachmentModal
-                                        headerTitle={details.displayName}
-                                        source={UserUtils.getFullSizeAvatar(details.avatar, details.login)}
-                                        isAuthTokenRequired
-                                        originalFileName={details.originalFileName}
+function DetailsPage(props) {
+    const login = lodashGet(props.route.params, 'login', '');
+    let details = lodashGet(props.personalDetails, login);
+
+    if (!details) {
+        details = {
+            login,
+            displayName: ReportUtils.getDisplayNameForParticipant(login),
+            avatar: UserUtils.getAvatar(lodashGet(details, 'avatar', ''), login),
+        };
+    }
+
+    const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;
+
+    const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
+    let pronouns = details.pronouns;
+
+    if (pronouns && pronouns.startsWith(CONST.PRONOUNS.PREFIX)) {
+        const localeKey = pronouns.replace(CONST.PRONOUNS.PREFIX, '');
+        pronouns = props.translate(`pronouns.${localeKey}`);
+    }
+
+    const phoneNumber = getPhoneNumber(details);
+    const phoneOrEmail = isSMSLogin ? getPhoneNumber(details) : details.login;
+
+    const isCurrentUser = _.keys(props.loginList).includes(details.login);
+
+    return (
+        <ScreenWrapper>
+            <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
+                <HeaderWithBackButton
+                    title={props.translate('common.details')}
+                    onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
+                />
+                <View
+                    pointerEvents="box-none"
+                    style={[styles.containerWithSpaceBetween]}
+                >
+                    {details ? (
+                        <ScrollView>
+                            <View style={styles.avatarSectionWrapper}>
+                                <AttachmentModal
+                                    headerTitle={details.displayName}
+                                    source={UserUtils.getFullSizeAvatar(details.avatar, details.login)}
+                                    isAuthTokenRequired
+                                    originalFileName={details.originalFileName}
+                                >
+                                    {({show}) => (
+                                        <PressableWithoutFocus
+                                            style={styles.noOutline}
+                                            onPress={show}
+                                        >
+                                            <OfflineWithFeedback pendingAction={lodashGet(details, 'pendingFields.avatar', null)}>
+                                                <Avatar
+                                                    containerStyles={[styles.avatarLarge, styles.mb3]}
+                                                    imageStyles={[styles.avatarLarge]}
+                                                    source={UserUtils.getAvatar(details.avatar, details.login)}
+                                                    size={CONST.AVATAR_SIZE.LARGE}
+                                                />
+                                            </OfflineWithFeedback>
+                                        </PressableWithoutFocus>
+                                    )}
+                                </AttachmentModal>
+                                {Boolean(details.displayName) && (
+                                    <Text
+                                        style={[styles.textHeadline, styles.mb6, styles.pre]}
+                                        numberOfLines={1}
                                     >
-                                        {({show}) => (
-                                            <PressableWithoutFocus
-                                                style={styles.noOutline}
-                                                onPress={show}
-                                            >
-                                                <OfflineWithFeedback pendingAction={lodashGet(details, 'pendingFields.avatar', null)}>
-                                                    <Avatar
-                                                        containerStyles={[styles.avatarLarge, styles.mb3]}
-                                                        imageStyles={[styles.avatarLarge]}
-                                                        source={UserUtils.getAvatar(details.avatar, details.login)}
-                                                        size={CONST.AVATAR_SIZE.LARGE}
-                                                    />
-                                                </OfflineWithFeedback>
-                                            </PressableWithoutFocus>
-                                        )}
-                                    </AttachmentModal>
-                                    {Boolean(details.displayName) && (
+                                        {details.displayName}
+                                    </Text>
+                                )}
+                                {details.login ? (
+                                    <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
                                         <Text
-                                            style={[styles.textHeadline, styles.mb6, styles.pre]}
+                                            style={[styles.textLabelSupporting, styles.mb1]}
                                             numberOfLines={1}
                                         >
-                                            {details.displayName}
+                                            {props.translate(isSMSLogin ? 'common.phoneNumber' : 'common.email')}
                                         </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={phoneOrEmail}>
-                                                <UserDetailsTooltip accountID={details.accountID}>
-                                                    <Text numberOfLines={1}>{isSMSLogin ? this.props.formatPhoneNumber(phoneNumber) : details.login}</Text>
-                                                </UserDetailsTooltip>
-                                            </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>
-                                {!isCurrentUser && (
-                                    <MenuItem
-                                        title={`${this.props.translate('common.message')}${details.displayName}`}
-                                        icon={Expensicons.ChatBubble}
-                                        onPress={() => Report.navigateToAndOpenReport([details.login])}
-                                        wrapperStyle={styles.breakAll}
-                                        shouldShowRightIcon
-                                    />
-                                )}
-                            </ScrollView>
-                        ) : null}
-                    </View>
-                </FullPageNotFoundView>
-            </ScreenWrapper>
-        );
-    }
+                                        <CommunicationsLink value={phoneOrEmail}>
+                                            <UserDetailsTooltip accountID={details.accountID}>
+                                                <Text numberOfLines={1}>{isSMSLogin ? props.formatPhoneNumber(phoneNumber) : details.login}</Text>
+                                            </UserDetailsTooltip>
+                                        </CommunicationsLink>
+                                    </View>
+                                ) : null}
+                                {pronouns ? (
+                                    <View style={[styles.mb6, styles.detailsPageSectionContainer]}>
+                                        <Text
+                                            style={[styles.textLabelSupporting, styles.mb1]}
+                                            numberOfLines={1}
+                                        >
+                                            {props.translate('profilePage.preferredPronouns')}
+                                        </Text>
+                                        <Text numberOfLines={1}>{pronouns}</Text>
+                                    </View>
+                                ) : null}
+                                {shouldShowLocalTime && <AutoUpdateTime timezone={details.timezone} />}
+                            </View>
+                            {!isCurrentUser && (
+                                <MenuItem
+                                    title={`${props.translate('common.message')}${details.displayName}`}
+                                    icon={Expensicons.ChatBubble}
+                                    onPress={() => Report.navigateToAndOpenReport([details.login])}
+                                    wrapperStyle={styles.breakAll}
+                                    shouldShowRightIcon
+                                />
+                            )}
+                        </ScrollView>
+                    ) : null}
+                </View>
+            </FullPageNotFoundView>
+        </ScreenWrapper>
+    );
 }
 
 DetailsPage.propTypes = propTypes;
 DetailsPage.defaultProps = defaultProps;
+DetailsPage.displayName = 'DetailsPage';
 
 export default compose(
     withLocalize,

From cd913a0c390b81bcadc1acd18c68eb85589e1087 Mon Sep 17 00:00:00 2001
From: someone-here <eshgupta1217@gmail.com>
Date: Tue, 13 Jun 2023 17:57:08 +0530
Subject: [PATCH 2/4] Revert "Fix conflict"

This reverts commit 8c8065bfaaeb93ce94acd0f518808a644c2b8ec8.
---
 src/pages/DetailsPage.js | 221 ++++++++++++++++++++-------------------
 1 file changed, 111 insertions(+), 110 deletions(-)

diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
index 8fd6846c4e54..1cb2c0ef76f0 100755
--- a/src/pages/DetailsPage.js
+++ b/src/pages/DetailsPage.js
@@ -87,125 +87,126 @@ const getPhoneNumber = (details) => {
     return details.login ? Str.removeSMSDomain(details.login) : '';
 };
 
-function DetailsPage(props) {
-    const login = lodashGet(props.route.params, 'login', '');
-    let details = lodashGet(props.personalDetails, login);
-
-    if (!details) {
-        details = {
-            login,
-            displayName: ReportUtils.getDisplayNameForParticipant(login),
-            avatar: UserUtils.getAvatar(lodashGet(details, 'avatar', ''), login),
-        };
-    }
-
-    const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;
-
-    const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
-    let pronouns = details.pronouns;
-
-    if (pronouns && pronouns.startsWith(CONST.PRONOUNS.PREFIX)) {
-        const localeKey = pronouns.replace(CONST.PRONOUNS.PREFIX, '');
-        pronouns = props.translate(`pronouns.${localeKey}`);
-    }
-
-    const phoneNumber = getPhoneNumber(details);
-    const phoneOrEmail = isSMSLogin ? getPhoneNumber(details) : details.login;
-
-    const isCurrentUser = _.keys(props.loginList).includes(details.login);
-
-    return (
-        <ScreenWrapper>
-            <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
-                <HeaderWithBackButton
-                    title={props.translate('common.details')}
-                    onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
-                />
-                <View
-                    pointerEvents="box-none"
-                    style={[styles.containerWithSpaceBetween]}
-                >
-                    {details ? (
-                        <ScrollView>
-                            <View style={styles.avatarSectionWrapper}>
-                                <AttachmentModal
-                                    headerTitle={details.displayName}
-                                    source={UserUtils.getFullSizeAvatar(details.avatar, details.login)}
-                                    isAuthTokenRequired
-                                    originalFileName={details.originalFileName}
-                                >
-                                    {({show}) => (
-                                        <PressableWithoutFocus
-                                            style={styles.noOutline}
-                                            onPress={show}
-                                        >
-                                            <OfflineWithFeedback pendingAction={lodashGet(details, 'pendingFields.avatar', null)}>
-                                                <Avatar
-                                                    containerStyles={[styles.avatarLarge, styles.mb3]}
-                                                    imageStyles={[styles.avatarLarge]}
-                                                    source={UserUtils.getAvatar(details.avatar, details.login)}
-                                                    size={CONST.AVATAR_SIZE.LARGE}
-                                                />
-                                            </OfflineWithFeedback>
-                                        </PressableWithoutFocus>
-                                    )}
-                                </AttachmentModal>
-                                {Boolean(details.displayName) && (
-                                    <Text
-                                        style={[styles.textHeadline, styles.mb6, styles.pre]}
-                                        numberOfLines={1}
+class DetailsPage extends React.PureComponent {
+    render() {
+        const login = lodashGet(this.props.route.params, 'login', '');
+        let details = lodashGet(this.props.personalDetails, login);
+
+        if (!details) {
+            details = {
+                login,
+                displayName: ReportUtils.getDisplayNameForParticipant(login),
+                avatar: UserUtils.getAvatar(lodashGet(details, 'avatar', ''), login),
+            };
+        }
+
+        const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;
+
+        const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
+        let pronouns = details.pronouns;
+
+        if (pronouns && pronouns.startsWith(CONST.PRONOUNS.PREFIX)) {
+            const localeKey = pronouns.replace(CONST.PRONOUNS.PREFIX, '');
+            pronouns = this.props.translate(`pronouns.${localeKey}`);
+        }
+
+        const phoneNumber = getPhoneNumber(details);
+        const phoneOrEmail = isSMSLogin ? getPhoneNumber(details) : details.login;
+
+        const isCurrentUser = _.keys(this.props.loginList).includes(details.login);
+
+        return (
+            <ScreenWrapper>
+                <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
+                    <HeaderWithBackButton
+                        title={this.props.translate('common.details')}
+                        onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
+                    />
+                    <View
+                        pointerEvents="box-none"
+                        style={[styles.containerWithSpaceBetween]}
+                    >
+                        {details ? (
+                            <ScrollView>
+                                <View style={styles.avatarSectionWrapper}>
+                                    <AttachmentModal
+                                        headerTitle={details.displayName}
+                                        source={UserUtils.getFullSizeAvatar(details.avatar, details.login)}
+                                        isAuthTokenRequired
+                                        originalFileName={details.originalFileName}
                                     >
-                                        {details.displayName}
-                                    </Text>
-                                )}
-                                {details.login ? (
-                                    <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
-                                        <Text
-                                            style={[styles.textLabelSupporting, styles.mb1]}
-                                            numberOfLines={1}
-                                        >
-                                            {props.translate(isSMSLogin ? 'common.phoneNumber' : 'common.email')}
-                                        </Text>
-                                        <CommunicationsLink value={phoneOrEmail}>
-                                            <UserDetailsTooltip accountID={details.accountID}>
-                                                <Text numberOfLines={1}>{isSMSLogin ? props.formatPhoneNumber(phoneNumber) : details.login}</Text>
-                                            </UserDetailsTooltip>
-                                        </CommunicationsLink>
-                                    </View>
-                                ) : null}
-                                {pronouns ? (
-                                    <View style={[styles.mb6, styles.detailsPageSectionContainer]}>
+                                        {({show}) => (
+                                            <PressableWithoutFocus
+                                                style={styles.noOutline}
+                                                onPress={show}
+                                            >
+                                                <OfflineWithFeedback pendingAction={lodashGet(details, 'pendingFields.avatar', null)}>
+                                                    <Avatar
+                                                        containerStyles={[styles.avatarLarge, styles.mb3]}
+                                                        imageStyles={[styles.avatarLarge]}
+                                                        source={UserUtils.getAvatar(details.avatar, details.login)}
+                                                        size={CONST.AVATAR_SIZE.LARGE}
+                                                    />
+                                                </OfflineWithFeedback>
+                                            </PressableWithoutFocus>
+                                        )}
+                                    </AttachmentModal>
+                                    {Boolean(details.displayName) && (
                                         <Text
-                                            style={[styles.textLabelSupporting, styles.mb1]}
+                                            style={[styles.textHeadline, styles.mb6, styles.pre]}
                                             numberOfLines={1}
                                         >
-                                            {props.translate('profilePage.preferredPronouns')}
+                                            {details.displayName}
                                         </Text>
-                                        <Text numberOfLines={1}>{pronouns}</Text>
-                                    </View>
-                                ) : null}
-                                {shouldShowLocalTime && <AutoUpdateTime timezone={details.timezone} />}
-                            </View>
-                            {!isCurrentUser && (
-                                <MenuItem
-                                    title={`${props.translate('common.message')}${details.displayName}`}
-                                    icon={Expensicons.ChatBubble}
-                                    onPress={() => Report.navigateToAndOpenReport([details.login])}
-                                    wrapperStyle={styles.breakAll}
-                                    shouldShowRightIcon
-                                />
-                            )}
-                        </ScrollView>
-                    ) : null}
-                </View>
-            </FullPageNotFoundView>
-        </ScreenWrapper>
-    );
+                                    )}
+                                    {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={phoneOrEmail}>
+                                                <UserDetailsTooltip accountID={details.accountID}>
+                                                    <Text numberOfLines={1}>{isSMSLogin ? this.props.formatPhoneNumber(phoneNumber) : details.login}</Text>
+                                                </UserDetailsTooltip>
+                                            </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>
+                                {!isCurrentUser && (
+                                    <MenuItem
+                                        title={`${this.props.translate('common.message')}${details.displayName}`}
+                                        icon={Expensicons.ChatBubble}
+                                        onPress={() => Report.navigateToAndOpenReport([details.login])}
+                                        wrapperStyle={styles.breakAll}
+                                        shouldShowRightIcon
+                                    />
+                                )}
+                            </ScrollView>
+                        ) : null}
+                    </View>
+                </FullPageNotFoundView>
+            </ScreenWrapper>
+        );
+    }
 }
 
 DetailsPage.propTypes = propTypes;
 DetailsPage.defaultProps = defaultProps;
-DetailsPage.displayName = 'DetailsPage';
 
 export default compose(
     withLocalize,

From c48da1e2b62045033cf1e27b6b1c7ec74d9e8616 Mon Sep 17 00:00:00 2001
From: someone-here <eshgupta1217@gmail.com>
Date: Tue, 13 Jun 2023 18:52:14 +0530
Subject: [PATCH 3/4] Migrate DetailsPage to Function component

---
 src/pages/DetailsPage.js | 221 +++++++++++++++++++--------------------
 1 file changed, 110 insertions(+), 111 deletions(-)

diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
index 1cb2c0ef76f0..8fd6846c4e54 100755
--- a/src/pages/DetailsPage.js
+++ b/src/pages/DetailsPage.js
@@ -87,126 +87,125 @@ const getPhoneNumber = (details) => {
     return details.login ? Str.removeSMSDomain(details.login) : '';
 };
 
-class DetailsPage extends React.PureComponent {
-    render() {
-        const login = lodashGet(this.props.route.params, 'login', '');
-        let details = lodashGet(this.props.personalDetails, login);
-
-        if (!details) {
-            details = {
-                login,
-                displayName: ReportUtils.getDisplayNameForParticipant(login),
-                avatar: UserUtils.getAvatar(lodashGet(details, 'avatar', ''), login),
-            };
-        }
-
-        const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;
-
-        const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
-        let pronouns = details.pronouns;
-
-        if (pronouns && pronouns.startsWith(CONST.PRONOUNS.PREFIX)) {
-            const localeKey = pronouns.replace(CONST.PRONOUNS.PREFIX, '');
-            pronouns = this.props.translate(`pronouns.${localeKey}`);
-        }
-
-        const phoneNumber = getPhoneNumber(details);
-        const phoneOrEmail = isSMSLogin ? getPhoneNumber(details) : details.login;
-
-        const isCurrentUser = _.keys(this.props.loginList).includes(details.login);
-
-        return (
-            <ScreenWrapper>
-                <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
-                    <HeaderWithBackButton
-                        title={this.props.translate('common.details')}
-                        onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
-                    />
-                    <View
-                        pointerEvents="box-none"
-                        style={[styles.containerWithSpaceBetween]}
-                    >
-                        {details ? (
-                            <ScrollView>
-                                <View style={styles.avatarSectionWrapper}>
-                                    <AttachmentModal
-                                        headerTitle={details.displayName}
-                                        source={UserUtils.getFullSizeAvatar(details.avatar, details.login)}
-                                        isAuthTokenRequired
-                                        originalFileName={details.originalFileName}
+function DetailsPage(props) {
+    const login = lodashGet(props.route.params, 'login', '');
+    let details = lodashGet(props.personalDetails, login);
+
+    if (!details) {
+        details = {
+            login,
+            displayName: ReportUtils.getDisplayNameForParticipant(login),
+            avatar: UserUtils.getAvatar(lodashGet(details, 'avatar', ''), login),
+        };
+    }
+
+    const isSMSLogin = details.login ? Str.isSMSLogin(details.login) : false;
+
+    const shouldShowLocalTime = !ReportUtils.hasAutomatedExpensifyEmails([details.login]) && details.timezone;
+    let pronouns = details.pronouns;
+
+    if (pronouns && pronouns.startsWith(CONST.PRONOUNS.PREFIX)) {
+        const localeKey = pronouns.replace(CONST.PRONOUNS.PREFIX, '');
+        pronouns = props.translate(`pronouns.${localeKey}`);
+    }
+
+    const phoneNumber = getPhoneNumber(details);
+    const phoneOrEmail = isSMSLogin ? getPhoneNumber(details) : details.login;
+
+    const isCurrentUser = _.keys(props.loginList).includes(details.login);
+
+    return (
+        <ScreenWrapper>
+            <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
+                <HeaderWithBackButton
+                    title={props.translate('common.details')}
+                    onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
+                />
+                <View
+                    pointerEvents="box-none"
+                    style={[styles.containerWithSpaceBetween]}
+                >
+                    {details ? (
+                        <ScrollView>
+                            <View style={styles.avatarSectionWrapper}>
+                                <AttachmentModal
+                                    headerTitle={details.displayName}
+                                    source={UserUtils.getFullSizeAvatar(details.avatar, details.login)}
+                                    isAuthTokenRequired
+                                    originalFileName={details.originalFileName}
+                                >
+                                    {({show}) => (
+                                        <PressableWithoutFocus
+                                            style={styles.noOutline}
+                                            onPress={show}
+                                        >
+                                            <OfflineWithFeedback pendingAction={lodashGet(details, 'pendingFields.avatar', null)}>
+                                                <Avatar
+                                                    containerStyles={[styles.avatarLarge, styles.mb3]}
+                                                    imageStyles={[styles.avatarLarge]}
+                                                    source={UserUtils.getAvatar(details.avatar, details.login)}
+                                                    size={CONST.AVATAR_SIZE.LARGE}
+                                                />
+                                            </OfflineWithFeedback>
+                                        </PressableWithoutFocus>
+                                    )}
+                                </AttachmentModal>
+                                {Boolean(details.displayName) && (
+                                    <Text
+                                        style={[styles.textHeadline, styles.mb6, styles.pre]}
+                                        numberOfLines={1}
                                     >
-                                        {({show}) => (
-                                            <PressableWithoutFocus
-                                                style={styles.noOutline}
-                                                onPress={show}
-                                            >
-                                                <OfflineWithFeedback pendingAction={lodashGet(details, 'pendingFields.avatar', null)}>
-                                                    <Avatar
-                                                        containerStyles={[styles.avatarLarge, styles.mb3]}
-                                                        imageStyles={[styles.avatarLarge]}
-                                                        source={UserUtils.getAvatar(details.avatar, details.login)}
-                                                        size={CONST.AVATAR_SIZE.LARGE}
-                                                    />
-                                                </OfflineWithFeedback>
-                                            </PressableWithoutFocus>
-                                        )}
-                                    </AttachmentModal>
-                                    {Boolean(details.displayName) && (
+                                        {details.displayName}
+                                    </Text>
+                                )}
+                                {details.login ? (
+                                    <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
                                         <Text
-                                            style={[styles.textHeadline, styles.mb6, styles.pre]}
+                                            style={[styles.textLabelSupporting, styles.mb1]}
                                             numberOfLines={1}
                                         >
-                                            {details.displayName}
+                                            {props.translate(isSMSLogin ? 'common.phoneNumber' : 'common.email')}
                                         </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={phoneOrEmail}>
-                                                <UserDetailsTooltip accountID={details.accountID}>
-                                                    <Text numberOfLines={1}>{isSMSLogin ? this.props.formatPhoneNumber(phoneNumber) : details.login}</Text>
-                                                </UserDetailsTooltip>
-                                            </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>
-                                {!isCurrentUser && (
-                                    <MenuItem
-                                        title={`${this.props.translate('common.message')}${details.displayName}`}
-                                        icon={Expensicons.ChatBubble}
-                                        onPress={() => Report.navigateToAndOpenReport([details.login])}
-                                        wrapperStyle={styles.breakAll}
-                                        shouldShowRightIcon
-                                    />
-                                )}
-                            </ScrollView>
-                        ) : null}
-                    </View>
-                </FullPageNotFoundView>
-            </ScreenWrapper>
-        );
-    }
+                                        <CommunicationsLink value={phoneOrEmail}>
+                                            <UserDetailsTooltip accountID={details.accountID}>
+                                                <Text numberOfLines={1}>{isSMSLogin ? props.formatPhoneNumber(phoneNumber) : details.login}</Text>
+                                            </UserDetailsTooltip>
+                                        </CommunicationsLink>
+                                    </View>
+                                ) : null}
+                                {pronouns ? (
+                                    <View style={[styles.mb6, styles.detailsPageSectionContainer]}>
+                                        <Text
+                                            style={[styles.textLabelSupporting, styles.mb1]}
+                                            numberOfLines={1}
+                                        >
+                                            {props.translate('profilePage.preferredPronouns')}
+                                        </Text>
+                                        <Text numberOfLines={1}>{pronouns}</Text>
+                                    </View>
+                                ) : null}
+                                {shouldShowLocalTime && <AutoUpdateTime timezone={details.timezone} />}
+                            </View>
+                            {!isCurrentUser && (
+                                <MenuItem
+                                    title={`${props.translate('common.message')}${details.displayName}`}
+                                    icon={Expensicons.ChatBubble}
+                                    onPress={() => Report.navigateToAndOpenReport([details.login])}
+                                    wrapperStyle={styles.breakAll}
+                                    shouldShowRightIcon
+                                />
+                            )}
+                        </ScrollView>
+                    ) : null}
+                </View>
+            </FullPageNotFoundView>
+        </ScreenWrapper>
+    );
 }
 
 DetailsPage.propTypes = propTypes;
 DetailsPage.defaultProps = defaultProps;
+DetailsPage.displayName = 'DetailsPage';
 
 export default compose(
     withLocalize,

From ae6753871bd2be9dcc536829ed023d5ee333d078 Mon Sep 17 00:00:00 2001
From: someone-here <eshgupta1217@gmail.com>
Date: Thu, 15 Jun 2023 23:15:17 +0530
Subject: [PATCH 4/4] Fix conflict

---
 src/pages/DetailsPage.js | 14 +++++++-------
 1 file changed, 7 insertions(+), 7 deletions(-)

diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
index 0a9bda91bd71..2b5be4121760 100755
--- a/src/pages/DetailsPage.js
+++ b/src/pages/DetailsPage.js
@@ -88,8 +88,8 @@ const getPhoneNumber = (details) => {
 };
 
 function DetailsPage(props) {
-    const login = lodashGet(this.props.route.params, 'login', '');
-    let details = _.find(this.props.personalDetails, (detail) => detail.login === login.toLowerCase());
+    const login = lodashGet(props.route.params, 'login', '');
+    let details = _.find(props.personalDetails, (detail) => detail.login === login.toLowerCase());
 
     if (!details) {
         // TODO: these personal details aren't in my local test account but are in
@@ -130,7 +130,7 @@ function DetailsPage(props) {
         <ScreenWrapper>
             <FullPageNotFoundView shouldShow={_.isEmpty(login)}>
                 <HeaderWithBackButton
-                    title={this.props.translate('common.details')}
+                    title={props.translate('common.details')}
                     onBackButtonPress={() => Navigation.goBack(ROUTES.HOME)}
                 />
                 <View
@@ -176,11 +176,11 @@ function DetailsPage(props) {
                                             style={[styles.textLabelSupporting, styles.mb1]}
                                             numberOfLines={1}
                                         >
-                                            {this.props.translate(isSMSLogin ? 'common.phoneNumber' : 'common.email')}
+                                            {props.translate(isSMSLogin ? 'common.phoneNumber' : 'common.email')}
                                         </Text>
                                         <CommunicationsLink value={phoneOrEmail}>
                                             <UserDetailsTooltip accountID={details.accountID}>
-                                                <Text numberOfLines={1}>{isSMSLogin ? this.props.formatPhoneNumber(phoneNumber) : details.login}</Text>
+                                                <Text numberOfLines={1}>{isSMSLogin ? props.formatPhoneNumber(phoneNumber) : details.login}</Text>
                                             </UserDetailsTooltip>
                                         </CommunicationsLink>
                                     </View>
@@ -191,7 +191,7 @@ function DetailsPage(props) {
                                             style={[styles.textLabelSupporting, styles.mb1]}
                                             numberOfLines={1}
                                         >
-                                            {this.props.translate('profilePage.preferredPronouns')}
+                                            {props.translate('profilePage.preferredPronouns')}
                                         </Text>
                                         <Text numberOfLines={1}>{pronouns}</Text>
                                     </View>
@@ -200,7 +200,7 @@ function DetailsPage(props) {
                             </View>
                             {!isCurrentUser && (
                                 <MenuItem
-                                    title={`${this.props.translate('common.message')}${details.displayName}`}
+                                    title={`${props.translate('common.message')}${details.displayName}`}
                                     icon={Expensicons.ChatBubble}
                                     onPress={() => Report.navigateToAndOpenReport([login])}
                                     wrapperStyle={styles.breakAll}