diff --git a/apps/desktop/src/components/AttachmentAudio.tsx b/apps/desktop/src/components/AttachmentAudio.tsx index cd6c099..4ee7a65 100644 --- a/apps/desktop/src/components/AttachmentAudio.tsx +++ b/apps/desktop/src/components/AttachmentAudio.tsx @@ -2,6 +2,7 @@ import { type AttachmentHandle, downloadAndDecryptAttachment } from '@chat-app/s import { useEffect, useMemo, useRef, useState } from 'react'; import { getCachedAttachment, putCachedAttachment } from '../lib/attachmentCache'; +import { getVoiceSpeed, setVoiceSpeed, VOICE_SPEEDS, type VoiceSpeed } from '../lib/voiceSpeedSettings'; import { supabase } from '../lib/supabase'; import { AlertIcon, MicIcon, SpinnerIcon } from './icons'; @@ -23,6 +24,7 @@ export function AttachmentAudio({ handle }: Props) { const [duration, setDuration] = useState(0); const [position, setPosition] = useState(0); const [playing, setPlaying] = useState(false); + const [speed, setSpeed] = useState(() => getVoiceSpeed()); const audioRef = useRef(null); useEffect(() => { @@ -105,6 +107,12 @@ export function AttachmentAudio({ handle }: Props) { }; }, [arrayBuf]); + useEffect(() => { + const el = audioRef.current; + if (!el) return; + el.playbackRate = speed; + }, [speed, blobUrl]); + const fallbackPeaks = useMemo( () => (peaks ? null : Array.from({ length: BAR_COUNT }, () => 0.5)), [peaks], @@ -154,6 +162,29 @@ export function AttachmentAudio({ handle }: Props) { )} +
+ {VOICE_SPEEDS.map((s) => { + const active = s === speed; + return ( + + ); + })} +