Try metadata as direct effect dependency (#13)

This commit is contained in:
lukasIO 2024-01-23 18:47:22 +01:00 committed by GitHub
parent 4aa342a1c7
commit 6f0cd438c6
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -20,16 +20,15 @@ import {
useChat, useChat,
useConnectionState, useConnectionState,
useDataChannel, useDataChannel,
useEnsureRoom,
useLocalParticipant, useLocalParticipant,
useParticipantInfo,
useRemoteParticipant,
useRemoteParticipants, useRemoteParticipants,
useTracks, useTracks,
} from "@livekit/components-react"; } from "@livekit/components-react";
import { import {
ConnectionState, ConnectionState,
LocalParticipant, LocalParticipant,
ParticipantEvent,
RemoteParticipant,
RoomEvent, RoomEvent,
Track, Track,
} from "livekit-client"; } from "livekit-client";
@ -79,11 +78,12 @@ export default function Playground({
const [messages, setMessages] = useState<ChatMessageType[]>([]); const [messages, setMessages] = useState<ChatMessageType[]>([]);
const [transcripts, setTranscripts] = useState<ChatMessageType[]>([]); const [transcripts, setTranscripts] = useState<ChatMessageType[]>([]);
const { localParticipant } = useLocalParticipant(); const { localParticipant } = useLocalParticipant();
const room = useEnsureRoom();
const participants = useRemoteParticipants({ const participants = useRemoteParticipants({
updateOnlyOn: [RoomEvent.ParticipantMetadataChanged], updateOnlyOn: [RoomEvent.ParticipantMetadataChanged],
}); });
const agentParticipant = participants.find((p) => p.isAgent); const agentParticipant = participants.find((p) => p.isAgent);
const { send: sendChat, chatMessages } = useChat(); const { send: sendChat, chatMessages } = useChat();
const visualizerState = useMemo(() => { const visualizerState = useMemo(() => {
if (agentState === "thinking") { if (agentState === "thinking") {
@ -130,10 +130,10 @@ export default function Playground({
); );
useEffect(() => { useEffect(() => {
if (!agentParticipant || !room) { if (!agentParticipant) {
setAgentState("offline");
return; return;
} }
const metadataChanged = () => {
let agentMd: any = {}; let agentMd: any = {};
if (agentParticipant.metadata) { if (agentParticipant.metadata) {
agentMd = JSON.parse(agentParticipant.metadata); agentMd = JSON.parse(agentParticipant.metadata);
@ -143,25 +143,7 @@ export default function Playground({
} else { } else {
setAgentState("starting"); setAgentState("starting");
} }
}; }, [agentParticipant, agentParticipant?.metadata]);
const disconnected = (p: RemoteParticipant) => {
if (agentParticipant.identity === p.identity) {
setAgentState("offline");
}
};
agentParticipant.on(
ParticipantEvent.ParticipantMetadataChanged,
metadataChanged
);
room.on(RoomEvent.ParticipantDisconnected, disconnected);
return () => {
agentParticipant.off(
ParticipantEvent.ParticipantMetadataChanged,
metadataChanged
);
room.off(RoomEvent.ParticipantDisconnected, disconnected);
};
}, [agentParticipant, room]);
const isAgentConnected = agentState !== "offline"; const isAgentConnected = agentState !== "offline";