vvzvlad/gitmost
1
0
Fork 0
Code Issues 14 Pull Requests 12 Packages Projects Releases Activity

fix(dictation): drive the recording halo from mic level under reduced-motion

Browse Source 
The live mic-level halo around the stop button was frozen at a constant
scale (1.15) whenever the OS "Reduce motion" setting was on, so it never
reacted to the voice while dictating. Make haloScale unconditional so it
always follows audioLevel (amplitude 0.9), and drop the now-unused
useReducedMotion import and reduceMotion local.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
claude_code
2026-06-21 23:34:07 +03:00
parent ebfb947ba2
commit 0deded342d
1 changed files with 2 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
apps/client/src/features/dictation/components/mic-button.tsx
View File

@@ -1,6 +1,5 @@
import { FC } from "react"; import { FC } from "react";
import { ActionIcon, Loader, Tooltip } from "@mantine/core"; import { ActionIcon, Loader, Tooltip } from "@mantine/core";
import { useReducedMotion } from "@mantine/hooks";
import { IconMicrophone, IconPlayerStopFilled } from "@tabler/icons-react"; import { IconMicrophone, IconPlayerStopFilled } from "@tabler/icons-react";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { useDictation } from "@/features/dictation/hooks/use-dictation"; import { useDictation } from "@/features/dictation/hooks/use-dictation";
@@ -29,12 +28,11 @@ export const MicButton: FC<MicButtonProps> = ({
}) => { }) => {
const { t } = useTranslation(); const { t } = useTranslation();
const { status, start, stop, audioLevel } = useDictation({ onText, onStart }); const { status, start, stop, audioLevel } = useDictation({ onText, onStart });
const reduceMotion = useReducedMotion();
const iconSize = size === "lg" ? 18 : 16; const iconSize = size === "lg" ? 18 : 16;
if (status === "recording") { if (status === "recording") {
// Live volume-driven halo, or a static halo when the user prefers reduced motion. // Live volume-driven halo: the scale follows the current mic level.
const haloScale = reduceMotion ? 1.15 : 1 + Math.min(1, audioLevel) * 0.9; const haloScale = 1 + Math.min(1, audioLevel) * 0.9;
return ( return (
<Tooltip label={t("Stop recording")} withArrow> <Tooltip label={t("Stop recording")} withArrow>
<span className={classes.recordingWrap}> <span className={classes.recordingWrap}>