From 4b2ebbde7d695eabaac49ef443f3d474d58e8363 Mon Sep 17 00:00:00 2001
From: Yichuan Shen <shen.yichuan@gmail.com>
Date: Sun, 1 Mar 2020 13:42:14 +0100
Subject: [PATCH] Ability to hide winrate graph

Close #608
---
 src/components/App.js                   |  1 +
 src/components/Sidebar.js               | 17 +++++++++++------
 src/components/sidebars/WinrateGraph.js |  1 -
 src/menu.js                             | 12 ++++++++++++
 src/modules/sabaki.js                   |  1 +
 src/setting.js                          |  1 +
 6 files changed, 26 insertions(+), 7 deletions(-)

diff --git a/src/components/App.js b/src/components/App.js
index 619727bde..22d17fa08 100644
--- a/src/components/App.js
+++ b/src/components/App.js
@@ -333,6 +333,7 @@ class App extends Component {
         showMoveColorization: state.showMoveColorization,
         showNextMoves: state.showNextMoves,
         showSiblings: state.showSiblings,
+        showWinrateGraph: state.showWinrateGraph,
         showGameGraph: state.showGameGraph,
         showCommentBox: state.showCommentBox,
         showLeftSidebar: state.showLeftSidebar,
diff --git a/src/components/Sidebar.js b/src/components/Sidebar.js
index 51be48316..2d05b289c 100644
--- a/src/components/Sidebar.js
+++ b/src/components/Sidebar.js
@@ -87,10 +87,10 @@ export default class Sidebar extends Component {
     )
   }
 
-  componentDidUpdate(_, {winrateData}) {
+  componentDidUpdate(_, {winrateGraphHeight, showWinrateGraph}) {
     if (
-      winrateData.some(x => x != null) !==
-      this.state.winrateData.some(x => x != null)
+      winrateGraphHeight !== this.state.winrateGraphHeight ||
+      showWinrateGraph !== this.state.showWinrateGraph
     ) {
       this.gameGraph.remeasure()
     }
@@ -103,6 +103,7 @@ export default class Sidebar extends Component {
       gameTree,
       gameCurrents,
       treePosition,
+      showWinrateGraph,
       showGameGraph,
       showCommentBox,
 
@@ -117,7 +118,7 @@ export default class Sidebar extends Component {
       1
     )
     let level = gameTree.getLevel(treePosition)
-    let showWinrateGraph = winrateData.some(x => x != null)
+    showWinrateGraph = showWinrateGraph && winrateData.some(x => x != null)
 
     return h(
       'section',
@@ -227,12 +228,16 @@ export default class Sidebar extends Component {
 Sidebar.getDerivedStateFromProps = function({
   gameTree,
   gameCurrents,
-  gameIndex
+  gameIndex,
+  showWinrateGraph
 }) {
   // Get winrate data
 
   let currentTrack = [...gameTree.listCurrentNodes(gameCurrents[gameIndex])]
   let winrateData = currentTrack.map(x => x.data.SBKV && x.data.SBKV[0])
 
-  return {winrateData}
+  return {
+    winrateData,
+    showWinrateGraph: showWinrateGraph && winrateData.some(x => x != null)
+  }
 }
diff --git a/src/components/sidebars/WinrateGraph.js b/src/components/sidebars/WinrateGraph.js
index 69e9f8873..837991e35 100644
--- a/src/components/sidebars/WinrateGraph.js
+++ b/src/components/sidebars/WinrateGraph.js
@@ -89,7 +89,6 @@ export default class WinrateGraph extends Component {
 
     return h(
       'section',
-
       {
         ref: el => (this.element = el),
         id: 'winrategraph',
diff --git a/src/menu.js b/src/menu.js
index 9f60c4b90..7fb58b80b 100644
--- a/src/menu.js
+++ b/src/menu.js
@@ -25,6 +25,7 @@ exports.get = function(props = {}) {
     showMoveColorization,
     showNextMoves,
     showSiblings,
+    showWinrateGraph,
     showGameGraph,
     showCommentBox,
     showLeftSidebar,
@@ -581,6 +582,17 @@ exports.get = function(props = {}) {
           click: () => toggleSetting('view.show_siblings')
         },
         {type: 'separator'},
+        {
+          label: i18n.t('menu.view', 'Show &Winrate Graph'),
+          type: 'checkbox',
+          checked: !!showWinrateGraph,
+          click: () => {
+            toggleSetting('view.show_winrategraph')
+            sabaki.setState(({showWinrateGraph}) => ({
+              showWinrateGraph: !showWinrateGraph
+            }))
+          }
+        },
         {
           label: i18n.t('menu.view', 'Show Game &Tree'),
           type: 'checkbox',
diff --git a/src/modules/sabaki.js b/src/modules/sabaki.js
index d031262e9..cb05cfbee 100644
--- a/src/modules/sabaki.js
+++ b/src/modules/sabaki.js
@@ -71,6 +71,7 @@ class Sabaki extends EventEmitter {
       consoleLog: [],
       showLeftSidebar: setting.get('view.show_leftsidebar'),
       leftSidebarWidth: setting.get('view.leftsidebar_width'),
+      showWinrateGraph: setting.get('view.show_winrategraph'),
       showGameGraph: setting.get('view.show_graph'),
       showCommentBox: setting.get('view.show_comments'),
       sidebarWidth: setting.get('view.sidebar_width'),
diff --git a/src/setting.js b/src/setting.js
index 4adb9869b..5157077d4 100644
--- a/src/setting.js
+++ b/src/setting.js
@@ -186,6 +186,7 @@ let defaults = {
   'view.show_move_numbers': false,
   'view.show_next_moves': true,
   'view.show_siblings': true,
+  'view.show_winrategraph': true,
   'view.sidebar_width': 200,
   'view.sidebar_minwidth': 100,
   'view.winrategraph_height': 60,