Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix avatar preview size #15185

Merged
merged 3 commits into from
Feb 17, 2023
Merged

Fix avatar preview size #15185

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
50528ca
Fix avatar preview size
marcaaron Feb 15, 2023
30b2297
support the svg avatars
marcaaron Feb 15, 2023
bd7e964
fix conflicts
marcaaron Feb 17, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 18 additions & 1 deletion src/libs/ReportUtils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -506,7 +506,7 @@ function isDefaultAvatar(avatarURL) {
*
* @param {String} [avatarURL] - the avatar source from user's personalDetails
* @param {String} [login] - the email of the user
* @returns {String | Function}
* @returns {String|Function}
*/
function getAvatar(avatarURL, login) {
if (isDefaultAvatar(avatarURL)) {
Expand All @@ -515,6 +515,22 @@ function getAvatar(avatarURL, login) {
return avatarURL;
}

/**
* Avatars uploaded by users will have a _128 appended so that the asset server returns a small version.
* This removes that part of the URL so the full version of the image can load.
*
* @param {String} [avatarURL]
* @param {String} [login]
* @returns {String|Function}
*/
function getFullSizeAvatar(avatarURL, login) {
const source = getAvatar(avatarURL, login);
if (!_.isString(source)) {
return source;
}
return source.replace('_128', '');
}

/**
* Returns the appropriate icons for the given chat report using the stored personalDetails.
* The Avatar sources can be URLs or Icon components according to the chat type.
Expand Down Expand Up @@ -1571,5 +1587,6 @@ export {
canSeeDefaultRoom,
getCommentLength,
openReportFromDeepLink,
getFullSizeAvatar,
getIOUOptions,
};
2 changes: 1 addition & 1 deletion src/pages/DetailsPage.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -125,7 +125,7 @@ class DetailsPage extends React.PureComponent {
<View style={styles.avatarSectionWrapper}>
<AttachmentModal
headerTitle={isSMSLogin ? this.props.toLocalPhone(details.displayName) : details.displayName}
source={ReportUtils.getAvatar(details.avatar, details.login)}
source={ReportUtils.getFullSizeAvatar(details.avatar, details.login)}
isAuthTokenRequired
>
{({show}) => (
Expand Down