Add at room avatar for RTE (#11106)

* add at room avatar logic

* fix broken test

* fix TS error

* add param comment

* increase test coverage

* update code to solve conflict
This commit is contained in:
alunturner 2023-06-21 08:57:22 +01:00 committed by GitHub
parent 985bde70c5
commit ac3d6ab7dd
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 38 additions and 3 deletions

View file

@ -89,6 +89,7 @@ export function getMentionDisplayText(completion: ICompletion, client: MatrixCli
*
* @param completion - the item selected from the autocomplete
* @param client - the MatrixClient is required for us to look up the correct room mention text
* @param room - the room the composer is currently in
* @returns an object of attributes containing HTMLAnchor attributes or data-* attributes
*/
export function getMentionAttributes(
@ -133,8 +134,18 @@ export function getMentionAttributes(
attributes.set("data-mention-type", completion.type);
attributes.set("style", `--avatar-background: url(${avatarUrl}); --avatar-letter: '${initialLetter}'`);
} else if (completion.type === "at-room") {
// TODO add avatar logic for at-room
// logic as used in RoomPillPart.setAvatar in parts.ts, but now we know the current room
// from the arguments passed
let initialLetter = defaultLetterContent;
let avatarUrl = Avatar.avatarUrlForRoom(room, 16, 16, "crop");
if (!avatarUrl) {
initialLetter = Avatar.getInitialLetter(room.name) ?? defaultLetterContent;
avatarUrl = Avatar.defaultAvatarUrlForString(room.roomId);
}
attributes.set("data-mention-type", completion.type);
attributes.set("style", `--avatar-background: url(${avatarUrl}); --avatar-letter: '${initialLetter}'`);
}
return attributes;

View file

@ -242,12 +242,36 @@ describe("getMentionAttributes", () => {
});
describe("at-room mentions", () => {
it("returns expected attributes", () => {
it("returns expected attributes when avatar url for room is truthyf", () => {
const atRoomCompletion = createMockCompletion({ type: "at-room" });
const result = getMentionAttributes(atRoomCompletion, mockClient, mockRoom);
expect(result).toEqual(new Map([["data-mention-type", "at-room"]]));
expect(result).toEqual(
new Map([
["data-mention-type", "at-room"],
["style", `--avatar-background: url(${testAvatarUrlForRoom}); --avatar-letter: '\u200b'`],
]),
);
});
it("returns expected style attributes when avatar url for room is falsy", () => {
const atRoomCompletion = createMockCompletion({ type: "at-room" });
// mock a single implementation of avatarUrlForRoom to make it falsy
mockAvatar.avatarUrlForRoom.mockReturnValueOnce(null);
const result = getMentionAttributes(atRoomCompletion, mockClient, mockRoom);
expect(result).toEqual(
new Map([
["data-mention-type", "at-room"],
[
"style",
`--avatar-background: url(${testAvatarUrlForString}); --avatar-letter: '${testInitialLetter}'`,
],
]),
);
});
});
});