Removed offline component

frontend/components/Alert/Alert.js

@@ -11,7 +11,6 @@ class Alert extends React.Component {
     danger: PropTypes.bool,
     warning: PropTypes.bool,
     success: PropTypes.bool,
-    offline: PropTypes.bool,
   };
 
   render() {
@@ -19,7 +18,6 @@ class Alert extends React.Component {
     if (this.props.danger) alertType = 'danger';
     if (this.props.warning) alertType = 'warning';
     if (this.props.success) alertType = 'success';
-    if (this.props.offline) alertType = 'offline';
     if (!alertType) alertType = 'info'; // default
 
     return (

frontend/components/Alert/Alert.test.js

@@ -23,7 +23,3 @@ test('renders warning', () => {
 test('renders danger', () => {
   snap(<Alert danger>danger</Alert>);
 });
-
-test('renders offline', () => {
-  snap(<Alert offline>offline</Alert>);
-});

frontend/components/Alert/__snapshots__/Alert.test.js.snap

@@ -1,113 +0,0 @@
-exports[`test renders danger 1`] = `
-<div
-  className="Flex container danger"
-  style={
-    Object {
-      "WebkitAlignItems": "center",
-      "WebkitJustifyContent": "center",
-      "alignItems": "center",
-      "boxSizing": "border-box",
-      "display": "flex",
-      "justifyContent": "center",
-      "msAlignItems": "center",
-      "msJustifyContent": "center"
-    }
-  }>
-  danger
-</div>
-`;
-
-exports[`test renders default as info 1`] = `
-<div
-  className="Flex container info"
-  style={
-    Object {
-      "WebkitAlignItems": "center",
-      "WebkitJustifyContent": "center",
-      "alignItems": "center",
-      "boxSizing": "border-box",
-      "display": "flex",
-      "justifyContent": "center",
-      "msAlignItems": "center",
-      "msJustifyContent": "center"
-    }
-  }>
-  default
-</div>
-`;
-
-exports[`test renders info 1`] = `
-<div
-  className="Flex container info"
-  style={
-    Object {
-      "WebkitAlignItems": "center",
-      "WebkitJustifyContent": "center",
-      "alignItems": "center",
-      "boxSizing": "border-box",
-      "display": "flex",
-      "justifyContent": "center",
-      "msAlignItems": "center",
-      "msJustifyContent": "center"
-    }
-  }>
-  info
-</div>
-`;
-
-exports[`test renders offline 1`] = `
-<div
-  className="Flex container offline"
-  style={
-    Object {
-      "WebkitAlignItems": "center",
-      "WebkitJustifyContent": "center",
-      "alignItems": "center",
-      "boxSizing": "border-box",
-      "display": "flex",
-      "justifyContent": "center",
-      "msAlignItems": "center",
-      "msJustifyContent": "center"
-    }
-  }>
-  offline
-</div>
-`;
-
-exports[`test renders success 1`] = `
-<div
-  className="Flex container success"
-  style={
-    Object {
-      "WebkitAlignItems": "center",
-      "WebkitJustifyContent": "center",
-      "alignItems": "center",
-      "boxSizing": "border-box",
-      "display": "flex",
-      "justifyContent": "center",
-      "msAlignItems": "center",
-      "msJustifyContent": "center"
-    }
-  }>
-  success
-</div>
-`;
-
-exports[`test renders warning 1`] = `
-<div
-  className="Flex container warning"
-  style={
-    Object {
-      "WebkitAlignItems": "center",
-      "WebkitJustifyContent": "center",
-      "alignItems": "center",
-      "boxSizing": "border-box",
-      "display": "flex",
-      "justifyContent": "center",
-      "msAlignItems": "center",
-      "msJustifyContent": "center"
-    }
-  }>
-  warning
-</div>
-`;

frontend/components/Layout/Layout.js

@@ -2,7 +2,6 @@ import React from 'react';
 import { browserHistory, Link } from 'react-router';
 import Helmet from 'react-helmet';
 import { observer, inject } from 'mobx-react';
-import { injectOffline } from 'components/Offline';
 import keydown from 'react-keydown';
 import _ from 'lodash';
 
@@ -18,7 +17,6 @@ const cx = classNames.bind(styles);
 
 @inject('user')
 @observer
-@injectOffline
 class Layout extends React.Component {
   static propTypes = {
     children: React.PropTypes.node,
@@ -28,7 +26,6 @@ class Layout extends React.Component {
     loading: React.PropTypes.bool,
     user: React.PropTypes.object.isRequired,
     search: React.PropTypes.bool,
-    offline: React.PropTypes.bool,
     notifications: React.PropTypes.node,
   };
 
@@ -61,11 +58,6 @@ class Layout extends React.Component {
 
         {this.props.loading && <LoadingIndicator />}
 
-        {this.props.offline &&
-          <Alert offline>
-            It looks like you're offline. Reconnect to restore access to all of your documents 📚
-          </Alert>}
-
         {this.props.notifications}
 
         <div className={cx(styles.header)}>

frontend/components/Offline/Offline.js

@@ -1,43 +0,0 @@
-import React from 'react';
-
-class Offline extends React.Component {
-  static propTypes = {
-    children: React.PropTypes.node,
-  };
-
-  static childContextTypes = {
-    offline: React.PropTypes.bool,
-  };
-
-  state = {
-    offline: !navigator.onLine,
-  };
-
-  getChildContext() {
-    return {
-      offline: this.state.offline,
-    };
-  }
-
-  componentDidMount = () => {
-    window.addEventListener('offline', this.handleConnectionState);
-    window.addEventListener('online', this.handleConnectionState);
-  };
-
-  componentWillUnmount = () => {
-    window.removeEventListener('offline', this.handleConnectionState);
-    window.removeEventListener('online', this.handleConnectionState);
-  };
-
-  handleConnectionState = () => {
-    this.setState({
-      offline: !navigator.onLine,
-    });
-  };
-
-  render() {
-    return React.Children.only(this.props.children);
-  }
-}
-
-export default Offline;

frontend/components/Offline/index.js

@@ -1,4 +0,0 @@
-import Offline from './Offline';
-import injectOffline from './injectOffline';
-
-export { Offline, injectOffline };

frontend/components/Offline/injectOffline.js

@@ -1,19 +0,0 @@
-import React from 'react';
-
-const injectOffline = WrappedComponent => {
-  return class OfflineWrapper extends React.Component {
-    static contextTypes = {
-      offline: React.PropTypes.bool,
-    };
-
-    render() {
-      const newProps = {
-        offline: this.context.offline,
-      };
-
-      return <WrappedComponent {...this.props} {...newProps} />;
-    }
-  };
-};
-
-export default injectOffline;

frontend/index.js

@@ -5,7 +5,6 @@ import Router from 'react-router/lib/Router';
 import Route from 'react-router/lib/Route';
 import IndexRoute from 'react-router/lib/IndexRoute';
 import History from 'utils/History';
-import { Offline } from 'components/Offline';
 
 import stores from 'stores';
 
@@ -49,78 +48,72 @@ function requireAuth(nextState, replace) {
 render(
   <div style={{ display: 'flex', flex: 1, height: '100%' }}>
     <Provider {...stores}>
-      <Offline>
-        <Router history={History}>
-          <Route path="/" component={Application}>
-            <IndexRoute component={Home} />
+      <Router history={History}>
+        <Route path="/" component={Application}>
+          <IndexRoute component={Home} />
 
-            <Route
-              path="/dashboard"
-              component={Dashboard}
-              onEnter={requireAuth}
-            />
-            <Route
-              path="/collections/:id"
-              component={Atlas}
-              onEnter={requireAuth}
-            />
-            <Route
-              path="/collections/:id/new"
-              component={DocumentEdit}
-              onEnter={requireAuth}
-              newDocument
-            />
-            <Route
-              path="/d/:id"
-              component={DocumentScene}
-              onEnter={requireAuth}
-            />
-            <Route
-              path="/d/:id/edit"
-              component={DocumentEdit}
-              onEnter={requireAuth}
-            />
-            <Route
-              path="/d/:id/new"
-              component={DocumentEdit}
-              onEnter={requireAuth}
-              newChildDocument
-            />
+          <Route
+            path="/dashboard"
+            component={Dashboard}
+            onEnter={requireAuth}
+          />
+          <Route
+            path="/collections/:id"
+            component={Atlas}
+            onEnter={requireAuth}
+          />
+          <Route
+            path="/collections/:id/new"
+            component={DocumentEdit}
+            onEnter={requireAuth}
+            newDocument
+          />
+          <Route
+            path="/d/:id"
+            component={DocumentScene}
+            onEnter={requireAuth}
+          />
+          <Route
+            path="/d/:id/edit"
+            component={DocumentEdit}
+            onEnter={requireAuth}
+          />
+          <Route
+            path="/d/:id/new"
+            component={DocumentEdit}
+            onEnter={requireAuth}
+            newChildDocument
+          />
 
-            <Route path="/search" component={Search} onEnter={requireAuth} />
-            <Route
-              path="/settings"
-              component={Settings}
-              onEnter={requireAuth}
-            />
+          <Route path="/search" component={Search} onEnter={requireAuth} />
+          <Route path="/settings" component={Settings} onEnter={requireAuth} />
 
-            <Route path="/auth/slack" component={SlackAuth} />
-            <Route
-              path="/auth/slack/commands"
-              component={SlackAuth}
-              apiPath="/auth.slackCommands"
-            />
-            <Route path="/auth/error" component={ErrorAuth} />
+          <Route path="/auth/slack" component={SlackAuth} />
+          <Route
+            path="/auth/slack/commands"
+            component={SlackAuth}
+            apiPath="/auth.slackCommands"
+          />
+          <Route path="/auth/error" component={ErrorAuth} />
 
-            <Flatpage
-              path="/keyboard-shortcuts"
-              component={Flatpage}
-              title="Keyboard shortcuts"
-              content={flatpages.keyboard}
-            />
+          <Flatpage
+            path="/keyboard-shortcuts"
+            component={Flatpage}
+            title="Keyboard shortcuts"
+            content={flatpages.keyboard}
+          />
 
-            <Flatpage
-              path="/developers"
-              component={Flatpage}
-              title="API"
-              content={flatpages.api}
-            />
+          <Flatpage
+            path="/developers"
+            component={Flatpage}
+            title="API"
+            content={flatpages.api}
+          />
 
-            <Route path="/404" component={Error404} />
-            <Route path="*" component={Search} sceneType="notFound" />
-          </Route>
-        </Router>
-      </Offline>
+          <Route path="/404" component={Error404} />
+          <Route path="*" component={Search} sceneType="notFound" />
+        </Route>
+      </Router>
     </Provider>
     {__DEV__ && <DevTools position={{ bottom: 0, right: 0 }} />}
   </div>,