Change avatar to use Compound implementation (#11448)
* Move avatar to new compound implementation * Make space avatars square * Remove reference to the avatar initial CSS class * remove references to mx_BaseAvatar_image * Fixe test suites * Fix accessbility violations * Add ConfirmUserActionDialog test * Fix tests * Add FacePile test * Fix items clipping in members list * Fix user info avatar sizing * Fix tests
This commit is contained in:
parent
e34920133e
commit
09c5e06d12
125 changed files with 936 additions and 1413 deletions
|
@ -59,7 +59,7 @@ const getOwnProfile = (
|
|||
avatarUrl?: string;
|
||||
} => ({
|
||||
displayName: OwnProfileStore.instance.displayName || userId,
|
||||
avatarUrl: OwnProfileStore.instance.getHttpAvatarUrl(AVATAR_SIZE) ?? undefined,
|
||||
avatarUrl: OwnProfileStore.instance.getHttpAvatarUrl(parseInt(AVATAR_SIZE, 10)) ?? undefined,
|
||||
});
|
||||
|
||||
const UserWelcomeTop: React.FC = () => {
|
||||
|
@ -84,9 +84,7 @@ const UserWelcomeTop: React.FC = () => {
|
|||
idName={userId}
|
||||
name={ownProfile.displayName}
|
||||
url={ownProfile.avatarUrl}
|
||||
width={AVATAR_SIZE}
|
||||
height={AVATAR_SIZE}
|
||||
resizeMethod="crop"
|
||||
size={AVATAR_SIZE + "px"}
|
||||
/>
|
||||
</MiniAvatarUploader>
|
||||
|
||||
|
@ -106,7 +104,7 @@ const HomePage: React.FC<IProps> = ({ justRegistered = false }) => {
|
|||
}
|
||||
|
||||
let introSection: JSX.Element;
|
||||
if (justRegistered || !OwnProfileStore.instance.getHttpAvatarUrl(AVATAR_SIZE)) {
|
||||
if (justRegistered || !OwnProfileStore.instance.getHttpAvatarUrl(parseInt(AVATAR_SIZE, 10))) {
|
||||
introSection = <UserWelcomeTop />;
|
||||
} else {
|
||||
const brandingConfig = SdkConfig.getObject("branding");
|
||||
|
|
|
@ -194,15 +194,14 @@ const Tile: React.FC<ITileProps> = ({
|
|||
|
||||
let avatar: ReactElement;
|
||||
if (joinedRoom) {
|
||||
avatar = <RoomAvatar room={joinedRoom} width={20} height={20} />;
|
||||
avatar = <RoomAvatar room={joinedRoom} size="20px" />;
|
||||
} else {
|
||||
avatar = (
|
||||
<BaseAvatar
|
||||
name={name}
|
||||
idName={room.room_id}
|
||||
url={room.avatar_url ? mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(20) : null}
|
||||
width={20}
|
||||
height={20}
|
||||
size="20px"
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
|
|
@ -265,7 +265,7 @@ const SpaceLanding: React.FC<{ space: Room }> = ({ space }) => {
|
|||
return (
|
||||
<div className="mx_SpaceRoomView_landing">
|
||||
<div className="mx_SpaceRoomView_landing_header">
|
||||
<RoomAvatar room={space} height={80} width={80} viewAvatarOnClick={true} />
|
||||
<RoomAvatar room={space} size="80px" viewAvatarOnClick={true} type="square" />
|
||||
</div>
|
||||
<div className="mx_SpaceRoomView_landing_name">
|
||||
<RoomName room={space}>
|
||||
|
|
|
@ -458,9 +458,7 @@ export default class UserMenu extends React.Component<IProps, IState> {
|
|||
idName={userId}
|
||||
name={displayName}
|
||||
url={avatarUrl}
|
||||
width={avatarSize}
|
||||
height={avatarSize}
|
||||
resizeMethod="crop"
|
||||
size={avatarSize + "px"}
|
||||
className="mx_UserMenu_userAvatar_BaseAvatar"
|
||||
/>
|
||||
{liveAvatarAddon}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue