Save users' avatars

src/components/views/avatars/MemberAvatar.tsx

@@ -36,6 +36,7 @@ interface IProps extends Omit<React.ComponentProps<typeof BaseAvatar>, "name" |
     // Whether the onClick of the avatar should be overriden to dispatch `Action.ViewUser`
     viewUserOnClick?: boolean;
     title?: string;
+    avatarSrc?: string;
 }
 
 interface IState {
@@ -66,7 +67,8 @@ export default class MemberAvatar extends React.Component<IProps, IState> {
     private static getState(props: IProps): IState {
         if (props.member?.name) {
             let imageUrl = null;
-            if (props.member.getMxcAvatarUrl()) {
+            if (props.avatarSrc) imageUrl = props.avatarSrc;
+            else if (props.member.getMxcAvatarUrl()) {
                 imageUrl = mediaFromMxc(props.member.getMxcAvatarUrl()).getThumbnailOfSourceHttp(
                     props.width,
                     props.height,

src/components/views/messages/MImageBody.js

@@ -407,7 +407,7 @@ export default class MImageBody extends React.Component {
             <div className="mx_MImageBody_thumbnail_container" style={{ maxHeight: maxHeight + "px" }} >
                 { /* Calculate aspect ratio, using %padding will size _container correctly */ }
                 <div style={{ paddingBottom: (100 * infoHeight / infoWidth) + '%' }} />
-                { showPlaceholder &&
+                { !this.props.mediaSrc && showPlaceholder &&
                     <div className="mx_MImageBody_thumbnail" style={{
                         // Constrain width here so that spinner appears central to the loaded thumbnail
                         maxWidth: infoWidth + "px",
@@ -418,7 +418,7 @@ export default class MImageBody extends React.Component {
                     </div>
                 }
 
-                <div style={{display: !showPlaceholder ? undefined : 'none'}}>
+                <div style={{display: this.props.mediaSrc ? "block" : !showPlaceholder ? undefined : 'none'}}>
                     { img }
                     { gifLabel }
                 </div>

src/components/views/rooms/EventTile.tsx

@@ -254,6 +254,9 @@ interface IProps {
     // Used while exporting to refer to the local source rather than the online one
     mediaSrc?: string;
 
+    // Used while exporting to refer to the local avatar rather than the online one
+    avatarSrc?: string;
+
     // show twelve hour timestamps
     isTwelveHour?: boolean;
 
@@ -939,8 +942,11 @@ export default class EventTile extends React.Component<IProps, IState> {
             }
             avatar = (
                 <div className="mx_EventTile_avatar">
-                    <MemberAvatar member={member}
-                        width={avatarSize} height={avatarSize}
+                    <MemberAvatar
+                        avatarSrc = {this.props.avatarSrc}
+                        member={member}
+                        width={avatarSize}
+                        height={avatarSize}
                         viewUserOnClick={true}
                     />
                 </div>