Yahya Alhinai
55 lines
1.3 KiB
TypeScript
55 lines
1.3 KiB
TypeScript
'use client';
|
|
|
|
import { AnimatePresence, motion } from 'motion/react';
|
|
import { useSessionContext } from '@livekit/components-react';
|
|
import type { AppConfig } from '@/app-config';
|
|
import { SessionView } from '@/components/app/session-view';
|
|
import { WelcomeView } from '@/components/app/welcome-view';
|
|
|
|
const MotionWelcomeView = motion.create(WelcomeView);
|
|
const MotionSessionView = motion.create(SessionView);
|
|
|
|
const VIEW_MOTION_PROPS = {
|
|
variants: {
|
|
visible: {
|
|
opacity: 1,
|
|
},
|
|
hidden: {
|
|
opacity: 0,
|
|
},
|
|
},
|
|
initial: 'hidden',
|
|
animate: 'visible',
|
|
exit: 'hidden',
|
|
transition: {
|
|
duration: 0.5,
|
|
ease: 'linear',
|
|
},
|
|
};
|
|
|
|
interface ViewControllerProps {
|
|
appConfig: AppConfig;
|
|
}
|
|
|
|
export function ViewController({ appConfig }: ViewControllerProps) {
|
|
const { isConnected, start } = useSessionContext();
|
|
|
|
return (
|
|
<AnimatePresence mode="wait">
|
|
{/* Welcome view */}
|
|
{!isConnected && (
|
|
<MotionWelcomeView
|
|
key="welcome"
|
|
{...VIEW_MOTION_PROPS}
|
|
startButtonText={appConfig.startButtonText}
|
|
onStartCall={start}
|
|
/>
|
|
)}
|
|
{/* Session view */}
|
|
{isConnected && (
|
|
<MotionSessionView key="session-view" {...VIEW_MOTION_PROPS} appConfig={appConfig} />
|
|
)}
|
|
</AnimatePresence>
|
|
);
|
|
}
|