FLASHback1/bingo
0
1import React, { useEffect } from 'react'2import { useSetAtom } from 'jotai'3import { useBing } from '@/lib/hooks/use-bing'4import Image from 'next/image'5import VoiceIcon from '@/assets/images/voice.svg'6import VoiceButton from './ui/voice'7import { SR } from '@/lib/bots/bing/sr'8import { voiceListenAtom } from '@/state'9 10const sr = new SR(['发送', '清空', '退出'])11 12const Voice = ({ setInput, input, sendMessage, isSpeaking }: Pick<ReturnType<typeof useBing>, 'setInput' | 'sendMessage' | 'input' | 'isSpeaking'>) => {13 const setListen = useSetAtom(voiceListenAtom)14 useEffect(() => {15 if (sr.listening) return16 sr.transcript = !isSpeaking17 }, [isSpeaking])18 19 useEffect(() => {20 sr.onchange = (msg: string, command?: string) => {21 switch (command) {22 case '退出':23 sr.stop()24 break;25 case '发送':26 sendMessage(input)27 case '清空':28 setInput('')29 break;30 default:31 setInput(input + msg)32 }33 }34 }, [input])35 36 const switchSR = (enable: boolean = false) => {37 setListen(enable)38 if (enable) {39 sr.start()40 } else {41 sr.stop()42 }43 }44 45 return sr.listening ? (46 <VoiceButton onClick={() => switchSR(false)} />47 ) : (48 <Image alt="start voice" src={VoiceIcon} width={24} className="-mt-0.5" onClick={() => switchSR(true)} />49 )50};51 52export default Voice;53 