Clean up container/component relationship

client/src/js/containers/App.js

@@ -1,41 +1,13 @@
-import React, { PureComponent } from 'react';
+import { bindActionCreators } from 'redux';
 import { connect } from 'react-redux';
 import { createStructuredSelector } from 'reselect';
-import { push } from '../util/router';
-import Route from './Route';
-import Chat from './Chat';
-import Connect from './Connect';
-import Settings from './Settings';
-import TabList from '../components/TabList';
+import App from '../components/App';
 import { getChannels } from '../state/channels';
 import { getPrivateChats } from '../state/privateChats';
 import { getServers } from '../state/servers';
 import { getSelectedTab, select } from '../state/tab';
 import { getShowTabList, hideMenu } from '../state/ui';
-
-class App extends PureComponent {
-  handleClick = () => {
-    if (this.props.showTabList) {
-      this.props.hideMenu();
-    }
-  };
-
-  render() {
-    const { showTabList } = this.props;
-    const mainClass = showTabList ? 'main-container off-canvas' : 'main-container';
-
-    return (
-      <div onClick={this.handleClick}>
-        <TabList {...this.props} />
-        <div className={mainClass}>
-          <Route name="chat"><Chat /></Route>
-          <Route name="connect"><Connect /></Route>
-          <Route name="settings"><Settings /></Route>
-        </div>
-      </div>
-    );
-  }
-}
+import { push } from '../util/router';
 
 const mapState = createStructuredSelector({
   channels: getChannels,
@@ -45,4 +17,13 @@ const mapState = createStructuredSelector({
   tab: getSelectedTab
 });
 
-export default connect(mapState, { pushPath: push, select, hideMenu })(App);
+const mapDispatch = (dispatch, props) => ({
+  onClick: () => {
+    if (props.showTabList) {
+      dispatch(hideMenu());
+    }
+  },
+  ...bindActionCreators({ push, select }, dispatch)
+});
+
+export default connect(mapState, mapDispatch)(App);