Added "Create new" buttons to the header. Closes #49

Note that this is temp solution UI-wise since it won't scale.
This commit is contained in:
Andrey Okonetchnikov 2016-09-15 11:12:33 +02:00
parent 52ff3c415f
commit 5409cc1022
3 changed files with 32 additions and 5 deletions

View File

@ -10,14 +10,18 @@ export function run(commandName, payload) {
return { type: RUN_COMMAND, command: commandName, payload };
}
export function createNewEntryInCollection(collectionName) {
return runCommand(CREATE_COLLECTION, { collectionName });
}
export function runCommand(commandName, payload) {
return (dispatch, getState) => {
return dispatch => {
switch (commandName) {
case SHOW_COLLECTION:
history.push(`/collections/${payload.collectionName}`);
break;
case CREATE_COLLECTION:
window.alert(`Create a new ${payload.collectionName} - not supported yet`);
history.push(`/collections/${payload.collectionName}/entries/new`);
break;
case HELP:
window.alert('Find Bar Help (PLACEHOLDER)\n\nLorem ipsum dolor sit amet, consectetur adipiscing elit.');

View File

@ -16,6 +16,8 @@
color: #fff;
}
.actions {}
.findBar {
flex: 1;
}

View File

@ -1,14 +1,19 @@
import React from 'react';
import { connect } from 'react-redux';
import { IndexLink } from 'react-router';
import pluralize from 'pluralize';
import { loadConfig } from '../actions/config';
import { loginUser } from '../actions/auth';
import { currentBackend } from '../backends/backend';
import { Loader } from '../components/UI';
import { SHOW_COLLECTION, CREATE_COLLECTION, HELP } from '../actions/findbar';
import {
SHOW_COLLECTION,
CREATE_COLLECTION,
HELP,
createNewEntryInCollection
} from '../actions/findbar';
import FindBar from './FindBar';
import styles from './App.css';
import pluralize from 'pluralize';
class App extends React.Component {
componentDidMount() {
@ -84,8 +89,14 @@ class App extends React.Component {
return { commands, defaultCommands };
}
handleCreatePostClick = collectionName => {
this.props.dispatch(
createNewEntryInCollection(collectionName)
);
}
render() {
const { user, config, children } = this.props;
const { user, config, children, collections } = this.props;
if (config === null) {
return null;
@ -117,6 +128,16 @@ class App extends React.Component {
defaultCommands={defaultCommands}
/>
</div>
<div className={styles.actions}>
{
collections.map(collection =>
<button
onClick={this.handleCreatePostClick.bind(this, collection.get('name'))}
>
+ {pluralize(collection.get('label'), 1)}
</button>)
}
</div>
</header>
<div className={styles.main}>
{children}