Boilerplate for /search
This commit is contained in:
parent
50ea3439ea
commit
e10e6fb548
|
@ -95,6 +95,7 @@
|
|||
"react-dom": "15.1.0",
|
||||
"react-dropzone": "3.3.2",
|
||||
"react-helmet": "3.1.0",
|
||||
"react-keydown": "^1.6.1",
|
||||
"react-router": "2.5.1",
|
||||
"rebass": "0.2.6",
|
||||
"safestart": "0.8.0",
|
||||
|
|
|
@ -1,7 +1,8 @@
|
|||
import React from 'react';
|
||||
import Link from 'react-router/lib/Link';
|
||||
import { browserHistory, Link } from 'react-router';
|
||||
import Helmet from 'react-helmet';
|
||||
import { observer } from 'mobx-react';
|
||||
import keydown from 'react-keydown';
|
||||
|
||||
import DropdownMenu, { MenuItem } from 'components/DropdownMenu';
|
||||
import Flex from 'components/Flex';
|
||||
|
@ -21,6 +22,17 @@ class Layout extends React.Component {
|
|||
fixed: React.PropTypes.bool,
|
||||
loading: React.PropTypes.bool,
|
||||
user: React.PropTypes.object.isRequired,
|
||||
search: React.PropTypes.bool,
|
||||
}
|
||||
|
||||
static defaultProps = {
|
||||
search: true,
|
||||
}
|
||||
|
||||
@keydown(['/', 't'])
|
||||
search() {
|
||||
if (!this.props.search) return;
|
||||
browserHistory.push('/search');
|
||||
}
|
||||
|
||||
render() {
|
||||
|
@ -50,11 +62,13 @@ class Layout extends React.Component {
|
|||
<Flex align="center" className={ styles.actions }>
|
||||
{ this.props.actions }
|
||||
</Flex>
|
||||
<Flex>
|
||||
<div className={ styles.search }>
|
||||
<img src={ require('assets/icons/search.svg') } />
|
||||
</div>
|
||||
</Flex>
|
||||
{ this.props.search && (
|
||||
<Flex>
|
||||
<div className={ styles.search } onClick={ this.search }>
|
||||
<img src={ require('assets/icons/search.svg') } />
|
||||
</div>
|
||||
</Flex>
|
||||
) }
|
||||
<DropdownMenu label={
|
||||
<Avatar
|
||||
circle
|
||||
|
@ -75,4 +89,4 @@ class Layout extends React.Component {
|
|||
}
|
||||
}
|
||||
|
||||
export default Layout;
|
||||
export default Layout;
|
||||
|
|
|
@ -22,6 +22,7 @@ import Dashboard from 'scenes/Dashboard';
|
|||
import Atlas from 'scenes/Atlas';
|
||||
import DocumentScene from 'scenes/DocumentScene';
|
||||
import DocumentEdit from 'scenes/DocumentEdit';
|
||||
import Search from 'scenes/Search';
|
||||
import SlackAuth from 'scenes/SlackAuth';
|
||||
|
||||
let DevTools;
|
||||
|
@ -52,6 +53,8 @@ render((
|
|||
<Route path="/documents/:id/edit" component={ DocumentEdit } onEnter={ requireAuth } />
|
||||
<Route path="/documents/:id/new" component={ DocumentEdit } onEnter={ requireAuth } newChildDocument={ true } />
|
||||
|
||||
<Route path="/search" component={ Search } onEnter={ requireAuth } />
|
||||
|
||||
<Route path="/auth/slack" component={SlackAuth} />
|
||||
</Route>
|
||||
</Router>
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
import React, { Component } from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
import { browserHistory, withRouter } from 'react-router';
|
||||
import keydown from 'react-keydown';
|
||||
|
||||
import DocumentEditStore, {
|
||||
DOCUMENT_EDIT_SETTINGS,
|
||||
|
@ -132,6 +133,7 @@ class DocumentEdit extends Component {
|
|||
titleText={ titleText }
|
||||
fixed
|
||||
loading={ this.store.isSaving }
|
||||
search={ false }
|
||||
>
|
||||
{ (this.store.isFetching || !('Editor' in this.state)) ? (
|
||||
<CenteredContent>
|
||||
|
|
|
@ -0,0 +1,27 @@
|
|||
import React from 'react';
|
||||
import { observer } from 'mobx-react';
|
||||
|
||||
import Flex from 'components/Flex';
|
||||
import Layout from 'components/Layout';
|
||||
import CenteredContent from 'components/CenteredContent';
|
||||
|
||||
@observer
|
||||
class Search extends React.Component {
|
||||
render() {
|
||||
return (
|
||||
<Layout
|
||||
title="Search"
|
||||
titleText="Search"
|
||||
search={ false }
|
||||
>
|
||||
<CenteredContent>
|
||||
<Flex direction="column" flex={ true }>
|
||||
TBA
|
||||
</Flex>
|
||||
</CenteredContent>
|
||||
</Layout>
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
export default Search;
|
|
@ -0,0 +1,2 @@
|
|||
import Search from './Search';
|
||||
export default Search;
|
Reference in New Issue