/
app.tsx
27 lines (24 loc) · 876 Bytes
/
app.tsx
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
import { VideoStream } from './components/video-stream.js';
import { ConnectForm } from './components/connect-form.js';
import { MotionArrows } from './components/motion-arrows.js';
import { useStore, useStream } from './state.js';
import { useMotionControls } from './motion.js';
export const App = (): JSX.Element => {
const { status, connectOrDisconnect, streamClient, baseClient } = useStore();
const stream = useStream(streamClient, 'cam');
const [motionState, requestMotion] = useMotionControls(baseClient);
// console.log(motionControls);
return (
<>
<ConnectForm status={status} onSubmit={connectOrDisconnect} />
<VideoStream stream={stream}>
{baseClient ? (
<MotionArrows
motionState={motionState}
requestMotion={requestMotion}
/>
) : null}
</VideoStream>
</>
);
};