mirror of
https://github.com/danny-avila/LibreChat.git
synced 2025-12-26 13:18:51 +01:00
* WIP: message audio refactor * WIP: use MessageAudio by provider * fix: Update MessageAudio component to use TTSEndpoints enum * feat: Update useTextToSpeechBrowser hook to handle errors and improve error logging * feat: Add voice dropdown components for different TTS engines * docs: update incorrect `voices` example changed `voice: ''` to `voices: ['alloy']` * feat: Add brwoser support check for Edge TTS engine component with error toast if not supported --------- Co-authored-by: Marco Beretta <81851188+berry-13@users.noreply.github.com>
22 lines
699 B
TypeScript
22 lines
699 B
TypeScript
// client/src/components/Chat/Messages/MessageAudio.tsx
|
|
import { memo } from 'react';
|
|
import { useRecoilValue } from 'recoil';
|
|
import type { TMessageAudio } from '~/common';
|
|
import { BrowserTTS, EdgeTTS, ExternalTTS } from '~/components/Audio/TTS';
|
|
import { TTSEndpoints } from '~/common';
|
|
import store from '~/store';
|
|
|
|
function MessageAudio(props: TMessageAudio) {
|
|
const engineTTS = useRecoilValue<string>(store.engineTTS);
|
|
|
|
const TTSComponents = {
|
|
[TTSEndpoints.edge]: EdgeTTS,
|
|
[TTSEndpoints.browser]: BrowserTTS,
|
|
[TTSEndpoints.external]: ExternalTTS,
|
|
};
|
|
|
|
const SelectedTTS = TTSComponents[engineTTS];
|
|
return <SelectedTTS {...props} />;
|
|
}
|
|
|
|
export default memo(MessageAudio);
|