diff --git a/src/frontend/src/features/subtitle/hooks/useSubtitles.tsx b/src/frontend/src/features/subtitle/hooks/useSubtitles.tsx index b93eea47..4a309d0b 100644 --- a/src/frontend/src/features/subtitle/hooks/useSubtitles.tsx +++ b/src/frontend/src/features/subtitle/hooks/useSubtitles.tsx @@ -2,10 +2,14 @@ import { useSnapshot } from 'valtio' import { layoutStore } from '@/stores/layout' import { useStartSubtitle } from '../api/startSubtitle' import { useRoomData } from '@/features/rooms/livekit/hooks/useRoomData' +import { useRoomContext } from '@livekit/components-react' +import { useEffect } from 'react' +import { RoomEvent } from 'livekit-client' export const useSubtitles = () => { const layoutSnap = useSnapshot(layoutStore) + const room = useRoomContext() const apiRoomData = useRoomData() const { mutateAsync: startSubtitleRoom, isPending } = useStartSubtitle() @@ -20,6 +24,18 @@ export const useSubtitles = () => { layoutStore.showSubtitles = !layoutSnap.showSubtitles } + useEffect(() => { + if (!room) return + + const closeSubtitles = () => { + layoutStore.showSubtitles = false + } + room.on(RoomEvent.Disconnected, closeSubtitles) + return () => { + room.off(RoomEvent.Disconnected, closeSubtitles) + } + }, [room]) + return { areSubtitlesOpen: layoutSnap.showSubtitles, toggleSubtitles,