imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Pinned message list: prevent sender name to overflow pinned event tile (#12947)

Browse source 
* Prevent sender name to overflow pinned event tile

* Add tooltip to display the sender name
This commit is contained in:
Florian Duros 2024-09-04 11:45:18 +02:00 • committed by GitHub
parent ab1e28bfea
commit 1e3320da1e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 15 additions and 14 deletions
Download patch file Download diff file Expand all files Collapse all files

14
src/components/views/rooms/PinnedEventTile.tsx
View file

@ -17,7 +17,7 @@ limitations under the License.
import React, { JSX, useCallback, useState } from "react";
import { EventTimeline, EventType, MatrixEvent, Room } from "matrix-js-sdk/src/matrix";
import { IconButton, Menu, MenuItem, Separator, Text } from "@vector-im/compound-web";
import { IconButton, Menu, MenuItem, Separator, Tooltip } from "@vector-im/compound-web";
import { Icon as ViewIcon } from "@vector-im/compound-design-tokens/icons/visibility-on.svg";
import { Icon as UnpinIcon } from "@vector-im/compound-design-tokens/icons/unpin.svg";
import { Icon as ForwardIcon } from "@vector-im/compound-design-tokens/icons/forward.svg";
@ -86,13 +86,11 @@ export function PinnedEventTile({ event, room, permalinkCreator }: PinnedEventTi
</div>
<div className="mx_PinnedEventTile_wrapper">
<div className="mx_PinnedEventTile_top">
<Text
weight="semibold"
className={classNames("mx_PinnedEventTile_sender", getUserNameColorClass(sender))}
as="span"
>
{event.sender?.name || sender}
</Text>
<Tooltip label={event.sender?.name || sender}>
<span className={classNames("mx_PinnedEventTile_sender", getUserNameColorClass(sender))}>
{event.sender?.name || sender}
</span>
</Tooltip>
<PinMenu event={event} room={room} permalinkCreator={permalinkCreator} />
</div>
<MessageEvent