From 04b23ea2243e75e34a4f2d2f28a411710ef99931 Mon Sep 17 00:00:00 2001
From: Mathias Wagner <germannewsmaker@gmail.com>
Date: Mon, 20 Nov 2023 21:38:07 +0100
Subject: [PATCH] Updated the Code.jsx

---
 client/src/pages/Join/states/Code/Code.jsx | 15 ++++++++++++---
 1 file changed, 12 insertions(+), 3 deletions(-)

diff --git a/client/src/pages/Join/states/Code/Code.jsx b/client/src/pages/Join/states/Code/Code.jsx
index d3c940b..340c0cb 100644
--- a/client/src/pages/Join/states/Code/Code.jsx
+++ b/client/src/pages/Join/states/Code/Code.jsx
@@ -13,6 +13,15 @@ export const Code = ({setState}) => {
     const [code, setCode] = useState(params.code || "");
     const [company, setCompany] = useState("");
 
+    const updateCompany = (event) => {
+        if (event.target.value.length > 20) {
+            setError("Name zu lang");
+            return;
+        }
+
+        setCompany(event.target.value);
+    }
+
     const [error, setError] = useState("");
 
     const joinRoom = () => {
@@ -37,7 +46,7 @@ export const Code = ({setState}) => {
     return (
         <>
             {error && <div className="error">
-                <FontAwesomeIcon icon={faWarning} />
+                <FontAwesomeIcon icon={faWarning}/>
                 <p>{error}</p>
             </div>}
             <div className="input-area">
@@ -48,9 +57,9 @@ export const Code = ({setState}) => {
             <div className="input-area">
                 <h3>Name des Unternehmens</h3>
                 <input type="text" placeholder="Name des Unternehmens" className="glassy"
-                       onChange={(e) => setCompany(e.target.value)} value={company}/>
+                       onChange={updateCompany} value={company}/>
             </div>
-            <Button text="Beitreten" onClick={joinRoom} icon={faRightToBracket} />
+            <Button text="Beitreten" onClick={joinRoom} icon={faRightToBracket}/>
         </>
     )
 }
\ No newline at end of file