diff --git a/pages/custom/index.tsx b/pages/custom/index.tsx
index b83bbc8..5f1ee05 100644
--- a/pages/custom/index.tsx
+++ b/pages/custom/index.tsx
@@ -1,3 +1,4 @@
+'use client';
import { formatChatMessageLinks, LiveKitRoom, VideoConference } from '@livekit/components-react';
import {
ExternalE2EEKeyProvider,
diff --git a/pages/rooms/[name].tsx b/pages/rooms/[name].tsx
index 337ea3d..6501323 100644
--- a/pages/rooms/[name].tsx
+++ b/pages/rooms/[name].tsx
@@ -5,11 +5,11 @@ import {
formatChatMessageLinks,
useToken,
LocalUserChoices,
+ PreJoin,
} from '@livekit/components-react';
import {
DeviceUnsupportedError,
ExternalE2EEKeyProvider,
- LogLevel,
Room,
RoomConnectOptions,
RoomOptions,
@@ -19,7 +19,6 @@ import {
} from 'livekit-client';
import type { NextPage } from 'next';
-import dynamic from 'next/dynamic';
import Head from 'next/head';
import { useRouter } from 'next/router';
import * as React from 'react';
@@ -27,13 +26,6 @@ import { DebugMode } from '../../lib/Debug';
import { decodePassphrase, useServerUrl } from '../../lib/client-utils';
import { SettingsMenu } from '../../lib/SettingsMenu';
-const PreJoinNoSSR = dynamic(
- async () => {
- return (await import('@livekit/components-react')).PreJoin;
- },
- { ssr: false },
-);
-
const Home: NextPage = () => {
const router = useRouter();
const { name: roomName } = router.query;
@@ -42,9 +34,24 @@ const Home: NextPage = () => {
undefined,
);
- function handlePreJoinSubmit(values: LocalUserChoices) {
+ const preJoinDefaults = React.useMemo(() => {
+ return {
+ username: '',
+ videoEnabled: true,
+ audioEnabled: true,
+ };
+ }, []);
+
+ const handlePreJoinSubmit = React.useCallback((values: LocalUserChoices) => {
setPreJoinChoices(values);
- }
+ }, []);
+
+ const onPreJoinError = React.useCallback((e: any) => {
+ console.error(e);
+ }, []);
+
+ const onLeave = React.useCallback(() => router.push('/'), []);
+
return (
<>
@@ -57,21 +64,15 @@ const Home: NextPage = () => {
{
- router.push('/');
- }}
+ onLeave={onLeave}
>
) : (
-
console.log('error while setting up prejoin', err)}
- defaults={{
- username: '',
- videoEnabled: true,
- audioEnabled: true,
- }}
+
+ >