rzerres/element-call
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Invert the microphone and video button states

Browse Source 
… so that they use the 'on' state when muted, and announce the action that they take rather than the current state, as suggested in internal design guidance.
This commit is contained in:
Robin
2023-09-18 11:17:15 -04:00
parent d1e5a3043f
commit 282c345ad3
2 changed files with 8 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/button/Button.tsx
View File

@@ -145,11 +145,11 @@ export function MicButton({
}) {
const { t } = useTranslation();
const Icon = muted ? MicOffSolidIcon : MicOnSolidIcon;
const label = muted ? t("Microphone off") : t("Microphone on");
const label = muted ? t("Unmute microphone") : t("Mute microphone");
return (
<Tooltip label={label}>
<Button variant="toolbar" {...rest} on={!muted}>
<Button variant="toolbar" {...rest} on={muted}>
<Icon aria-label={label} />
</Button>
</Tooltip>
@@ -166,11 +166,11 @@ export function VideoButton({
}) {
const { t } = useTranslation();
const Icon = muted ? VideoCallOffIcon : VideoCallIcon;
const label = muted ? t("Video off") : t("Video on");
const label = muted ? t("Start video") : t("Stop video");
return (
<Tooltip label={label}>
<Button variant="toolbar" {...rest} on={!muted}>
<Button variant="toolbar" {...rest} on={muted}>
<Icon aria-label={label} />
</Button>
</Tooltip>