diff --git a/src/App.tsx b/src/App.tsx index 8dcc3ded0..500cd2d28 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -20,6 +20,7 @@ import { Stream } from './components/Stream' import ModalContainer from 'react-modal-promise' import { EngineCommandManager } from './lang/std/engineConnection' import { isOverlap } from './lib/utils' +import { SetToken } from './components/TokenInput' export function App() { const cam = useRef() @@ -46,6 +47,7 @@ export function App() { setMediaStream, setIsStreamReady, isStreamReady, + token, } = useStore((s) => ({ editorView: s.editorView, setEditorView: s.setEditorView, @@ -71,6 +73,7 @@ export function App() { setMediaStream: s.setMediaStream, isStreamReady: s.isStreamReady, setIsStreamReady: s.setIsStreamReady, + token: s.token })) // const onChange = React.useCallback((value: string, viewUpdate: ViewUpdate) => { const onChange = (value: string, viewUpdate: ViewUpdate) => { @@ -135,15 +138,18 @@ export function App() { codeBasedSelections, }) } - const engineCommandManager = useMemo(() => new EngineCommandManager({ - setMediaStream, - setIsStreamReady, - }), []) + const engineCommandManager = useMemo(() => { + return new EngineCommandManager({ + setMediaStream, + setIsStreamReady, + token, + }) + }, [token]) useEffect(() => { return () => { - engineCommandManager.tearDown() + engineCommandManager?.tearDown() } - }, []) + }, [engineCommandManager]) useEffect(() => { if (!isStreamReady) return @@ -249,7 +255,9 @@ export function App() {
- + + +
{/*