diff --git a/src/components/AttachmentModal.js b/src/components/AttachmentModal.js
index 2568e634e884..1d942eaf51f4 100755
--- a/src/components/AttachmentModal.js
+++ b/src/components/AttachmentModal.js
@@ -25,9 +25,6 @@ import TextWithEllipsis from './TextWithEllipsis';
  */
 
 const propTypes = {
-    /** Determines title of the modal header depending on if we are uploading an attachment or not */
-    isUploadingAttachment: PropTypes.bool,
-
     /** Optional source URL for the image shown. If not passed in via props must be specified when modal is opened. */
     sourceURL: PropTypes.string,
 
@@ -46,17 +43,24 @@ const propTypes = {
     /** Do the urls require an authToken? */
     isAuthTokenRequired: PropTypes.bool,
 
+    /** Determines if download Button should be shown or not */
+    allowDownload: PropTypes.bool,
+
+    /** Title shown in the header of the modal */
+    headerTitle: PropTypes.string,
+
     ...withLocalizePropTypes,
 
     ...windowDimensionsPropTypes,
 };
 
 const defaultProps = {
-    isUploadingAttachment: false,
     sourceURL: null,
     onConfirm: null,
     originalFileName: null,
     isAuthTokenRequired: false,
+    allowDownload: false,
+    headerTitle: null,
     onModalHide: () => {},
 };
 
@@ -145,6 +149,7 @@ class AttachmentModal extends PureComponent {
             : [styles.imageModalImageCenterContainer, styles.p5];
 
         const {fileName, fileExtension} = this.splitExtensionFromFileName();
+
         return (
             <>
                 <Modal
@@ -157,21 +162,19 @@ class AttachmentModal extends PureComponent {
                     propagateSwipe
                 >
                     <HeaderWithCloseButton
-                        title={this.props.isUploadingAttachment
-                            ? this.props.translate('reportActionCompose.sendAttachment')
-                            : this.props.translate('common.attachment')}
+                        title={this.props.headerTitle || this.props.translate('common.attachment')}
                         shouldShowBorderBottom
-                        shouldShowDownloadButton={!this.props.isUploadingAttachment}
+                        shouldShowDownloadButton={this.props.allowDownload}
                         onDownloadButtonPress={() => fileDownload(sourceURL, this.props.originalFileName)}
                         onCloseButtonPress={() => this.setState({isModalOpen: false})}
-                        subtitle={(
+                        subtitle={fileName ? (
                             <TextWithEllipsis
                                 leadingText={fileName}
                                 trailingText={fileExtension ? `.${fileExtension}` : ''}
                                 wrapperStyle={[styles.w100]}
                                 textStyle={styles.mutedTextLabel}
                             />
-                        )}
+                        ) : ''}
                     />
                     <View style={attachmentViewStyles}>
                         {this.state.sourceURL && (
diff --git a/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js b/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js
index 49e2e72829d4..96fd95cc5224 100644
--- a/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js
+++ b/src/components/HTMLEngineProvider/HTMLRenderers/ImageRenderer.js
@@ -46,6 +46,7 @@ const ImageRenderer = (props) => {
 
     return (
         <AttachmentModal
+            allowDownload
             sourceURL={source}
             isAuthTokenRequired={isAttachment}
             originalFileName={originalFileName}
diff --git a/src/libs/actions/PersonalDetails.js b/src/libs/actions/PersonalDetails.js
index c86abc9f8830..813a888a74fb 100644
--- a/src/libs/actions/PersonalDetails.js
+++ b/src/libs/actions/PersonalDetails.js
@@ -99,6 +99,7 @@ function formatPersonalDetails(personalDetailsList) {
         const lastName = details.lastName || '';
         const payPalMeAddress = details.expensify_payPalMeAddress || '';
         const phoneNumber = details.phoneNumber || '';
+        const avatarHighResolution = details.avatar || details.avatarThumbnail;
         formattedResult[sanitizedLogin] = {
             login: sanitizedLogin,
             avatar,
@@ -109,6 +110,7 @@ function formatPersonalDetails(personalDetailsList) {
             timezone,
             payPalMeAddress,
             phoneNumber,
+            avatarHighResolution,
         };
     });
     Timing.end(CONST.TIMING.PERSONAL_DETAILS_FORMATTED);
diff --git a/src/pages/DetailsPage.js b/src/pages/DetailsPage.js
index ad3e0bac3566..35b81314e72d 100755
--- a/src/pages/DetailsPage.js
+++ b/src/pages/DetailsPage.js
@@ -20,6 +20,8 @@ import * as ReportUtils from '../libs/reportUtils';
 import DateUtils from '../libs/DateUtils';
 import * as Expensicons from '../components/Icon/Expensicons';
 import MenuItem from '../components/MenuItem';
+import AttachmentModal from '../components/AttachmentModal';
+import PressableWithoutFocus from '../components/PressableWithoutFocus';
 import * as Report from '../libs/actions/Report';
 
 const matchType = PropTypes.shape({
@@ -98,11 +100,24 @@ const DetailsPage = (props) => {
                 {details ? (
                     <ScrollView>
                         <View style={styles.pageWrapper}>
-                            <Avatar
-                                containerStyles={[styles.avatarLarge, styles.mb3]}
-                                imageStyles={[styles.avatarLarge]}
-                                source={details.avatar}
-                            />
+                            <AttachmentModal
+                                headerTitle={isSMSLogin ? props.toLocalPhone(details.displayName) : details.displayName}
+                                sourceURL={details.avatarHighResolution}
+                                isAuthTokenRequired
+                            >
+                                {({show}) => (
+                                    <PressableWithoutFocus
+                                        style={styles.noOutline}
+                                        onPress={show}
+                                    >
+                                        <Avatar
+                                            containerStyles={[styles.avatarLarge, styles.mb3]}
+                                            imageStyles={[styles.avatarLarge]}
+                                            source={details.avatar}
+                                        />
+                                    </PressableWithoutFocus>
+                                )}
+                            </AttachmentModal>
                             {details.displayName && (
                                 <Text style={[styles.displayName, styles.mb6]} numberOfLines={1}>
                                     {isSMSLogin ? props.toLocalPhone(details.displayName) : details.displayName}
diff --git a/src/pages/home/report/ReportActionCompose.js b/src/pages/home/report/ReportActionCompose.js
index 6517fef5d24a..1585dee9ac97 100755
--- a/src/pages/home/report/ReportActionCompose.js
+++ b/src/pages/home/report/ReportActionCompose.js
@@ -414,7 +414,7 @@ class ReportActionCompose extends React.Component {
                 ]}
                 >
                     <AttachmentModal
-                        isUploadingAttachment
+                        headerTitle={this.props.translate('reportActionCompose.sendAttachment')}
                         onConfirm={(file) => {
                             this.submitForm();
                             Report.addAction(this.props.reportID, '', file);