From 645428727701ba85ce88f87f57cf71d9d09bbf67 Mon Sep 17 00:00:00 2001
From: srgooglo <traveld8@gmail.com>
Date: Wed, 7 Oct 2020 11:16:26 +0200
Subject: [PATCH] [update] improved render methods for childrens with selectKey

---
 src/pages/debug/{ => debuggers}/antd.js   |   0
 src/pages/debug/{ => debuggers}/api.js    |   0
 src/pages/debug/{ => debuggers}/api.less  |   0
 src/pages/debug/{ => debuggers}/core.js   |   0
 src/pages/debug/{ => debuggers}/socket.js |   0
 src/pages/debug/{ => debuggers}/theme.js  |   0
 src/pages/debug/debuggers/verbosity.js    |  14 +++
 src/pages/debug/index.js                  | 125 ++++++++++++----------
 src/pages/settings/index.js               |   1 +
 9 files changed, 84 insertions(+), 56 deletions(-)
 rename src/pages/debug/{ => debuggers}/antd.js (100%)
 rename src/pages/debug/{ => debuggers}/api.js (100%)
 rename src/pages/debug/{ => debuggers}/api.less (100%)
 rename src/pages/debug/{ => debuggers}/core.js (100%)
 rename src/pages/debug/{ => debuggers}/socket.js (100%)
 rename src/pages/debug/{ => debuggers}/theme.js (100%)
 create mode 100644 src/pages/debug/debuggers/verbosity.js

diff --git a/src/pages/debug/antd.js b/src/pages/debug/debuggers/antd.js
similarity index 100%
rename from src/pages/debug/antd.js
rename to src/pages/debug/debuggers/antd.js
diff --git a/src/pages/debug/api.js b/src/pages/debug/debuggers/api.js
similarity index 100%
rename from src/pages/debug/api.js
rename to src/pages/debug/debuggers/api.js
diff --git a/src/pages/debug/api.less b/src/pages/debug/debuggers/api.less
similarity index 100%
rename from src/pages/debug/api.less
rename to src/pages/debug/debuggers/api.less
diff --git a/src/pages/debug/core.js b/src/pages/debug/debuggers/core.js
similarity index 100%
rename from src/pages/debug/core.js
rename to src/pages/debug/debuggers/core.js
diff --git a/src/pages/debug/socket.js b/src/pages/debug/debuggers/socket.js
similarity index 100%
rename from src/pages/debug/socket.js
rename to src/pages/debug/debuggers/socket.js
diff --git a/src/pages/debug/theme.js b/src/pages/debug/debuggers/theme.js
similarity index 100%
rename from src/pages/debug/theme.js
rename to src/pages/debug/debuggers/theme.js
diff --git a/src/pages/debug/debuggers/verbosity.js b/src/pages/debug/debuggers/verbosity.js
new file mode 100644
index 00000000..1ce7c0ae
--- /dev/null
+++ b/src/pages/debug/debuggers/verbosity.js
@@ -0,0 +1,14 @@
+import React from 'react'
+import settings from 'core/libs/settings'
+
+const verbosity_enabled = settings('verbosity')
+export default class Verbosity extends React.Component{
+    render(){
+        return(
+            <div>
+                verbosity => {verbosity_enabled ? "enabled" : "disabled"}
+                
+            </div>
+        )
+    }
+}
\ No newline at end of file
diff --git a/src/pages/debug/index.js b/src/pages/debug/index.js
index 027652bb..c6a16d62 100644
--- a/src/pages/debug/index.js
+++ b/src/pages/debug/index.js
@@ -3,64 +3,71 @@ import { Menu } from 'antd'
 import * as Icons from 'components/Icons'
 
 import styles from './index.less'
+import ApiDebug from './debuggers/api'
+import AntdDebug from './debuggers/antd'
+import CoreDebug from './debuggers/core'
+import ThemeDebug from './debuggers/theme'
+import SocketDebug from './debuggers/socket'
+import VerbosityDebug from './debuggers/verbosity'
 
