From 3955f940e27647c722861cc18787c96e191d9509 Mon Sep 17 00:00:00 2001
From: sorrelbri <sorrel.bri.june@gmail.com>
Date: Sun, 21 Jun 2020 18:20:03 -0700
Subject: [PATCH] stub Menu, add showMenu value to Game

---
 packages/play-node-go/src/components/GameUI/Kifu/Kifu.js | 8 ++------
 .../play-node-go/src/components/GameUI/Kifu/Kifu.scss    | 1 +
 packages/play-node-go/src/components/GameUI/Menu/Menu.js | 7 +++++++
 .../play-node-go/src/components/GameUI/Menu/Menu.scss    | 0
 packages/play-node-go/src/pages/Game/Game.js             | 9 ++++++++-
 5 files changed, 18 insertions(+), 7 deletions(-)
 create mode 100644 packages/play-node-go/src/components/GameUI/Menu/Menu.js
 create mode 100644 packages/play-node-go/src/components/GameUI/Menu/Menu.scss

diff --git a/packages/play-node-go/src/components/GameUI/Kifu/Kifu.js b/packages/play-node-go/src/components/GameUI/Kifu/Kifu.js
index 20855b3..c1a8e5c 100644
--- a/packages/play-node-go/src/components/GameUI/Kifu/Kifu.js
+++ b/packages/play-node-go/src/components/GameUI/Kifu/Kifu.js
@@ -1,14 +1,10 @@
 import React from "react";
 import "./Kifu.scss";
 
-const Kifu = () => {
-  const handleClick = (e) => {
-    console.log("clicked");
-  };
-
+const Kifu = ({ clickKifu }) => {
   return (
     <div className="Kifu">
-      <p className="Kifu__show-menu" onClick={handleClick}>
+      <p className="Kifu__show-menu" onClick={clickKifu}>
         Show Menu?
       </p>
       <div className="Kifu__board"></div>
diff --git a/packages/play-node-go/src/components/GameUI/Kifu/Kifu.scss b/packages/play-node-go/src/components/GameUI/Kifu/Kifu.scss
index debafbe..8d8c141 100644
--- a/packages/play-node-go/src/components/GameUI/Kifu/Kifu.scss
+++ b/packages/play-node-go/src/components/GameUI/Kifu/Kifu.scss
@@ -9,6 +9,7 @@ div.Kifu {
 
   p.Kifu__show-menu {
     display: none;
+    margin: 3vh auto;
     position: absolute;
     transform: rotate(20deg);
     width: fit-content;
diff --git a/packages/play-node-go/src/components/GameUI/Menu/Menu.js b/packages/play-node-go/src/components/GameUI/Menu/Menu.js
new file mode 100644
index 0000000..2a34590
--- /dev/null
+++ b/packages/play-node-go/src/components/GameUI/Menu/Menu.js
@@ -0,0 +1,7 @@
+import React from "react";
+
+const Menu = ({ ...props }) => {
+  return <></>;
+};
+
+export default Menu;
diff --git a/packages/play-node-go/src/components/GameUI/Menu/Menu.scss b/packages/play-node-go/src/components/GameUI/Menu/Menu.scss
new file mode 100644
index 0000000..e69de29
diff --git a/packages/play-node-go/src/pages/Game/Game.js b/packages/play-node-go/src/pages/Game/Game.js
index fab84af..a7abdf8 100644
--- a/packages/play-node-go/src/pages/Game/Game.js
+++ b/packages/play-node-go/src/pages/Game/Game.js
@@ -6,12 +6,14 @@ import Logo from "../../components/Display/Logo/Logo";
 import Board from "../../components/GameUI/Board/Board";
 import PlayerArea from "../../components/GameUI/PlayerArea/PlayerArea";
 import Kifu from "../../components/GameUI/Kifu/Kifu";
+import Menu from "../../components/GameUI/Menu/Menu";
 
 const Game = (props) => {
   const { state, dispatch } = props;
   const gameId = parseInt(useParams().id) || 0;
   const [playerBlackMeta, setPlayerBlackMeta] = useState({});
   const [playerWhiteMeta, setPlayerWhiteMeta] = useState({});
+  const [showMenu, setShowMenu] = useState(false);
   const playerState = state?.meta?.playerState;
   const game = state.active?.game;
 
@@ -91,6 +93,11 @@ const Game = (props) => {
 
   return (
     <div className="Game" data-testid="Game">
+      <Menu
+        showMenu={showMenu}
+        clickClose={() => setShowMenu(false)}
+        {...props}
+      />
       <div className="Game__meta-container">
         <span className="Game__socket-flag">{state.socket ? "✓" : " ⃠"}</span>
         <Logo />
@@ -140,7 +147,7 @@ const Game = (props) => {
               ? playerWhiteMeta
               : playerBlackMeta
           }
-          Kifu={<Kifu />}
+          Kifu={<Kifu clickKifu={() => setShowMenu(true)} />}
           turn={state?.meta?.turn}
         />
       </div>