Trying to implement camera to game part2

src/components/AiCamera.js

@@ -11,8 +11,6 @@ function AiCamera()  {
   const [model, setModel] = useState(null)
   const [results, setResult] = useState([])
   const [userWebCam, setUserWebCam] = useState(null)
-  const [predict, setPredict] = useState({className: "default"})
-
 
   const loadModel = async () => {
     const modelURL = URL + 'model.json'
@@ -21,21 +19,30 @@ function AiCamera()  {
     setModel(model)
   }
 
+  // webcam is compared to model
   async function predictVideo(image) {
 		if (model) {
 			const prediction = await model.predict(image, 4)
-      console.log(prediction)
       setResult(prediction)
+      analyzeMove()
       predictVideo(userWebCam)
 		}
 	}
 
-  // load the model (only once as component is mounted)
+  // registers players mark and plays a turn
+  async function analyzeMove() {
+    this.props.updateMatch({
+      userChoice: results[0].className
+      }
+    )
+  }
+
+  // loaded once when component is mounted
   useEffect(() => {
     loadModel()
   }, [])
 
-  // load the video (only once as component is mounted)
+  // loaded once when component is mounted
   useEffect(() => {
 		try {
 			const video = loadVideo(document.getElementById('userWebCam'))
@@ -47,7 +54,7 @@ function AiCamera()  {
 		}
 	}, [])
 
-  // make prediction (as userWebCam and model is set)
+  // check webcam is on and start prediction loop
 	useEffect(() => {
 		if (userWebCam) {
 			predictVideo(userWebCam)

src/components/GameUI.js

@@ -34,7 +34,7 @@ class GameUI extends Component {
         this.props.updateMatch({
           result: "draw"
         })
-        break;
+        break
 
       case "RockScissors":
       case "ScissorsPaper":
@@ -43,7 +43,7 @@ class GameUI extends Component {
         this.props.updateMatch({
           result: "win"
         })
-        break;
+        break
 
       case "ScissorsRock":
       case "PaperScissors":
@@ -52,7 +52,7 @@ class GameUI extends Component {
         this.props.updateMatch({
           result: "lose"
         })
-        break;
+        break
     }
   }
   render() {

src/context/GameContext.js

-import React, { Component } from "react"
-const { Provider, Consumer } = React.createContext()
-
-class GameContextProvider extends Component {
-  render() {
-    return <Provider value={"Predicts"}>{this.props.children}</Provider>
-  }
-}
-
-export { GameContextProvider, Consumer as GameContextConsumer }