src/main/webapp/src/pages/competition/editor/CMTMatchPanel.jsx

@@ -263,7 +263,7 @@ function MatchList({matches, cat, menuActions}) {
             </table>
         </div>
 
-        {activeMatch && <LoadingProvider><ScorePanel matchId={activeMatch} match={match} menuActions={menuActions}/></LoadingProvider>}
+        {activeMatch && <LoadingProvider><ScorePanel matchId={activeMatch} matchs={matches} match={match} menuActions={menuActions}/></LoadingProvider>}
     </>
 }
 
@@ -335,21 +335,21 @@ function BuildTree({treeData, matches, menuActions}) {
         </div>
 
         {currentMatch?.matchSelect &&
-            <LoadingProvider><ScorePanel matchId={currentMatch?.matchSelect} match={match} menuActions={menuActions}/></LoadingProvider>}
+            <LoadingProvider><ScorePanel matchId={currentMatch?.matchSelect} matchs={matches} match={match} menuActions={menuActions}/></LoadingProvider>}
     </div>
 }
 
-function ScorePanel({matchId, match, menuActions}) {
+function ScorePanel({matchId, matchs, match, menuActions}) {
     const onClickVoid = useRef(() => {
     });
 
     return <div className="row" onClick={onClickVoid.current}>
-        <ScorePanel_ matchId={matchId} match={match} menuActions={menuActions} onClickVoid_={onClickVoid}/>
+        <ScorePanel_ matchId={matchId} matchs={matchs} match={match} menuActions={menuActions} onClickVoid_={onClickVoid}/>
         <CardPanel matchId={matchId} match={match}/>
     </div>
 }
 
-function ScorePanel_({matchId, match, menuActions, onClickVoid_}) {
+function ScorePanel_({matchId, matchs, match, menuActions, onClickVoid_}) {
     const {sendRequest} = useWS()
     const setLoading = useLoadingSwitcher()
 
@@ -359,6 +359,11 @@ function ScorePanel_({matchId, match, menuActions, onClickVoid_}) {
     const tableRef = useRef(null)
     const scoreRef = useRef([])
     const lastScoreClick = useRef(null)
+    const scoreInRef = useRef(null)
+
+    useEffect(() => {
+        scoreInRef.current = scoreIn;
+    }, [scoreIn]);
 
     useEffect(() => {
         menuActions.current.saveScore = (scoreRed, scoreBlue) => {
@@ -407,9 +412,12 @@ function ScorePanel_({matchId, match, menuActions, onClickVoid_}) {
             const {matchId, round, comb} = lastScoreClick.current;
             lastScoreClick.current = null;
 
-            const scoreIn_ = String(scoreIn).trim() === "" ? -1000 : Number(scoreIn);
+            const scoreIn_ = String(scoreInRef.current).trim() === "" ? -1000 : Number(scoreInRef.current);
+
+            const score = matchs.find(m => m.id === matchId).scores.find(s => s.n_round === round);
+
+            console.log("Updating score", matchId, round, comb, scoreIn_, score);
 
-            const score = match.scores.find(s => s.n_round === round);
             let newScore;
             if (score) {
                 if (comb === 1)
@@ -478,6 +486,18 @@ function ScorePanel_({matchId, match, menuActions, onClickVoid_}) {
         setEnd(match.end);
     }, [match]);
 
+    useEffect(() => {
+        const handleClickOutside = (event) => {
+            if (inputRef.current && !inputRef.current.contains(event.target)) {
+                onClickVoid();
+            }
+        };
+        document.addEventListener("mousedown", handleClickOutside);
+        return () => {
+            document.removeEventListener("mousedown", handleClickOutside);
+        };
+    }, []);
+
     const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]')
     const o = [...tooltipTriggerList]
     o.map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl))