From 8d6e3e95b3a5a6b3fe1738a2f0be79e0b5693760 Mon Sep 17 00:00:00 2001
From: kinou-p <alexpomms@gmail.com>
Date: Sun, 18 Jun 2023 21:45:02 +0200
Subject: [PATCH] little error canvas

---
 containers/react/package-lock.json    | 15 +++++++++------
 containers/react/package.json         |  3 +++
 containers/react/src/pages/canvas.tsx |  5 ++++-
 3 files changed, 16 insertions(+), 7 deletions(-)

diff --git a/containers/react/package-lock.json b/containers/react/package-lock.json
index a0474a11..71a0b93a 100644
--- a/containers/react/package-lock.json
+++ b/containers/react/package-lock.json
@@ -25,6 +25,9 @@
         "styled-components": "^5.3.10",
         "typescript": "^3.2.1",
         "web-vitals": "^2.1.4"
+      },
+      "devDependencies": {
+        "@types/node": "^20.3.1"
       }
     },
     "node_modules/@adobe/css-tools": {
@@ -4535,9 +4538,9 @@
       "integrity": "sha512-YATxVxgRqNH6nHEIsvg6k2Boc1JHI9ZbH5iWFFv/MTkchz3b1ieGDa5T0a9RznNdI0KhVbdbWSN+KWWrQZRxTw=="
     },
     "node_modules/@types/node": {
-      "version": "20.1.4",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.1.4.tgz",
-      "integrity": "sha512-At4pvmIOki8yuwLtd7BNHl3CiWNbtclUbNtScGx4OHfBd4/oWoJC8KRCIxXwkdndzhxOsPXihrsOoydxBjlE9Q=="
+      "version": "20.3.1",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.3.1.tgz",
+      "integrity": "sha512-EhcH/wvidPy1WeML3TtYFGR83UzjxeWRen9V402T8aUGYsCHOmfoisV3ZSg03gAFIbLq8TnWOJ0f4cALtnSEUg=="
     },
     "node_modules/@types/parse-json": {
       "version": "4.0.0",
@@ -24452,9 +24455,9 @@
       "integrity": "sha512-YATxVxgRqNH6nHEIsvg6k2Boc1JHI9ZbH5iWFFv/MTkchz3b1ieGDa5T0a9RznNdI0KhVbdbWSN+KWWrQZRxTw=="
     },
     "@types/node": {
-      "version": "20.1.4",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.1.4.tgz",
-      "integrity": "sha512-At4pvmIOki8yuwLtd7BNHl3CiWNbtclUbNtScGx4OHfBd4/oWoJC8KRCIxXwkdndzhxOsPXihrsOoydxBjlE9Q=="
+      "version": "20.3.1",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.3.1.tgz",
+      "integrity": "sha512-EhcH/wvidPy1WeML3TtYFGR83UzjxeWRen9V402T8aUGYsCHOmfoisV3ZSg03gAFIbLq8TnWOJ0f4cALtnSEUg=="
     },
     "@types/parse-json": {
       "version": "4.0.0",
diff --git a/containers/react/package.json b/containers/react/package.json
index 0f333105..f0205289 100644
--- a/containers/react/package.json
+++ b/containers/react/package.json
@@ -45,5 +45,8 @@
       "last 1 firefox version",
       "last 1 safari version"
     ]
+  },
+  "devDependencies": {
+    "@types/node": "^20.3.1"
   }
 }
diff --git a/containers/react/src/pages/canvas.tsx b/containers/react/src/pages/canvas.tsx
index 857d582d..6ff0f0a3 100644
--- a/containers/react/src/pages/canvas.tsx
+++ b/containers/react/src/pages/canvas.tsx
@@ -28,7 +28,10 @@ function DrawCanvas(option) {
 	const socket = io('http://' + process.env.REACT_APP_BASE_URL + ':4000');
 	// const socket = socketRef.current
 	console.log("start function");
-	const canvas = document.getElementById('myCanvas');
+	
+	let canvas;
+	canvas = document.getElementById('myCanvas');
+
 	const ctx = canvas.getContext('2d');
 	
 	// useEffect(() => {