diff --git a/src/index.js b/src/index.js
index ac17c8f..c550c3c 100644
--- a/src/index.js
+++ b/src/index.js
@@ -16,8 +16,6 @@ import Nav from './ui/navigation';
 import Main from './ui/main';
 import Connection from './ui/connection';
 
-const root = document.getElementById('root');
-
 export function initialize(uri) {
   ws_init(uri, () => {
     store.dispatch(socket_connected());
@@ -36,7 +34,7 @@ ReactDOM.render(
         </div>
       </div>
     </ConnectedRouter>
-  </Provider>, root);
+  </Provider>, document.getElementById('root'));
 
 navigator.registerProtocolHandler("magnet",
   window.location.origin + "/add-torrent/%s",
diff --git a/src/ui/connection.js b/src/ui/connection.js
index 6373397..4dea7a3 100644
--- a/src/ui/connection.js
+++ b/src/ui/connection.js
@@ -1,4 +1,5 @@
 import React, { Component } from 'react';
+import { connect } from 'react-redux';
 import {
   Card,
   CardHeader,
@@ -9,7 +10,7 @@ import {
 } from 'reactstrap';
 import { initialize } from '..';
 
-export default class ConnectionOverlay extends Component {
+class ConnectionOverlay extends Component {
   constructor() {
     super();
     this.state = {
@@ -23,6 +24,10 @@ export default class ConnectionOverlay extends Component {
   }
 
   render() {
+    const { socket } = this.props;
+    if (socket.connected) {
+      return null;
+    }
     const { uri, autoconnect } = this.state;
     return (
       <div className="connection-overlay">
@@ -58,3 +63,5 @@ export default class ConnectionOverlay extends Component {
     );
   }
 }
+
+export default connect(state => ({ socket: state.socket }))(ConnectionOverlay);
diff --git a/src/ui/main.js b/src/ui/main.js
index 66e9fa6..322ba46 100644
--- a/src/ui/main.js
+++ b/src/ui/main.js
@@ -7,7 +7,7 @@ import TorrentDetails from './torrent_details';
 import Server from './server';
 import ConnectionOverlay from './connection';
 
-class Main extends Component {
+export default class Main extends Component {
   render() {
     return (
       <div className="row">
@@ -20,10 +20,8 @@ class Main extends Component {
           <Route path="/torrents/:ids" component={TorrentDetails} />
           <Route exact path="/" component={Server} />
         </div>
-        {this.props.socket.connected || <ConnectionOverlay />}
+        <ConnectionOverlay />
       </div>
     );
   }
 }
-
-export default connect(state => ({ socket: state.socket }))(Main);