Move main drop-down state to component state

ui/app/actions.js

@@ -2,10 +2,6 @@ var actions = {
   GO_HOME: 'GO_HOME',
   goHome: goHome,
   // menu state
-  TOGGLE_MENU: 'TOGGLE_MENU',
-  toggleMenu: toggleMenu,
-  SET_MENU_STATE: 'SET_MENU_STATE',
-  closeMenu: closeMenu,
   getNetworkStatus: 'getNetworkStatus',
 
   // remote state
@@ -125,21 +121,6 @@ function goHome () {
   }
 }
 
-// menu state
-
-function toggleMenu () {
-  return {
-    type: actions.TOGGLE_MENU,
-  }
-}
-
-function closeMenu () {
-  return {
-    type: actions.SET_MENU_STATE,
-    value: false,
-  }
-}
-
 // async actions
 
 function tryUnlockMetamask (password) {

ui/app/app.js

@@ -178,7 +178,7 @@ App.prototype.renderAppBar = function () {
             onClick: (event) => {
               event.preventDefault()
               event.stopPropagation()
-              this.props.dispatch(actions.toggleMenu())
+              this.setState({ isMainMenuOpen: true })
             },
           }),
         ]),
@@ -241,10 +241,13 @@ App.prototype.renderNetworkDropdown = function () {
 
 App.prototype.renderDropdown = function () {
   const props = this.props
+  const state = this.state || {}
+  const isOpen = state.isMainMenuOpen
+
   return h(MenuDroppo, {
-    isOpen: props.menuOpen,
+    isOpen: isOpen,
     onClickOutside: (event) => {
-      this.props.dispatch(actions.closeMenu())
+      this.setState({ isMainMenuOpen: !isOpen })
     },
     style: {
       position: 'absolute',
@@ -263,21 +266,21 @@ App.prototype.renderDropdown = function () {
 
     h(DropMenuItem, {
       label: 'Settings',
-      closeMenu: () => this.props.dispatch(actions.closeMenu()),
+      closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }),
       action: () => this.props.dispatch(actions.showConfigPage()),
       icon: h('i.fa.fa-gear.fa-lg', { ariaHidden: true }),
     }),
 
     h(DropMenuItem, {
       label: 'Lock',
-      closeMenu: () => this.props.dispatch(actions.closeMenu()),
+      closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }),
       action: () => this.props.dispatch(actions.lockMetamask()),
       icon: h('i.fa.fa-lock.fa-lg', { ariaHidden: true }),
     }),
 
     h(DropMenuItem, {
       label: 'Help',
-      closeMenu: () => this.props.dispatch(actions.closeMenu()),
+      closeMenu: () => this.setState({ isMainMenuOpen: !isOpen }),
       action: () => this.props.dispatch(actions.showInfoPage()),
       icon: h('i.fa.fa-question.fa-lg', { ariaHidden: true }),
     }),

ui/app/reducers/app.js

@@ -43,16 +43,6 @@ function reduceApp (state, action) {
 
   switch (action.type) {
 
-    case actions.TOGGLE_MENU:
-      return extend(appState, {
-        menuOpen: !appState.menuOpen,
-      })
-
-    case actions.SET_MENU_STATE:
-      return extend(appState, {
-        menuOpen: action.value,
-      })
-
   // intialize
 
     case actions.SHOW_CREATE_VAULT: