From 2df946b5b198b0aeb62a30aaf93453f9e5693574 Mon Sep 17 00:00:00 2001 From: Florian Duros Date: Tue, 30 Apr 2024 11:35:58 +0200 Subject: [PATCH] Tooltip: Use `AccessibleButton` in `RovingAccessibleTooltipButton` (#12458) * Use `AccessibleButton` in `RovingAccessibleTooltipButton` * Update snapshots * Update @vector-im/compound-web * Update playwright * Remove placement --- package.json | 2 +- ...ent-tile-reply-chains-irc-layout-linux.png | Bin 9454 -> 9381 bytes .../roving/RovingAccessibleTooltipButton.tsx | 11 +++---- .../views/messages/MessageActionBar.tsx | 30 ++++-------------- src/components/views/pips/WidgetPip.tsx | 5 ++- .../views/rooms/MessageComposerFormatBar.tsx | 13 ++------ .../__snapshots__/RoomView-test.tsx.snap | 12 +++++++ .../EventTileThreadToolbar-test.tsx.snap | 2 ++ yarn.lock | 8 ++--- 9 files changed, 34 insertions(+), 49 deletions(-) diff --git a/package.json b/package.json index 37d48159e3..5a240b7bb0 100644 --- a/package.json +++ b/package.json @@ -76,7 +76,7 @@ "@sentry/browser": "^7.0.0", "@testing-library/react-hooks": "^8.0.1", "@vector-im/compound-design-tokens": "^1.2.0", - "@vector-im/compound-web": "^4.0.2", + "@vector-im/compound-web": "^4.1.0", "@zxcvbn-ts/core": "^3.0.4", "@zxcvbn-ts/language-common": "^3.0.4", "@zxcvbn-ts/language-en": "^3.0.2", diff --git a/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-layout-linux.png b/playwright/snapshots/timeline/timeline.spec.ts/event-tile-reply-chains-irc-layout-linux.png index 45c43f06fecf682bca9c333e49a6c95050adc17d..98ec9e0cf6686c6a2c21eff8655b26396bbbb9f2 100644 GIT binary patch literal 9381 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 GKmQM&^yx1E literal 9454 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 diff --git a/src/accessibility/roving/RovingAccessibleTooltipButton.tsx b/src/accessibility/roving/RovingAccessibleTooltipButton.tsx index 5607089c6e..6594f2782e 100644 --- a/src/accessibility/roving/RovingAccessibleTooltipButton.tsx +++ b/src/accessibility/roving/RovingAccessibleTooltipButton.tsx @@ -16,18 +16,15 @@ limitations under the License. import React, { ComponentProps } from "react"; -import AccessibleTooltipButton from "../../components/views/elements/AccessibleTooltipButton"; import { useRovingTabIndex } from "../RovingTabIndex"; import { Ref } from "./types"; +import AccessibleButton from "../../components/views/elements/AccessibleButton"; -type Props = Omit< - ComponentProps>, - "tabIndex" -> & { +type Props = Omit>, "tabIndex"> & { inputRef?: Ref; }; -// Wrapper to allow use of useRovingTabIndex for simple AccessibleTooltipButtons outside of React Functional Components. +// Wrapper to allow use of useRovingTabIndex for simple AccessibleButtons outside of React Functional Components. export const RovingAccessibleTooltipButton = ({ inputRef, onFocus, @@ -35,7 +32,7 @@ export const RovingAccessibleTooltipButton = ): JSX.Element => { const [onFocusInternal, isActive, ref] = useRovingTabIndex(inputRef); return ( - { onFocusInternal(); diff --git a/src/components/views/messages/MessageActionBar.tsx b/src/components/views/messages/MessageActionBar.tsx index 9cf3592208..87b5cb79c4 100644 --- a/src/components/views/messages/MessageActionBar.tsx +++ b/src/components/views/messages/MessageActionBar.tsx @@ -229,22 +229,16 @@ const ReplyInThreadButton: React.FC = ({ mxEvent }) => { } }; + const title = !hasARelation ? _t("action|reply_in_thread") : _t("threads|error_start_thread_existing_relation"); + return ( -
- {!hasARelation - ? _t("action|reply_in_thread") - : _t("threads|error_start_thread_existing_relation")} -
- - } - title={!hasARelation ? _t("action|reply_in_thread") : _t("threads|error_start_thread_existing_relation")} + title={title} onClick={onClick} onContextMenu={onClick} + placement="left" > @@ -509,18 +503,7 @@ export default class MessageActionBar extends React.PureComponent -
- {this.props.isQuoteExpanded - ? _t("timeline|mab|collapse_reply_chain") - : _t("timeline|mab|expand_reply_chain")} -
-
- {_t(ALTERNATE_KEY_NAME[Key.SHIFT]) + " + " + _t("action|click")} -
- - ); + toolbarOpts.push( {this.props.isQuoteExpanded ? : } , diff --git a/src/components/views/pips/WidgetPip.tsx b/src/components/views/pips/WidgetPip.tsx index 4a0d5e6618..2ba9e39e25 100644 --- a/src/components/views/pips/WidgetPip.tsx +++ b/src/components/views/pips/WidgetPip.tsx @@ -34,7 +34,6 @@ import { WidgetType } from "../../../widgets/WidgetType"; import { WidgetMessagingStore } from "../../../stores/widgets/WidgetMessagingStore"; import WidgetUtils from "../../../utils/WidgetUtils"; import { ElementWidgetActions } from "../../../stores/widgets/ElementWidgetActions"; -import { Alignment } from "../elements/Tooltip"; interface Props { widgetId: string; @@ -128,9 +127,9 @@ export const WidgetPip: FC = ({ widgetId, room, viewingRoom, onStartMovin diff --git a/src/components/views/rooms/MessageComposerFormatBar.tsx b/src/components/views/rooms/MessageComposerFormatBar.tsx index 0d737c4001..5893540528 100644 --- a/src/components/views/rooms/MessageComposerFormatBar.tsx +++ b/src/components/views/rooms/MessageComposerFormatBar.tsx @@ -127,16 +127,6 @@ interface IFormatButtonProps { class FormatButton extends React.PureComponent { public render(): React.ReactNode { const className = `mx_MessageComposerFormatBar_button mx_MessageComposerFormatBar_buttonIcon${this.props.icon}`; - let shortcut; - if (this.props.shortcut) { - shortcut =
{this.props.shortcut}
; - } - const tooltip = ( -
-
{this.props.label}
-
{shortcut}
-
- ); // element="button" and type="button" are necessary for the buttons to work on WebKit, // otherwise the text is deselected before onClick can ever be called @@ -145,8 +135,9 @@ class FormatButton extends React.PureComponent { element="button" type="button" onClick={this.props.onClick} + aria-label={this.props.label} title={this.props.label} - tooltip={tooltip} + caption={this.props.shortcut} className={className} /> ); diff --git a/test/components/structures/__snapshots__/RoomView-test.tsx.snap b/test/components/structures/__snapshots__/RoomView-test.tsx.snap index 80d6ac7c74..b6c87aaaef 100644 --- a/test/components/structures/__snapshots__/RoomView-test.tsx.snap +++ b/test/components/structures/__snapshots__/RoomView-test.tsx.snap @@ -397,6 +397,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =