rapida-react
Version:
An easy to use react client for building generative ai application using Rapida platform.
1 lines • 3.73 kB
Source Map (JSON)
{"version":3,"sources":["../src/components/live-transcript.tsx"],"sourcesContent":["/*\n * Copyright (c) 2024. Rapida\n *\n * Permission is hereby granted, free of charge, to any person obtaining a copy\n * of this software and associated documentation files (the \"Software\"), to deal\n * in the Software without restriction, including without limitation the rights\n * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell\n * copies of the Software, and to permit persons to whom the Software is\n * furnished to do so, subject to the following conditions:\n *\n * The above copyright notice and this permission notice shall be included in\n * all copies or substantial portions of the Software.\n *\n * THE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\n * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\n * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\n * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\n * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\n * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\n * THE SOFTWARE.\n *\n * Author: Prashant <prashant@rapida.ai>\n *\n */\nimport {\n agentConnectionStateObservable,\n agentServerEventObserver,\n} from \"@/rapida/hooks/observables/voice-agent\";\nimport { AgentServerEvent } from \"@/rapida/events/agent-server-event\";\nimport { useMaybeVoiceAgent } from \"@/rapida/hooks/use-voice-agent\";\nimport { cn } from \"@/rapida/styles\";\nimport React, { FC, HTMLAttributes, useState } from \"react\";\n\n/**\n * agent live transcript props\n */\ninterface AgentLiveTranscriptProps extends HTMLAttributes<HTMLDivElement> {\n placeholder?: string;\n}\n\n/**\n * Agent live audio transcript\n * @param param0\n * @returns\n */\nexport const AgentLiveTranscript: FC<AgentLiveTranscriptProps> = ({\n className,\n placeholder,\n}) => {\n const agentContext = useMaybeVoiceAgent();\n const [connected, setConnected] = useState<boolean>(false);\n const [transcript, setTranscript] = useState(\"\");\n\n React.useEffect(() => {\n const listener = agentConnectionStateObservable(agentContext!).subscribe(\n (x) => {\n setConnected(x.isConnected);\n }\n );\n return () => listener.unsubscribe();\n }, [agentContext]);\n\n //\n React.useEffect(() => {\n const serverEventListner = agentServerEventObserver(\n agentContext!\n ).subscribe((agentEvents) => {\n if (\n agentEvents?.eventType === AgentServerEvent.Transcript ||\n agentEvents?.eventType === AgentServerEvent.Complete\n ) {\n setTranscript(agentEvents.transcript);\n }\n });\n return () => {\n serverEventListner.unsubscribe();\n };\n }, [agentContext]);\n\n return (\n <div className={cn(className)}>\n {!connected ? placeholder : transcript ? transcript : placeholder}\n </div>\n );\n};\n"],"mappings":";;;;;;;;;;AA+BA,OAAO,SAA6B,gBAAgB;AAiDhD;AAnCG,IAAM,sBAAoD,CAAC;AAAA,EAChE;AAAA,EACA;AACF,MAAM;AACJ,QAAM,eAAe,mBAAmB;AACxC,QAAM,CAAC,WAAW,YAAY,IAAI,SAAkB,KAAK;AACzD,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,EAAE;AAE/C,QAAM,UAAU,MAAM;AACpB,UAAM,WAAW,+BAA+B,YAAa,EAAE;AAAA,MAC7D,CAAC,MAAM;AACL,qBAAa,EAAE,WAAW;AAAA,MAC5B;AAAA,IACF;AACA,WAAO,MAAM,SAAS,YAAY;AAAA,EACpC,GAAG,CAAC,YAAY,CAAC;AAGjB,QAAM,UAAU,MAAM;AACpB,UAAM,qBAAqB;AAAA,MACzB;AAAA,IACF,EAAE,UAAU,CAAC,gBAAgB;AAC3B,UACE,aAAa,sDACb,aAAa,gDACb;AACA,sBAAc,YAAY,UAAU;AAAA,MACtC;AAAA,IACF,CAAC;AACD,WAAO,MAAM;AACX,yBAAmB,YAAY;AAAA,IACjC;AAAA,EACF,GAAG,CAAC,YAAY,CAAC;AAEjB,SACE,oBAAC,SAAI,WAAW,GAAG,SAAS,GACzB,WAAC,YAAY,cAAc,aAAa,aAAa,aACxD;AAEJ;","names":[]}