-import ApiDebug from './api.js'
-import AntdDebug from './antd.js'
-import CoreDebug from './core.js'
-import ThemeDebug from './theme.js'
-import SocketDebug from './socket.js'
-
-const debbugers = {
-  apiDebug: <ApiDebug />,
-  antdDebug: <AntdDebug />,
-  coreDebug: <CoreDebug />,
-  themeDebug: <ThemeDebug />,
-  socketDebug: <SocketDebug />
+const Debuggers = {
+  api: <ApiDebug />,
+  antd: <AntdDebug />,
+  core: <CoreDebug />,
+  theme: <ThemeDebug />,
+  socket: <SocketDebug />,
+  verbosity: <VerbosityDebug />
 }
 
-const { Item } = Menu
-const menuMap = {
-  apiDebug: (
-    <span>
-      <Icons.Globe /> V3 Api
-    </span>
-  ),
-  antdDebug: (
-    <span>
-      <Icons.AntDesignOutlined /> Antd
-    </span>
-  ),
-  coreDebug: (
-    <span>
-      <Icons.Box /> Core
-    </span>
-  ),
-  themeDebug: (
-    <span>
-      <Icons.Image /> Theme
-    </span>
-  ),
-  socketDebug: (
-    <span>
-      <Icons.Box /> Socket
-    </span>
-  )
-}
+const menuList = [
+  {
+    key: "api",
+    title: "API V3 Requester",
+    icon: <Icons.Globe />,
+  },
+  {
+    key: "antd",
+    title: "Antd",
+    icon: <Icons.AntDesignOutlined />,
+    require: "embedded"
+  },
+  {
+    key: "core",
+    title: "Core",
+    icon: <Icons.Box />
+  },
+  {
+    key: "theme",
+    title: "Theme",
+    icon: <Icons.Image />
+  },
+  {
+    key: "socket",
+    title: "Socket",
+    icon: <Icons.Box />
+  },
+  {
+    key: "verbosity",
+    title: "Verbosity",
+    icon: <Icons.Edit3 />
+  }
+]
 
 export default class Debug extends React.Component {
-  constructor(props) {
-    super(props)
-    this.state = {
-      selectKey: 'socketDebug',
-    }
+  state = {
+    loading: true,
+    selectKey: '',
+    menus: []
   }
 
-  getMenu = () => {
-    return Object.keys(menuMap).map(item => (
-      <Item key={item}>{menuMap[item]}</Item>
+  getMenu() {
+    return this.state.menus.map(item => (
+      <Menu.Item key={item.key}>
+        <span>{item.icon} {item.title}</span>
+      </Menu.Item>
     ))
   }
-
+  
   selectKey = key => {
     this.setState({
       selectKey: key,
@@ -68,17 +75,23 @@ export default class Debug extends React.Component {
   }
 
   renderChildren = () => {
-    try {
-      if (!this.state.selectKey) {
-        return <div>Select an debugger</div>
-      }
-      return debbugers[this.state.selectKey]
-    } catch (error) {
-      return <div>Select an debugger</div>
+    let titlesArray = []
+    this.state.menus.forEach(e => {
+      titlesArray[e.key] = e
+    })
+    if(this.state.selectKey){
+      return Debuggers[this.state.selectKey]
+    }else{
+      <div> Select an Option </div>
     }
   }
 
+  componentDidMount(){
+    this.setState({ menus: menuList, loading: false })
+  }
+
   render() {
+  
     const { selectKey } = this.state
     return (
       <div className={styles.main}>
diff --git a/src/pages/settings/index.js b/src/pages/settings/index.js
index 110e5cca..a61daed7 100755
--- a/src/pages/settings/index.js
+++ b/src/pages/settings/index.js
@@ -123,6 +123,7 @@ class GeneralSettings extends React.PureComponent {
       </Menu.Item>
     ))
   }
+  
   selectKey = key => {
     this.setState({
       selectKey: key,