mirrors/element-web
1
0
Fork 0
mirror of https://github.com/vector-im/element-web.git synced 2025-11-29 14:31:22 +01:00
Code Issues 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
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
4 changed files with 8 additions and 42 deletions
Show Stats 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}> <div className="mx_RoomListItemView_roomName" title={vm.name}>
{vm.name} {vm.name}
</div> </div>
<div className="mx_RoomListItemView_messagePreview">{vm.messagePreview}</div> {vm.messagePreview && (
<div className="mx_RoomListItemView_messagePreview" title={vm.messagePreview}>
{vm.messagePreview}
</div>
)}
</div> </div>
{showHoverMenu ? ( {showHoverMenu ? (
<RoomListItemMenuView <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", () => { 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 onClick = jest.fn();
const { asFragment } = render(<RoomListItemView room={room} onClick={onClick} isSelected={false} />); 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 room0
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -123,9 +120,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room1 room1
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -177,9 +171,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room2 room2
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -231,9 +222,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room3 room3
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -285,9 +273,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room4 room4
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -339,9 +324,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room5 room5
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -393,9 +375,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room6 room6
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -447,9 +426,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room7 room7
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -501,9 +477,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room8 room8
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -555,9 +528,6 @@ exports[`<RoomList /> should render a room list 1`] = `
> >
room9 room9
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </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 room1
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -100,9 +97,6 @@ exports[`<RoomListItemView /> should display notification decoration 1`] = `
> >
room1 room1
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
<div <div
aria-hidden="true" aria-hidden="true"
@ -167,9 +161,6 @@ exports[`<RoomListItemView /> should render a room item 1`] = `
> >
room1 room1
</div> </div>
<div
class="mx_RoomListItemView_messagePreview"
/>
</div> </div>
</div> </div>
</div> </div>
@ -224,8 +215,9 @@ exports[`<RoomListItemView /> should render a room item with a message preview 1
</div> </div>
<div <div
class="mx_RoomListItemView_messagePreview" class="mx_RoomListItemView_messagePreview"
title="The message looks like this"
> >
The message looks list this The message looks like this
</div> </div>
</div> </div>
</div> </div>