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

Add voice broadcast device selection tooltip (#9726)

Browse source
This commit is contained in:
Michael Weimann 2022-12-08 15:27:32 +01:00 • committed by GitHub
parent 95ac957fa4
commit 1b6d753cfe
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 56 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

6
src/voice-broadcast/components/atoms/VoiceBroadcastHeader.tsx
View file

@ -26,6 +26,7 @@ import { Icon as XIcon } from "../../../../res/img/element-icons/cancel-rounded.
import Clock from "../../../components/views/audio_messages/Clock";
import { formatTimeLeft } from "../../../DateUtils";
import Spinner from "../../../components/views/elements/Spinner";
import AccessibleTooltipButton from "../../../components/views/elements/AccessibleTooltipButton";
interface VoiceBroadcastHeaderProps {
live?: VoiceBroadcastLiveness;
@ -87,13 +88,14 @@ export const VoiceBroadcastHeader: React.FC<VoiceBroadcastHeaderProps> = ({
});
const microphoneLine = microphoneLabel && (
<div
<AccessibleTooltipButton
className={microphoneLineClasses}
onClick={onMicrophoneLineClick}
title={_t("Change input device")}
>
<MicrophoneIcon className="mx_Icon mx_Icon_16" />
<span>{ microphoneLabel }</span>
</div>
</AccessibleTooltipButton>
);
return <div className="mx_VoiceBroadcastHeader">

8
src/voice-broadcast/components/molecules/VoiceBroadcastRecordingPip.tsx
View file

@ -28,9 +28,9 @@ import { Icon as PauseIcon } from "../../../../res/img/element-icons/pause.svg";
import { Icon as RecordIcon } from "../../../../res/img/element-icons/Record.svg";
import { Icon as MicrophoneIcon } from "../../../../res/img/element-icons/Mic.svg";
import { _t } from "../../../languageHandler";
import AccessibleButton from "../../../components/views/elements/AccessibleButton";
import { useAudioDeviceSelection } from "../../../hooks/useAudioDeviceSelection";
import { DevicesContextMenu } from "../../../components/views/audio_messages/DevicesContextMenu";
import AccessibleTooltipButton from "../../../components/views/elements/AccessibleTooltipButton";
interface VoiceBroadcastRecordingPipProps {
recording: VoiceBroadcastRecording;
@ -91,12 +91,12 @@ export const VoiceBroadcastRecordingPip: React.FC<VoiceBroadcastRecordingPipProp
<hr className="mx_VoiceBroadcastBody_divider" />
<div className="mx_VoiceBroadcastBody_controls">
{ toggleControl }
<AccessibleButton
aria-label={_t("Change input device")}
<AccessibleTooltipButton
onClick={() => setShowDeviceSelect(true)}
title={_t("Change input device")}
>
<MicrophoneIcon className="mx_Icon mx_Icon_16 mx_Icon_alert" />
</AccessibleButton>
</AccessibleTooltipButton>
<VoiceBroadcastControl
icon={StopIcon}
label="Stop Recording"