Upgraded dependencies

2017-04-26 22:18:36 -07:00
parent c0a8d71bb9
commit b34d80717b
8 changed files with 825 additions and 798 deletions
--- a/frontend/scenes/Dashboard/Dashboard.js
+++ b/frontend/scenes/Dashboard/Dashboard.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { observer } from 'mobx-react';
+import { observer, inject } from 'mobx-react';
 import { withRouter } from 'react-router';

 import DashboardStore from './DashboardStore';
@@ -11,12 +11,13 @@ import AtlasPreviewLoading from 'components/AtlasPreviewLoading';
 import CenteredContent from 'components/CenteredContent';

@withRouter
-@observer(['user'])
+@inject('user')
+@observer
 class Dashboard extends React.Component {
  static propTypes = {
    user: React.PropTypes.object.isRequired,
    router: React.PropTypes.object.isRequired,
-  }
+  };

  constructor(props) {
    super(props);
@@ -33,13 +34,14 @@ class Dashboard extends React.Component {
        <Layout>
          <CenteredContent>
            <Flex column auto>
-              { this.store.isFetching ? (
-                <AtlasPreviewLoading />
-              ) : (
-                this.store.collections && this.store.collections.map((collection) => {
-                  return (<AtlasPreview key={ collection.id } data={ collection } />);
-                })
-              ) }
+              {this.store.isFetching
+                ? <AtlasPreviewLoading />
+                : this.store.collections &&
+                    this.store.collections.map(collection => {
+                      return (
+                        <AtlasPreview key={collection.id} data={collection} />
+                      );
+                    })}
            </Flex>
          </CenteredContent>
        </Layout>
--- a/frontend/scenes/DocumentScene/DocumentScene.js
+++ b/frontend/scenes/DocumentScene/DocumentScene.js
@@ -1,13 +1,11 @@
 import React, { PropTypes } from 'react';
 import { Link, browserHistory } from 'react-router';
-import { observer } from 'mobx-react';
+import { observer, inject } from 'mobx-react';
 import { toJS } from 'mobx';
 import keydown from 'react-keydown';
 import _ from 'lodash';

-import DocumentSceneStore, {
-  DOCUMENT_PREFERENCES,
-} from './DocumentSceneStore';
+import DocumentSceneStore, { DOCUMENT_PREFERENCES } from './DocumentSceneStore';

 import Layout from 'components/Layout';
 import AtlasPreviewLoading from 'components/AtlasPreviewLoading';
@@ -22,7 +20,8 @@ import styles from './DocumentScene.scss';
 // const cx = classNames.bind(styles);

@keydown(['cmd+/', 'ctrl+/', 'c', 'e'])
-@observer(['ui', 'cache'])
+@inject('ui', 'cache')
+@observer
 class DocumentScene extends React.Component {
  static propTypes = {
    ui: PropTypes.object.isRequired,
@@ -30,7 +29,7 @@ class DocumentScene extends React.Component {
    routeParams: PropTypes.object,
    params: PropTypes.object.isRequired,
    location: PropTypes.object.isRequired,
-  }
+  };

  constructor(props) {
    super(props);
@@ -44,7 +43,7 @@ class DocumentScene extends React.Component {

  state = {
    didScroll: false,
-  }
+  };

  componentDidMount = async () => {
    const { id } = this.props.routeParams;
@@ -52,9 +51,9 @@ class DocumentScene extends React.Component {
      replaceUrl: !this.props.location.hash,
    });
    this.scrollTohash();
-  }
+  };

-  componentWillReceiveProps = async (nextProps) => {
+  componentWillReceiveProps = async nextProps => {
    const key = nextProps.keydown.event;
    if (key) {
      if (key.key === '/' && (key.metaKey || key.ctrl.Key)) {
@@ -81,25 +80,26 @@ class DocumentScene extends React.Component {
    }

    this.scrollTohash();
-  }
+  };

  onEdit = () => {
    const url = `${this.store.document.url}/edit`;
    browserHistory.push(url);
-  }
+  };

  onCreateDocument = () => {
    browserHistory.push(`${this.store.collectionTree.url}/new`);
-  }
+  };

  onCreateChild = () => {
    browserHistory.push(`${this.store.document.url}/new`);
-  }
+  };

  onDelete = () => {
    let msg;
    if (this.store.document.collection.type === 'atlas') {
-      msg = 'Are you sure you want to delete this document and all it\'s child documents (if any)?';
+      msg =
+        "Are you sure you want to delete this document and all it's child documents (if any)?";
    } else {
      msg = 'Are you sure you want to delete this document?';
    }
@@ -107,7 +107,7 @@ class DocumentScene extends React.Component {
    if (confirm(msg)) {
      this.store.deleteDocument();
    }
-  }
+  };

  onExport = () => {
    const doc = this.store.document;
@@ -116,7 +116,7 @@ class DocumentScene extends React.Component {
    a.download = `${doc.title}.md`;
    a.href = `data:text/markdown;charset=UTF-8,${encodeURIComponent(doc.text)}`;
    a.click();
-  }
+  };

  scrollTohash = () => {
    // Scroll to anchor after loading, and only once
@@ -128,40 +128,41 @@ class DocumentScene extends React.Component {
      const element = window.document.getElementsByName(name)[0];
      if (element) element.scrollIntoView();
    }
-  }
+  };

  render() {
-    const {
-      sidebar,
-    } = this.props.ui;
+    const { sidebar } = this.props.ui;

    const doc = this.store.document;
-    const allowDelete = doc && doc.collection.type === 'atlas' &&
+    const allowDelete =
+      doc &&
+      doc.collection.type === 'atlas' &&
      doc.id !== doc.collection.navigationTree.id;
    let title;
    let titleText;
    let actions;
    if (doc) {
      actions = (
-        <div className={ styles.actions }>
-          <DropdownMenu label={ <MoreIcon /> }>
-            { this.store.isCollection && (
-              <div className={ styles.menuGroup }>
-                <MenuItem onClick={ this.onCreateDocument }>New document</MenuItem>
-                <MenuItem onClick={ this.onCreateChild }>New child</MenuItem>
-              </div>
-            ) }
-            <MenuItem onClick={ this.onEdit }>Edit</MenuItem>
-            <MenuItem onClick={ this.onExport }>Export</MenuItem>
-            { allowDelete && <MenuItem onClick={ this.onDelete }>Delete</MenuItem> }
+        <div className={styles.actions}>
+          <DropdownMenu label={<MoreIcon />}>
+            {this.store.isCollection &&
+              <div className={styles.menuGroup}>
+                <MenuItem onClick={this.onCreateDocument}>
+                  New document
+                </MenuItem>
+                <MenuItem onClick={this.onCreateChild}>New child</MenuItem>
+              </div>}
+            <MenuItem onClick={this.onEdit}>Edit</MenuItem>
+            <MenuItem onClick={this.onExport}>Export</MenuItem>
+            {allowDelete && <MenuItem onClick={this.onDelete}>Delete</MenuItem>}
          </DropdownMenu>
        </div>
      );
      title = (
        <span>
          &nbsp;/&nbsp;
-          <Link to={ doc.collection.url }>{ doc.collection.name }</Link>
-          { ` / ${doc.title}` }
+          <Link to={doc.collection.url}>{doc.collection.name}</Link>
+          {` / ${doc.title}`}
        </span>
      );
      titleText = `${doc.collection.name} - ${doc.title}`;
@@ -169,33 +170,30 @@ class DocumentScene extends React.Component {

    return (
      <Layout
-        title={ title }
-        titleText={ titleText }
-        actions={ doc && actions }
-        loading={ this.store.updatingStructure }
+        title={title}
+        titleText={titleText}
+        actions={doc && actions}
+        loading={this.store.updatingStructure}
      >
-        { this.store.isFetching ? (
-          <CenteredContent>
-            <AtlasPreviewLoading />
-          </CenteredContent>
-        ) : (
-          <Flex auto>
-            { this.store.isCollection && (
-              <Sidebar
-                open={ sidebar }
-                onToggle={ this.props.ui.toggleSidebar }
-                navigationTree={ toJS(this.store.collectionTree) }
-                onNavigationUpdate={ this.store.updateNavigationTree }
-                onNodeCollapse={ this.store.onNodeCollapse }
-              />
-            ) }
-            <Flex auto justify="center" className={ styles.content }>
-              <CenteredContent>
-                <Document document={ doc } />
-              </CenteredContent>
-            </Flex>
-          </Flex>
-        ) }
+        {this.store.isFetching
+          ? <CenteredContent>
+              <AtlasPreviewLoading />
+            </CenteredContent>
+          : <Flex auto>
+              {this.store.isCollection &&
+                <Sidebar
+                  open={sidebar}
+                  onToggle={this.props.ui.toggleSidebar}
+                  navigationTree={toJS(this.store.collectionTree)}
+                  onNavigationUpdate={this.store.updateNavigationTree}
+                  onNodeCollapse={this.store.onNodeCollapse}
+                />}
+              <Flex auto justify="center" className={styles.content}>
+                <CenteredContent>
+                  <Document document={doc} />
+                </CenteredContent>
+              </Flex>
+            </Flex>}
      </Layout>
    );
  }
--- a/frontend/scenes/Home/Home.js
+++ b/frontend/scenes/Home/Home.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import { observer } from 'mobx-react';
+import { observer, inject } from 'mobx-react';
 import { browserHistory } from 'react-router';

 import { Flex } from 'reflexbox';
@@ -10,18 +10,19 @@ import Alert from 'components/Alert';

 import styles from './Home.scss';

-@observer(['user'])
+@inject('user')
+@observer
 export default class Home extends React.Component {
  static propTypes = {
    user: React.PropTypes.object.isRequired,
    location: React.PropTypes.object.isRequired,
-  }
+  };

  componentDidMount = () => {
    if (this.props.user.authenticated) {
      browserHistory.replace('/dashboard');
    }
-  }
+  };

  get notifications() {
    const notifications = [];
@@ -30,7 +31,9 @@ export default class Home extends React.Component {
    if (state && state.nextPathname) {
      sessionStorage.removeItem('redirectTo');
      sessionStorage.setItem('redirectTo', state.nextPathname);
-      notifications.push(<Alert key="login" info>Please login to continue</Alert>);
+      notifications.push(
+        <Alert key="login" info>Please login to continue</Alert>
+      );
    }

    return notifications;
@@ -41,18 +44,17 @@ export default class Home extends React.Component {

    return (
      <Flex auto>
-        <Layout
-          notifications={ this.notifications }
-        >
+        <Layout notifications={this.notifications}>
          <CenteredContent>
-            { showLandingPageCopy && (
-              <div className={ styles.intro }>
-                <h1 className={ styles.title }>Simple, fast, markdown.</h1>
-                <p className={ styles.copy }>We're building a modern wiki for engineering teams.</p>
-              </div>
-            ) }
-            <div className={ styles.action }>
-              <SlackAuthLink redirectUri={ `${URL}/auth/slack` }>
+            {showLandingPageCopy &&
+              <div className={styles.intro}>
+                <h1 className={styles.title}>Simple, fast, markdown.</h1>
+                <p className={styles.copy}>
+                  We're building a modern wiki for engineering teams.
+                </p>
+              </div>}
+            <div className={styles.action}>
+              <SlackAuthLink redirectUri={`${URL}/auth/slack`}>
                <img
                  alt="Sign in with Slack"
                  height="40"
--- a/frontend/scenes/SlackAuth/SlackAuth.js
+++ b/frontend/scenes/SlackAuth/SlackAuth.js
@@ -1,22 +1,19 @@
 import React from 'react';
-import { observer } from 'mobx-react';
+import { observer, inject } from 'mobx-react';
 import { browserHistory } from 'react-router';
 import { client } from 'utils/ApiClient';

-@observer(['user'])
+@inject('user')
+@observer
 class SlackAuth extends React.Component {
  static propTypes = {
    user: React.PropTypes.object.isRequired,
    location: React.PropTypes.object.isRequired,
    route: React.PropTypes.object.isRequired,
-  }
+  };

  componentDidMount = async () => {
-    const {
-      error,
-      code,
-      state,
-    } = this.props.location.query;
+    const { error, code, state } = this.props.location.query;

    if (error) {
      if (error === 'access_denied') {
@@ -43,12 +40,10 @@ class SlackAuth extends React.Component {

      this.props.user.authWithSlack(code, state, redirectTo);
    }
-  }
+  };

  render() {
-    return (
-      <div></div>
-    );
+    return <div />;
  }
 }