Merge pull request #4154 from Expensify/cmartins-email-copy

Fix copy to clipboard in long emails
Expensify · Jul 26, 2021 · c52f9f5 · c52f9f5
2 parents 48bf2f5 + e5974e6
commit c52f9f5
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 28 deletions.
diff --git a/src/components/CommunicationsLink.js b/src/components/CommunicationsLink.js
@@ -44,16 +44,15 @@ const CommunicationsLink = props => (
                 >
                     {props.children}
                 </Pressable>
-            )
-            : props.children}
-        {!props.isSmallScreenWidth
-            && (
+            ) : (
                 <View style={[
-                    styles.pAbsolute,
+                    styles.flexRow,
                     styles.alignItemsCenter,
-                    styles.justifyContentCenter,
-                    styles.communicationsLinkIcon]}
+                    styles.w100,
+                    styles.communicationsLinkHeight,
+                ]}
                 >
+                    {props.children}
                     <ContextMenuItem
                         icon={ClipboardIcon}
                         text={props.translate('contextMenuItem.copyToClipboard')}

diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
@@ -92,24 +92,13 @@ const DetailsPage = ({
                                 imageStyles={[styles.avatarLarge]}
                                 source={details.avatar}
                             />
-                            {details.displayName && isSMSLogin
-                                ? (
-                                    <CommunicationsLink
-                                        style={[styles.mt1, styles.mb6]}
-                                        type={CONST.LOGIN_TYPE.PHONE}
-                                        value={getPhoneNumber(details)}
-                                    >
-                                        <Text style={[styles.displayName]} numberOfLines={1}>
-                                            {toLocalPhone(details.displayName)}
-                                        </Text>
-                                    </CommunicationsLink>
-                                ) : (
-                                    <Text style={[styles.displayName]} numberOfLines={1}>
-                                        {details.displayName || null}
-                                    </Text>
-                                )}
+                            {details.displayName && (
+                                <Text style={[styles.displayName, styles.mb6]} numberOfLines={1}>
+                                    {isSMSLogin ? toLocalPhone(details.displayName) : details.displayName}
+                                </Text>
+                            )}
                             {details.login ? (
-                                <View style={[styles.mb6, styles.detailsPageSectionContainer]}>
+                                <View style={[styles.mb6, styles.detailsPageSectionContainer, styles.w100]}>
                                     <Text style={[styles.formLabel, styles.mb2]} numberOfLines={1}>
                                         {translate(isSMSLogin
                                             ? 'common.phoneNumber'

diff --git a/src/styles/styles.js b/src/styles/styles.js
@@ -1798,10 +1798,8 @@ const styles = {
         ...whiteSpace.noWrap,
     },
 
-    communicationsLinkIcon: {
-        right: -36,
-        top: 0,
-        bottom: 0,
+    communicationsLinkHeight: {
+        height: 20,
     },
 };