Use new compound tooltip

This commit is contained in:
Florian Duros 2024-04-12 14:56:23 +02:00
parent aadb46358b
commit 5354e6efea
No known key found for this signature in database
GPG key ID: A5BBB4041B493F15
49 changed files with 127 additions and 211 deletions

View file

@ -48,7 +48,7 @@ interface Props {
size?: number;
onClick?: () => void;
hideTooltip?: boolean;
tooltipSide?: ComponentProps<typeof Tooltip>["side"];
tooltipPlacement?: ComponentProps<typeof Tooltip>["placement"];
bordered?: boolean;
}
@ -69,7 +69,7 @@ const E2EIcon: React.FC<XOR<UserProps, RoomProps>> = ({
size,
onClick,
hideTooltip,
tooltipSide,
tooltipPlacement,
bordered,
}) => {
const classes = classNames(
@ -109,7 +109,7 @@ const E2EIcon: React.FC<XOR<UserProps, RoomProps>> = ({
}
return (
<Tooltip label={label} side={tooltipSide} isTriggerInteractive={!!onClick}>
<Tooltip label={label} placement={tooltipPlacement} isTriggerInteractive={!!onClick}>
{content}
</Tooltip>
);

View file

@ -1546,7 +1546,7 @@ function SentReceipt({ messageState }: ISentReceiptProps): JSX.Element {
return (
<div className="mx_EventTile_msgOption">
<div className="mx_ReadReceiptGroup">
<Tooltip label={label} side="top" align="end">
<Tooltip label={label} placement="top-end">
<div className="mx_ReadReceiptGroup_button">
<span className="mx_ReadReceiptGroup_container">
<span className={receiptClasses}>{nonCssBadge}</span>

View file

@ -784,7 +784,7 @@ export default class RoomHeader extends React.Component<IProps, IState> {
const icon = this.props.viewingCall ? (
<div className="mx_LegacyRoomHeader_icon mx_LegacyRoomHeader_icon_video" />
) : this.props.e2eStatus ? (
<E2EIcon className="mx_LegacyRoomHeader_icon" status={this.props.e2eStatus} tooltipSide="bottom" />
<E2EIcon className="mx_LegacyRoomHeader_icon" status={this.props.e2eStatus} tooltipPlacement="bottom" />
) : // If we're expecting an E2EE status to come in, but it hasn't
// yet been loaded, insert a blank div to reserve space
this.client.isRoomEncrypted(this.props.room.roomId) && this.client.isCryptoEnabled() ? (

View file

@ -121,7 +121,7 @@ export default class NotificationBadge extends React.PureComponent<XOR<IProps, I
if (showUnsentTooltip && notification.level === NotificationLevel.Unsent) {
return (
<Tooltip label={_t("notifications|message_didnt_send")} side="right">
<Tooltip label={_t("notifications|message_didnt_send")} placement="right">
{badge}
</Tooltip>
);

View file

@ -252,7 +252,7 @@ export default function RoomHeader({
<span className="mx_RoomHeader_truncated mx_lineClamp">{roomName}</span>
{!isDirectMessage && roomState.getJoinRule() === JoinRule.Public && (
<Tooltip label={_t("common|public_room")} side="right">
<Tooltip label={_t("common|public_room")} placement="right">
<PublicIcon
width="16px"
height="16px"
@ -263,7 +263,7 @@ export default function RoomHeader({
)}
{isDirectMessage && e2eStatus === E2EStatus.Verified && (
<Tooltip label={_t("common|verified")} side="right">
<Tooltip label={_t("common|verified")} placement="right">
<VerifiedIcon
width="16px"
height="16px"
@ -274,7 +274,7 @@ export default function RoomHeader({
)}
{isDirectMessage && e2eStatus === E2EStatus.Warning && (
<Tooltip label={_t("room|header_untrusted_label")} side="right">
<Tooltip label={_t("room|header_untrusted_label")} placement="right">
<ErrorIcon
width="16px"
height="16px"