From 6f96842a87edbf4c2017e3b97d06d99e04914446 Mon Sep 17 00:00:00 2001
From: Halit Aksoy <jhalitaksoy@gmail.com>
Date: Sat, 9 Jul 2022 13:12:22 +0300
Subject: [PATCH] fix user turn issue in infopanel

---
 src/components/InfoPanel.tsx | 61 ++++++++++++++++++++----------------
 1 file changed, 34 insertions(+), 27 deletions(-)

diff --git a/src/components/InfoPanel.tsx b/src/components/InfoPanel.tsx
index 88187ad..f91c9b3 100644
--- a/src/components/InfoPanel.tsx
+++ b/src/components/InfoPanel.tsx
@@ -41,9 +41,11 @@ function getInfoPanelTextByGameState(params: {
     }
     return context.texts.GameEnded + " " + whoWon;
   } else {
-    return game?.checkIsPlayerTurn(userKey)
-      ? context.texts.YourTurn
-      : context.texts.OpponentTurn;
+    if (game) {
+      return game.checkIsPlayerTurn(userKey)
+        ? context.texts.YourTurn
+        : context.texts.OpponentTurn;
+    }
   }
   return undefined;
 }
@@ -81,29 +83,34 @@ const InfoPanel: FunctionComponent<{
   userKeyWhoLeave,
   searchingOpponent,
 }) => {
-  const isUserTurn = game?.checkIsPlayerTurn(userKey);
-  const containerColor = isUserTurn
-    ? context.themeManager.theme.playerTurnColor
-    : context.themeManager.theme.holeColor;
-  const textColor = getColorByLuminance(
-    containerColor,
-    context.themeManager.theme.primary,
-    context.themeManager.theme.primaryLight
-  );
-  return (
-    <InfoPanelContainer context={context} color={containerColor}>
-      <h4 style={{ margin: "0", color: textColor }}>
-        {getInfoPanelTextByGameState({
-          context,
-          game,
-          crashMessage,
-          userKey,
-          userKeyWhoLeave,
-          searchingOpponent,
-        })}
-      </h4>
-    </InfoPanelContainer>
-  );
-};
+    const isUserTurn = game?.checkIsPlayerTurn(userKey);
+    const containerColor = isUserTurn
+      ? context.themeManager.theme.playerTurnColor
+      : context.themeManager.theme.holeColor;
+    const textColor = getColorByLuminance(
+      containerColor,
+      context.themeManager.theme.primary,
+      context.themeManager.theme.primaryLight
+    );
+    const text = getInfoPanelTextByGameState({
+      context,
+      game,
+      crashMessage,
+      userKey,
+      userKeyWhoLeave,
+      searchingOpponent,
+    });
+    if (text) {
+      return (
+        <InfoPanelContainer context={context} color={containerColor}>
+          <h4 style={{ margin: "0", color: textColor }}>
+            {text}
+          </h4>
+        </InfoPanelContainer>
+      );
+    } else {
+      return (<div></div>)
+    }
+  };
 
 export default InfoPanel;