Convert edge cases of MXC URI conversion to new customisation endpoint

This commit is contained in:
Travis Ralston 2021-03-08 17:04:00 -07:00
parent 4688c887c4
commit 125aef24b9
2 changed files with 16 additions and 32 deletions

View File

@ -18,7 +18,6 @@ import {RoomMember} from "matrix-js-sdk/src/models/room-member";
import {User} from "matrix-js-sdk/src/models/user"; import {User} from "matrix-js-sdk/src/models/user";
import {Room} from "matrix-js-sdk/src/models/room"; import {Room} from "matrix-js-sdk/src/models/room";
import {MatrixClientPeg} from './MatrixClientPeg';
import DMRoomMap from './utils/DMRoomMap'; import DMRoomMap from './utils/DMRoomMap';
import {mediaFromMxc} from "./customisations/Media"; import {mediaFromMxc} from "./customisations/Media";
@ -27,14 +26,11 @@ export type ResizeMethod = "crop" | "scale";
// Not to be used for BaseAvatar urls as that has similar default avatar fallback already // Not to be used for BaseAvatar urls as that has similar default avatar fallback already
export function avatarUrlForMember(member: RoomMember, width: number, height: number, resizeMethod: ResizeMethod) { export function avatarUrlForMember(member: RoomMember, width: number, height: number, resizeMethod: ResizeMethod) {
let url: string; let url: string;
if (member && member.getAvatarUrl) { if (member?.getMxcAvatarUrl()) {
url = member.getAvatarUrl( url = mediaFromMxc(member.getMxcAvatarUrl()).getThumbnailOfSourceHttp(
MatrixClientPeg.get().getHomeserverUrl(),
Math.floor(width * window.devicePixelRatio), Math.floor(width * window.devicePixelRatio),
Math.floor(height * window.devicePixelRatio), Math.floor(height * window.devicePixelRatio),
resizeMethod, resizeMethod,
false,
false,
); );
} }
if (!url) { if (!url) {
@ -150,15 +146,8 @@ export function getInitialLetter(name: string): string {
export function avatarUrlForRoom(room: Room, width: number, height: number, resizeMethod?: ResizeMethod) { export function avatarUrlForRoom(room: Room, width: number, height: number, resizeMethod?: ResizeMethod) {
if (!room) return null; // null-guard if (!room) return null; // null-guard
const explicitRoomAvatar = room.getAvatarUrl( if (room.getMxcAvatarUrl()) {
MatrixClientPeg.get().getHomeserverUrl(), return mediaFromMxc(room.getMxcAvatarUrl()).getThumbnailOfSourceHttp(width, height, resizeMethod);
width,
height,
resizeMethod,
false,
);
if (explicitRoomAvatar) {
return explicitRoomAvatar;
} }
// space rooms cannot be DMs so skip the rest // space rooms cannot be DMs so skip the rest
@ -173,14 +162,8 @@ export function avatarUrlForRoom(room: Room, width: number, height: number, resi
// then still try to show any avatar (pref. other member) // then still try to show any avatar (pref. other member)
otherMember = room.getAvatarFallbackMember(); otherMember = room.getAvatarFallbackMember();
} }
if (otherMember) { if (otherMember?.getMxcAvatarUrl()) {
return otherMember.getAvatarUrl( return mediaFromMxc(otherMember.getMxcAvatarUrl()).getThumbnailOfSourceHttp(width, height, resizeMethod);
MatrixClientPeg.get().getHomeserverUrl(),
width,
height,
resizeMethod,
false,
);
} }
return null; return null;
} }

View File

@ -20,9 +20,9 @@ import {RoomMember} from "matrix-js-sdk/src/models/room-member";
import dis from "../../../dispatcher/dispatcher"; import dis from "../../../dispatcher/dispatcher";
import {Action} from "../../../dispatcher/actions"; import {Action} from "../../../dispatcher/actions";
import {MatrixClientPeg} from "../../../MatrixClientPeg";
import BaseAvatar from "./BaseAvatar"; import BaseAvatar from "./BaseAvatar";
import {replaceableComponent} from "../../../utils/replaceableComponent"; import {replaceableComponent} from "../../../utils/replaceableComponent";
import {mediaFromMxc} from "../../../customisations/Media";
import {ResizeMethod} from "../../../Avatar"; import {ResizeMethod} from "../../../Avatar";
interface IProps extends Omit<React.ComponentProps<typeof BaseAvatar>, "name" | "idName" | "url"> { interface IProps extends Omit<React.ComponentProps<typeof BaseAvatar>, "name" | "idName" | "url"> {
@ -65,17 +65,18 @@ export default class MemberAvatar extends React.Component<IProps, IState> {
private static getState(props: IProps): IState { private static getState(props: IProps): IState {
if (props.member && props.member.name) { if (props.member && props.member.name) {
return { let imageUrl = null;
name: props.member.name, if (props.member.getMxcAvatarUrl()) {
title: props.title || props.member.userId, imageUrl = mediaFromMxc(props.member.getMxcAvatarUrl()).getThumbnailOfSourceHttp(
imageUrl: props.member.getAvatarUrl(
MatrixClientPeg.get().getHomeserverUrl(),
Math.floor(props.width * window.devicePixelRatio), Math.floor(props.width * window.devicePixelRatio),
Math.floor(props.height * window.devicePixelRatio), Math.floor(props.height * window.devicePixelRatio),
props.resizeMethod, props.resizeMethod,
false, );
false, }
), return {
name: props.member.name,
title: props.title || props.member.userId,
imageUrl: imageUrl,
}; };
} else if (props.fallbackUserId) { } else if (props.fallbackUserId) {
return { return {