From fc66a1550441ca2025e3957c9c19bfc2f95ad842 Mon Sep 17 00:00:00 2001
From: Michael Telatynski <7t3chguy@gmail.com>
Date: Fri, 17 Jul 2020 18:36:32 +0100
Subject: [PATCH] Add tooltips to the Message Action Bar

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
---
 .../views/messages/MessageActionBar.js           | 16 ++++++++--------
 1 file changed, 8 insertions(+), 8 deletions(-)

diff --git a/src/components/views/messages/MessageActionBar.js b/src/components/views/messages/MessageActionBar.js
index 7959ad8a93..513f21b8b7 100644
--- a/src/components/views/messages/MessageActionBar.js
+++ b/src/components/views/messages/MessageActionBar.js
@@ -22,11 +22,11 @@ import PropTypes from 'prop-types';
 import { _t } from '../../../languageHandler';
 import * as sdk from '../../../index';
 import dis from '../../../dispatcher/dispatcher';
-import {aboveLeftOf, ContextMenu, ContextMenuButton, useContextMenu} from '../../structures/ContextMenu';
+import {aboveLeftOf, ContextMenu, ContextMenuTooltipButton, useContextMenu} from '../../structures/ContextMenu';
 import { isContentActionable, canEditContent } from '../../../utils/EventUtils';
 import RoomContext from "../../../contexts/RoomContext";
 import Toolbar from "../../../accessibility/Toolbar";
-import {RovingAccessibleButton, useRovingTabIndex} from "../../../accessibility/RovingTabIndex";
+import {RovingAccessibleTooltipButton, useRovingTabIndex} from "../../../accessibility/RovingTabIndex";
 
 const OptionsButton = ({mxEvent, getTile, getReplyThread, permalinkCreator, onFocusChange}) => {
     const [menuDisplayed, button, openMenu, closeMenu] = useContextMenu();
@@ -55,9 +55,9 @@ const OptionsButton = ({mxEvent, getTile, getReplyThread, permalinkCreator, onFo
     }
 
     return <React.Fragment>
-        <ContextMenuButton
+        <ContextMenuTooltipButton
             className="mx_MessageActionBar_maskButton mx_MessageActionBar_optionsButton"
-            label={_t("Options")}
+            title={_t("Options")}
             onClick={openMenu}
             isExpanded={menuDisplayed}
             inputRef={ref}
@@ -86,9 +86,9 @@ const ReactButton = ({mxEvent, reactions, onFocusChange}) => {
     }
 
     return <React.Fragment>
-        <ContextMenuButton
+        <ContextMenuTooltipButton
             className="mx_MessageActionBar_maskButton mx_MessageActionBar_reactButton"
-            label={_t("React")}
+            title={_t("React")}
             onClick={openMenu}
             isExpanded={menuDisplayed}
             inputRef={ref}
@@ -167,7 +167,7 @@ export default class MessageActionBar extends React.PureComponent {
                 );
             }
             if (this.context.canReply) {
-                replyButton = <RovingAccessibleButton
+                replyButton = <RovingAccessibleTooltipButton
                     className="mx_MessageActionBar_maskButton mx_MessageActionBar_replyButton"
                     title={_t("Reply")}
                     onClick={this.onReplyClick}
@@ -175,7 +175,7 @@ export default class MessageActionBar extends React.PureComponent {
             }
         }
         if (canEditContent(this.props.mxEvent)) {
-            editButton = <RovingAccessibleButton
+            editButton = <RovingAccessibleTooltipButton
                 className="mx_MessageActionBar_maskButton mx_MessageActionBar_editButton"
                 title={_t("Edit")}
                 onClick={this.onEditClick}