nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Message preview should show tooltip with the full message on hover (#30265)

Browse Source 
* Add title attribute for message preview

So that the full message is shown in a tooltip on hover.

* Fix test

* Update src/components/views/rooms/RoomListPanel/RoomListItemView.tsx

Co-authored-by: Florian Duros <florianduros@element.io>

---------

Co-authored-by: Florian Duros <florianduros@element.io>
This commit is contained in:
R Midhun Suresh
2025-07-21 17:28:54 +05:30
committed by GitHub
parent 5b659fe2e5
commit 8a879c7fca
4 changed files with 8 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/views/rooms/RoomListPanel/RoomListItemView.tsx
View File

@@ -94,7 +94,11 @@ export const RoomListItemView = memo(function RoomListItemView({
<div className="mx_RoomListItemView_roomName" title={vm.name}>
{vm.name}
</div>
<div className="mx_RoomListItemView_messagePreview">{vm.messagePreview}</div>
{vm.messagePreview && (
<div className="mx_RoomListItemView_messagePreview" title={vm.messagePreview}>
{vm.messagePreview}
</div>
)}
</div>
{showHoverMenu ? (
<RoomListItemMenuView

2
test/unit-tests/components/views/rooms/RoomListPanel/RoomListItemView-test.tsx
View File

@@ -65,7 +65,7 @@ describe("<RoomListItemView />", () => {
});
test("should render a room item with a message preview", () => {
defaultValue.messagePreview = "The message looks list this";
defaultValue.messagePreview = "The message looks like this";
const onClick = jest.fn();
const { asFragment } = render(<RoomListItemView room={room} onClick={onClick} isSelected={false} />);

30
test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomList-test.tsx.snap
View File

@@ -69,9 +69,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room0
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -123,9 +120,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room1
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -177,9 +171,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room2
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -231,9 +222,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room3
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -285,9 +273,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room4
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -339,9 +324,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room5
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -393,9 +375,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room6
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -447,9 +426,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room7
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -501,9 +477,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room8
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -555,9 +528,6 @@ exports[`<RoomList /> should render a room list 1`] = `
>
room9
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>

12
test/unit-tests/components/views/rooms/RoomListPanel/__snapshots__/RoomListItemView-test.tsx.snap
View File

@@ -45,9 +45,6 @@ exports[`<RoomListItemView /> should be selected if isSelected=true 1`] = `
>
room1
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -100,9 +97,6 @@ exports[`<RoomListItemView /> should display notification decoration 1`] = `
>
room1
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
<div
aria-hidden="true"
@@ -167,9 +161,6 @@ exports[`<RoomListItemView /> should render a room item 1`] = `
>
room1
</div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div>
</div>
</div>
@@ -224,8 +215,9 @@ exports[`<RoomListItemView /> should render a room item with a message preview 1
</div>
<div
class="mx_RoomListItemView_messagePreview"
title="The message looks like this"
>
The message looks list this
The message looks like this
</div>
</div>
</div>