diff --git a/src/actions/findbar.js b/src/actions/findbar.js index 418c3296..dc1ea0cb 100644 --- a/src/actions/findbar.js +++ b/src/actions/findbar.js @@ -10,6 +10,10 @@ export function run(commandName, payload) { return { type: RUN_COMMAND, command: commandName, payload }; } +export function navigateToCollection(collectionName) { + return runCommand(SHOW_COLLECTION, { collectionName }); +} + export function createNewEntryInCollection(collectionName) { return runCommand(CREATE_COLLECTION, { collectionName }); } diff --git a/src/containers/App.js b/src/containers/App.js index 04a76a44..b394fa0c 100644 --- a/src/containers/App.js +++ b/src/containers/App.js @@ -1,7 +1,7 @@ import React from 'react'; import pluralize from 'pluralize'; import { connect } from 'react-redux'; -import { Layout, Panel } from 'react-toolbox'; +import { Layout, Panel, NavDrawer, Navigation, Link } from 'react-toolbox'; import { loadConfig } from '../actions/config'; import { loginUser } from '../actions/auth'; import { currentBackend } from '../backends/backend'; @@ -10,6 +10,7 @@ import { CREATE_COLLECTION, HELP, runCommand, + navigateToCollection, createNewEntryInCollection } from '../actions/findbar'; import { AppHeader, Loader } from '../components/UI/index'; @@ -17,6 +18,10 @@ import styles from './App.css'; class App extends React.Component { + state = { + navDrawerIsVisible: false + } + componentDidMount() { this.props.dispatch(loadConfig()); } @@ -90,8 +95,23 @@ class App extends React.Component { return { commands, defaultCommands }; } + toggleNavDrawer = () => { + this.setState({ + navDrawerIsVisible: !this.state.navDrawerIsVisible + }); + } + render() { - const { user, config, children, collections } = this.props; + const { navDrawerIsVisible } = this.state; + const { + user, + config, + children, + collections, + runCommand, + navigateToCollection, + createNewEntryInCollection + } = this.props; if (config === null) { return null; @@ -112,14 +132,36 @@ class App extends React.Component { const { commands, defaultCommands } = this.generateFindBarCommands(); return ( - + + + +
{children} @@ -143,6 +185,9 @@ function mapDispatchToProps(dispatch) { runCommand: (type, payload) => { dispatch(runCommand(type, payload)); }, + navigateToCollection: (collection) => { + dispatch(navigateToCollection(collection)); + }, createNewEntryInCollection: (collectionName) => { dispatch(createNewEntryInCollection(collectionName)); }