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:
Germain 2023-08-24 04:48:35 +01:00 committed by GitHub
parent e34920133e
commit 09c5e06d12
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
125 changed files with 936 additions and 1413 deletions

View file

@ -88,7 +88,7 @@ import { Filter } from "./Filter";
const MAX_RECENT_SEARCHES = 10;
const SECTION_LIMIT = 50; // only show 50 results per section for performance reasons
const AVATAR_SIZE = 24;
const AVATAR_SIZE = "24px";
interface IProps {
initialText?: string;
@ -609,11 +609,7 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", initialFilter = n
endAdornment={<RoomResultContextMenus room={result.room} />}
{...ariaProperties}
>
<DecoratedRoomAvatar
room={result.room}
avatarSize={AVATAR_SIZE}
tooltipProps={{ tabIndex: -1 }}
/>
<DecoratedRoomAvatar room={result.room} size={AVATAR_SIZE} tooltipProps={{ tabIndex: -1 }} />
{result.room.name}
<NotificationBadge notification={notification} />
<RoomContextDetails
@ -702,8 +698,7 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", initialFilter = n
avatarUrl: result.publicRoom.avatar_url,
roomType: result.publicRoom.room_type,
}}
width={AVATAR_SIZE}
height={AVATAR_SIZE}
size={AVATAR_SIZE}
/>
<PublicRoomResultDetails
room={result.publicRoom}
@ -843,11 +838,12 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", initialFilter = n
idName={room.room_id}
url={
room.avatar_url
? mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(AVATAR_SIZE)
? mediaFromMxc(room.avatar_url).getSquareThumbnailHttp(
parseInt(AVATAR_SIZE, 10),
)
: null
}
width={AVATAR_SIZE}
height={AVATAR_SIZE}
size={AVATAR_SIZE}
/>
{room.name || room.canonical_alias}
{room.name && room.canonical_alias && (
@ -1037,7 +1033,7 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", initialFilter = n
>
<DecoratedRoomAvatar
room={room}
avatarSize={AVATAR_SIZE}
size={AVATAR_SIZE}
tooltipProps={{ tabIndex: -1 }}
/>
{room.name}
@ -1075,7 +1071,7 @@ const SpotlightDialog: React.FC<IProps> = ({ initialText = "", initialFilter = n
viewRoom({ roomId: room.roomId }, false, ev.type !== "click");
}}
>
<DecoratedRoomAvatar room={room} avatarSize={32} tooltipProps={{ tabIndex: -1 }} />
<DecoratedRoomAvatar room={room} size="32px" tooltipProps={{ tabIndex: -1 }} />
{room.name}
</TooltipOption>
))}