Remove unused code - network dropdown components in app

ui/app/app.js

@@ -239,14 +239,11 @@ App.prototype.renderAppBar = function () {
             onClick: (event) => {
               event.preventDefault()
               event.stopPropagation()
-              console.log("NI CLICK:", this.props.networkDropdownOpen)
               if (this.props.networkDropdownOpen === false) {
                 this.props.showNetworkDropdown()
               } else {
                 this.props.hideNetworkDropdown()
               }
-              // this.props.toggleNetworkOpen()
-              // this.setState({ isNetworkMenuOpen: !isNetworkMenuOpen })
             },
           }),
 
@@ -257,148 +254,6 @@ App.prototype.renderAppBar = function () {
   )
 }
 
-App.prototype.renderNetworkDropdown = function () {
-  const props = this.props
-  const { provider: { type: providerType, rpcTarget: activeNetwork } } = props
-  const rpcList = props.frequentRpcList
-  const state = this.state || {}
-  console.log("this.state:", state)
-  const isOpen = state.isNetworkMenuOpen
-
-  return h(Dropdown, {
-    useCssTransition: true,
-    isOpen,
-    onClickOutside: (event) => {
-      const { classList } = event.target
-      const isNotToggleElement = [
-        classList.contains('menu-icon'),
-        classList.contains('network-name'),
-        classList.contains('network-indicator'),
-      ].filter(bool => bool).length === 0
-      // classes from three constituent nodes of the toggle element
-
-      if (isNotToggleElement) {
-        this.setState({ isNetworkMenuOpen: false })
-      }
-    },
-    zIndex: 11,
-    style: {
-      position: 'absolute',
-      right: '2px',
-      top: '38px',
-    },
-    innerStyle: {
-      padding: '2px 16px 2px 0px',
-    },
-  }, [
-
-    h(
-      DropdownMenuItem,
-      {
-        key: 'main',
-        closeMenu: () => this.setState({ isNetworkMenuOpen: !isOpen }),
-        onClick: () => props.dispatch(actions.setProviderType('mainnet')),
-        style: {
-          fontSize: '18px',
-        },
-      },
-      [
-        h('.menu-icon.diamond'),
-        'Main Ethereum Network',
-        providerType === 'mainnet' ? h('.check', '✓') : null,
-      ]
-    ),
-
-    h(
-      DropdownMenuItem,
-      {
-        key: 'ropsten',
-        closeMenu: () => this.setState({ isNetworkMenuOpen: !isOpen }),
-        onClick: () => props.dispatch(actions.setProviderType('ropsten')),
-        style: {
-          fontSize: '18px',
-        },
-      },
-      [
-        h('.menu-icon.red-dot'),
-        'Ropsten Test Network',
-        providerType === 'ropsten' ? h('.check', '✓') : null,
-      ]
-    ),
-
-    h(
-      DropdownMenuItem,
-      {
-        key: 'kovan',
-        closeMenu: () => this.setState({ isNetworkMenuOpen: !isOpen }),
-        onClick: () => props.dispatch(actions.setProviderType('kovan')),
-        style: {
-          fontSize: '18px',
-        },
-      },
-      [
-        h('.menu-icon.hollow-diamond'),
-        'Kovan Test Network',
-        providerType === 'kovan' ? h('.check', '✓') : null,
-      ]
-    ),
-
-    h(
-      DropdownMenuItem,
-      {
-        key: 'rinkeby',
-        closeMenu: () => this.setState({ isNetworkMenuOpen: !isOpen }),
-        onClick: () => props.dispatch(actions.setProviderType('rinkeby')),
-        style: {
-          fontSize: '18px',
-        },
-      },
-      [
-        h('.menu-icon.golden-square'),
-        'Rinkeby Test Network',
-        providerType === 'rinkeby' ? h('.check', '✓') : null,
-      ]
-    ),
-
-    h(
-      DropdownMenuItem,
-      {
-        key: 'default',
-        closeMenu: () => this.setState({ isNetworkMenuOpen: !isOpen }),
-        onClick: () => props.dispatch(actions.setDefaultRpcTarget()),
-        style: {
-          fontSize: '18px',
-        },
-      },
-      [
-        h('i.fa.fa-question-circle.fa-lg.menu-icon'),
-        'Localhost 8545',
-        activeNetwork === 'http://localhost:8545' ? h('.check', '✓') : null,
-      ]
-    ),
-
-    this.renderCustomOption(props.provider),
-    this.renderCommonRpc(rpcList, props.provider),
-
-    h(
-      DropdownMenuItem,
-      {
-        closeMenu: () => this.setState({ isNetworkMenuOpen: !isOpen }),
-        onClick: () => this.props.dispatch(actions.showConfigPage()),
-        style: {
-          fontSize: '18px',
-        },
-      },
-      [
-        h('i.fa.fa-question-circle.fa-lg.menu-icon'),
-        'Custom RPC',
-        activeNetwork === 'custom' ? h('.check', '✓') : null,
-      ]
-    ),
-
-  ])
-}
-
 App.prototype.renderBackButton = function (style, justArrow = false) {
   var props = this.props
   return (
@@ -557,40 +412,6 @@ App.prototype.toggleMetamaskActive = function () {
   }
 }
 
-App.prototype.renderCustomOption = function (provider) {
-  const { rpcTarget, type } = provider
-  const props = this.props
-
-  if (type !== 'rpc') return null
-
-  // Concatenate long URLs
-  let label = rpcTarget
-  if (rpcTarget.length > 31) {
-    label = label.substr(0, 34) + '...'
-  }
-
-  switch (rpcTarget) {
-
-    case 'http://localhost:8545':
-      return null
-
-    default:
-      return h(
-        DropdownMenuItem,
-        {
-          key: rpcTarget,
-          onClick: () => props.dispatch(actions.setRpcTarget(rpcTarget)),
-          closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
-        },
-        [
-          h('i.fa.fa-question-circle.fa-lg.menu-icon'),
-          label,
-          h('.check', '✓'),
-        ]
-      )
-  }
-}
-
 App.prototype.getNetworkName = function () {
   const { provider } = this.props
   const providerName = provider.type
@@ -611,28 +432,3 @@ App.prototype.getNetworkName = function () {
 
   return name
 }
-
-App.prototype.renderCommonRpc = function (rpcList, provider) {
-  const props = this.props
-  const rpcTarget = provider.rpcTarget
-
-  return rpcList.map((rpc) => {
-    if ((rpc === 'http://localhost:8545') || (rpc === rpcTarget)) {
-      return null
-    } else {
-      return h(
-        DropdownMenuItem,
-        {
-          key: `common${rpc}`,
-          closeMenu: () => this.setState({ isNetworkMenuOpen: false }),
-          onClick: () => props.dispatch(actions.setRpcTarget(rpc)),
-        },
-        [
-          h('i.fa.fa-question-circle.fa-lg.menu-icon'),
-          rpc,
-          rpcTarget === rpc ? h('.check', '✓') : null,
-        ]
-      )
-    }
-  })
-}

ui/app/components/dropdowns/network-dropdown.js

@@ -42,21 +42,16 @@ function NetworkDropdown () {
   Component.call(this)
 }
 
-// renderNetworkDropdown
-// renderCustomOption
-// renderCommonRpc
+module.exports = connect(mapStateToProps, mapDispatchToProps)(NetworkDropdown)
+
 // TODO: specify default props and proptypes
 NetworkDropdown.prototype.render = function () {
-  console.log("RENDER")
   const props = this.props
   const { provider: { type: providerType, rpcTarget: activeNetwork } } = props
   const rpcList = props.frequentRpcList
   const state = this.state || {}
-  console.log("this.state", state)
   const isOpen = this.props.networkDropdownOpen
 
-  console.log("isOpen", isOpen)
-
   return h(Dropdown, {
     useCssTransition: true,
     isOpen,
@@ -271,6 +266,3 @@ NetworkDropdown.prototype.renderCustomOption = function (provider) {
       )
   }
 }
-
-const comp = connect(mapStateToProps, mapDispatchToProps)(NetworkDropdown)
-module.exports = comp