Move settings visibility to global state

Fixes #95

app/src/components/App.tsx

@@ -138,12 +138,12 @@ const mapDispatchToProps = (dispatch: any) => {
 
 const mapStateToProps = (state: AppState) => {
   return {
-    settingsVisible: state.settings.get('visible'),
+    settingsVisible: state.globalState.get('settingsVisible'),
     connectionId: state.connection.connectionId,
-    error: state.globalState.error,
-    notification: state.globalState.notification,
+    error: state.globalState.get('error'),
+    notification: state.globalState.get('notification'),
     highlightTopicUpdates: state.settings.get('highlightTopicUpdates'),
-    launching: state.globalState.launching,
+    launching: state.globalState.get('launching'),
   }
 }
 

app/src/components/Layout/TitleBar.tsx

@@ -7,7 +7,7 @@ import Search from '@material-ui/icons/Search'
 import { AppState } from '../../reducers'
 import { bindActionCreators } from 'redux'
 import { connect } from 'react-redux'
-import { connectionActions, settingsActions, treeActions } from '../../actions'
+import { connectionActions, settingsActions, globalActions } from '../../actions'
 import { fade } from '@material-ui/core/styles/colorManipulator'
 import { StyleRulesCallback, withStyles } from '@material-ui/core/styles'
 import {
@@ -81,6 +81,7 @@ interface Props {
   actions: {
     settings: typeof settingsActions,
     connection: typeof connectionActions,
+    global: typeof globalActions,
   }
   topicFilter?: string
 }
@@ -124,7 +125,7 @@ class TitleBar extends React.Component<Props, {}> {
     return (
       <AppBar position="static">
         <Toolbar>
-          <IconButton className={classes.menuButton} color="inherit" aria-label="Menu" onClick={actions.settings.toggleSettingsVisibility}>
+          <IconButton className={classes.menuButton} color="inherit" aria-label="Menu" onClick={actions.global.toggleSettingsVisibility}>
             <Menu />
           </IconButton>
           <Typography className={classes.title} variant="h6" color="inherit">MQTT Explorer</Typography>
@@ -150,6 +151,7 @@ const mapDispatchToProps = (dispatch: any) => {
   return {
     actions: {
       settings: bindActionCreators(settingsActions, dispatch),
+      global: bindActionCreators(globalActions, dispatch),
       connection: bindActionCreators(connectionActions, dispatch),
     },
   }

app/src/components/SettingsDrawer/BooleanSwitch.tsx

@@ -1,5 +1,10 @@
 import * as React from 'react'
-import { InputLabel, Switch, Tooltip, Theme } from '@material-ui/core'
+import {
+  InputLabel,
+  Switch,
+  Theme,
+  Tooltip
+  } from '@material-ui/core'
 import { withStyles } from '@material-ui/styles'
 const sha1 = require('sha1')
 

app/src/components/SettingsDrawer/Settings.tsx

@@ -204,7 +204,7 @@ const mapStateToProps = (state: AppState) => {
   return {
     autoExpandLimit: state.settings.get('autoExpandLimit'),
     topicOrder: state.settings.get('topicOrder'),
-    visible: state.settings.get('visible'),
+    visible: state.globalState.get('settingsVisible'),
     highlightTopicUpdates: state.settings.get('highlightTopicUpdates'),
     selectTopicWithMouseOver: state.settings.get('selectTopicWithMouseOver'),
     theme: state.settings.get('theme'),