import { LiveKitRoom, PreJoin, LocalUserChoices, useToken, VideoConference, formatChatMessageLinks, } from '@livekit/components-react'; import { LogLevel, RoomConnectOptions, RoomOptions, VideoPresets } from 'livekit-client'; import type { NextPage } from 'next'; import Head from 'next/head'; import { useRouter } from 'next/router'; import { useMemo, useState } from 'react'; import { DebugMode } from '../../lib/Debug'; import { useServerUrl } from '../../lib/client-utils'; const Home: NextPage = () => { const router = useRouter(); const { name: roomName } = router.query; const [preJoinChoices, setPreJoinChoices] = useState(undefined); return ( <> LiveKit Meet
{roomName && !Array.isArray(roomName) && preJoinChoices ? ( { router.push('/'); }} > ) : (
console.log('error while setting up prejoin', err)} defaults={{ username: '', videoEnabled: true, audioEnabled: true, }} onSubmit={(values) => { console.log('Joining with: ', values); setPreJoinChoices(values); }} >
)}
); }; export default Home; type ActiveRoomProps = { userChoices: LocalUserChoices; roomName: string; region?: string; onLeave?: () => void; }; const ActiveRoom = ({ roomName, userChoices, onLeave }: ActiveRoomProps) => { const token = useToken(process.env.NEXT_PUBLIC_LK_TOKEN_ENDPOINT, roomName, { userInfo: { identity: userChoices.username, name: userChoices.username, }, }); const router = useRouter(); const { region, hq } = router.query; const liveKitUrl = useServerUrl(region as string | undefined); const roomOptions = useMemo((): RoomOptions => { return { videoCaptureDefaults: { deviceId: userChoices.videoDeviceId ?? undefined, resolution: hq === 'true' ? VideoPresets.h2160 : VideoPresets.h720, }, publishDefaults: { videoSimulcastLayers: hq === 'true' ? [VideoPresets.h1080, VideoPresets.h720] : [VideoPresets.h540, VideoPresets.h216], }, audioCaptureDefaults: { deviceId: userChoices.audioDeviceId ?? undefined, }, adaptiveStream: { pixelDensity: 'screen' }, dynacast: true, }; }, [userChoices, hq]); const connectOptions = useMemo((): RoomConnectOptions => { return { autoSubscribe: false, }; }, []); return ( <> {liveKitUrl && ( )} ); };