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() {
-
+
+
+
{/*