พบพนักงานต้อนรับ ที่ไม่เคยเลิกงาน

 1import { KhaveeProvider, VRMAvatar, useRealtime } from '@khaveeai/react'
 2import { Canvas } from '@react-three/fiber'
 3
 4export function Reception({ provider }) {
 5  return (
 6    <KhaveeProvider config={{ realtime: provider }}>
 7      <Canvas camera={{ position: [0, 1.3, 3], fov: 30 }}>
 8        <VRMAvatar
 9          src="/models/nongkhavee.vrm"
10          animations={{ base: '/animations/idle.fbx', talk_1: '/animations/talk.fbx' }}
11        />
12      </Canvas>
13      <Desk />
14    </KhaveeProvider>
15  )
16}
17
18function Desk() {
19  const { connect, sendMessage, chatStatus } = useRealtime()
20  return <button onClick={connect}>{chatStatus}</button>
21}