coop-cloud-chaos-patchs/outline
Archived
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Upgraded dependencies

Browse Source
This commit is contained in:
Jori Lallo
2017-04-26 22:18:36 -07:00
parent c0a8d71bb9
commit b34d80717b
8 changed files with 825 additions and 798 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
frontend/components/Layout/Layout.js
View File

@ -1,7 +1,7 @@
import React from 'react';
import { browserHistory, Link } from 'react-router';
import Helmet from 'react-helmet';
import { observer } from 'mobx-react';
import { observer, inject } from 'mobx-react';
import { injectOffline } from 'components/Offline';
import keydown from 'react-keydown';
import _ from 'lodash';
@ -16,7 +16,8 @@ import styles from './Layout.scss';
import classNames from 'classnames/bind';
const cx = classNames.bind(styles);
@observer(['user'])
@inject('user')
@observer
@injectOffline
class Layout extends React.Component {
static propTypes = {
@ -29,11 +30,11 @@ class Layout extends React.Component {
search: React.PropTypes.bool,
offline: React.PropTypes.bool,
notifications: React.PropTypes.node,
}
};
static defaultProps = {
search: true,
}
};
@keydown(['/', 't'])
search() {
@ -51,72 +52,68 @@ class Layout extends React.Component {
const user = this.props.user;
return (
<div className={ styles.container }>
<div className={styles.container}>
<Helmet
title={ this.props.titleText
? `${this.props.titleText} - Atlas`
: 'Atlas' }
title={
this.props.titleText ? `${this.props.titleText} - Atlas` : 'Atlas'
}
/>
{ this.props.loading && (
<LoadingIndicator />
) }
{this.props.loading && <LoadingIndicator />}
{ this.props.offline && (
{this.props.offline &&
<Alert offline>
It looks like you're offline. Reconnect to restore access to all of your documents 📚
</Alert>
) }
</Alert>}
{ this.props.notifications }
{this.props.notifications}
<div className={ cx(styles.header) }>
<div className={ styles.headerLeft }>
<Link to="/" className={ styles.team }>Atlas</Link>
<span className={ styles.title }>
{ this.props.title }
<div className={cx(styles.header)}>
<div className={styles.headerLeft}>
<Link to="/" className={styles.team}>Atlas</Link>
<span className={styles.title}>
{this.props.title}
</span>
</div>
<Flex className={ styles.headerRight }>
<Flex className={styles.headerRight}>
<Flex>
<Flex align="center" className={ styles.actions }>
{ this.props.actions }
<Flex align="center" className={styles.actions}>
{this.props.actions}
</Flex>
{ user.user && (
{user.user &&
<Flex>
{ this.props.search && (
{this.props.search &&
<Flex>
<div
onClick={ this.search }
className={ styles.search }
onClick={this.search}
className={styles.search}
title="Search (/)"
>
<img src={ require('assets/icons/search.svg') } alt="Search" />
<img
src={require('assets/icons/search.svg')}
alt="Search"
/>
</div>
</Flex>
) }
</Flex>}
<DropdownMenu
label={ <Avatar
circle
size={ 24 }
src={ user.user.avatarUrl }
/> }
label={
<Avatar circle size={24} src={user.user.avatarUrl} />
}
>
<MenuItem to="/settings">Settings</MenuItem>
<MenuItem to="/keyboard-shortcuts">Keyboard shortcuts</MenuItem>
<MenuItem to="/keyboard-shortcuts">
Keyboard shortcuts
</MenuItem>
<MenuItem to="/developers">API</MenuItem>
<MenuItem onClick={ user.logout }>Logout</MenuItem>
<MenuItem onClick={user.logout}>Logout</MenuItem>
</DropdownMenu>
</Flex>
) }
</Flex>}
</Flex>
</Flex>
</div>
<div
className={ cx(styles.content) }
>
{ this.props.children }
<div className={cx(styles.content)}>
{this.props.children}
</div>
</div>
);