Tooltip: Use AccessibleButton
in RovingAccessibleTooltipButton
(#12458)
* Use `AccessibleButton` in `RovingAccessibleTooltipButton` * Update snapshots * Update @vector-im/compound-web * Update playwright * Remove placement
This commit is contained in:
parent
3634e665b1
commit
2df946b5b1
9 changed files with 34 additions and 49 deletions
|
@ -229,22 +229,16 @@ const ReplyInThreadButton: React.FC<IReplyInThreadButton> = ({ mxEvent }) => {
|
|||
}
|
||||
};
|
||||
|
||||
const title = !hasARelation ? _t("action|reply_in_thread") : _t("threads|error_start_thread_existing_relation");
|
||||
|
||||
return (
|
||||
<RovingAccessibleTooltipButton
|
||||
className="mx_MessageActionBar_iconButton mx_MessageActionBar_threadButton"
|
||||
disabled={hasARelation}
|
||||
tooltip={
|
||||
<>
|
||||
<div className="mx_Tooltip_title">
|
||||
{!hasARelation
|
||||
? _t("action|reply_in_thread")
|
||||
: _t("threads|error_start_thread_existing_relation")}
|
||||
</div>
|
||||
</>
|
||||
}
|
||||
title={!hasARelation ? _t("action|reply_in_thread") : _t("threads|error_start_thread_existing_relation")}
|
||||
title={title}
|
||||
onClick={onClick}
|
||||
onContextMenu={onClick}
|
||||
placement="left"
|
||||
>
|
||||
<ThreadIcon />
|
||||
</RovingAccessibleTooltipButton>
|
||||
|
@ -509,18 +503,7 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
|
|||
mx_MessageActionBar_iconButton: true,
|
||||
mx_MessageActionBar_expandCollapseMessageButton: true,
|
||||
});
|
||||
const tooltip = (
|
||||
<>
|
||||
<div className="mx_Tooltip_title">
|
||||
{this.props.isQuoteExpanded
|
||||
? _t("timeline|mab|collapse_reply_chain")
|
||||
: _t("timeline|mab|expand_reply_chain")}
|
||||
</div>
|
||||
<div className="mx_Tooltip_sub">
|
||||
{_t(ALTERNATE_KEY_NAME[Key.SHIFT]) + " + " + _t("action|click")}
|
||||
</div>
|
||||
</>
|
||||
);
|
||||
|
||||
toolbarOpts.push(
|
||||
<RovingAccessibleTooltipButton
|
||||
className={expandClassName}
|
||||
|
@ -529,9 +512,10 @@ export default class MessageActionBar extends React.PureComponent<IMessageAction
|
|||
? _t("timeline|mab|collapse_reply_chain")
|
||||
: _t("timeline|mab|expand_reply_chain")
|
||||
}
|
||||
tooltip={tooltip}
|
||||
caption={_t(ALTERNATE_KEY_NAME[Key.SHIFT]) + " + " + _t("action|click")}
|
||||
onClick={this.props.toggleThreadExpanded}
|
||||
key="expand"
|
||||
placement="left"
|
||||
>
|
||||
{this.props.isQuoteExpanded ? <CollapseMessageIcon /> : <ExpandMessageIcon />}
|
||||
</RovingAccessibleTooltipButton>,
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue