Merge branch 'master' into markitup-react

This commit is contained in:
Andrey Okonetchnikov
2016-10-03 16:57:48 +02:00
30 changed files with 392 additions and 466 deletions

View File

@ -4,7 +4,17 @@
.nav {
display: block;
padding: 1rem;
& .heading {
border: none;
}
}
.main {
padding-top: 54px;
}
.navDrawer {
max-width: 240px !important;
& .drawerContent {
max-width: 240px !important;
}
}

View File

@ -20,8 +20,8 @@ import styles from './App.css';
class App extends React.Component {
state = {
navDrawerIsVisible: false
}
navDrawerIsVisible: true
};
componentDidMount() {
this.props.dispatch(loadConfig());
@ -100,7 +100,7 @@ class App extends React.Component {
this.setState({
navDrawerIsVisible: !this.state.navDrawerIsVisible
});
}
};
render() {
const { navDrawerIsVisible } = this.state;
@ -135,18 +135,19 @@ class App extends React.Component {
return (
<Layout theme={styles}>
<NavDrawer
active={navDrawerIsVisible}
scrollY
permanentAt="md"
active={navDrawerIsVisible}
scrollY
permanentAt={navDrawerIsVisible ? 'lg' : null}
theme={styles}
>
<nav className={styles.nav}>
<h1>Collections</h1>
<h1 className={styles.heading}>Collections</h1>
<Navigation type='vertical'>
{
collections.valueSeq().map(collection =>
<Link
key={collection.get('name')}
onClick={navigateToCollection.bind(this, collection.get('name'))}
key={collection.get('name')}
onClick={navigateToCollection.bind(this, collection.get('name'))}
>
{collection.get('label')}
</Link>
@ -157,14 +158,14 @@ class App extends React.Component {
</NavDrawer>
<Panel scrollY>
<AppHeader
collections={collections}
commands={commands}
defaultCommands={defaultCommands}
runCommand={runCommand}
onCreateEntryClick={createNewEntryInCollection}
toggleNavDrawer={this.toggleNavDrawer}
collections={collections}
commands={commands}
defaultCommands={defaultCommands}
runCommand={runCommand}
onCreateEntryClick={createNewEntryInCollection}
toggleNavDrawer={this.toggleNavDrawer}
/>
<div className={`${styles.alignable} ${styles.main}`}>
<div className={styles.main}>
{children}
</div>
</Panel>

View File

@ -1,39 +1,39 @@
.alignable {
margin: 0px auto;
.root {
margin: auto;
}
@media (max-width: 749px) and (min-width: 495px) {
.alignable {
.root {
width: 495px;
margin: auto;
}
}
@media (max-width: 1004px) and (min-width: 750px) {
.alignable {
.root {
width: 750px;
margin: auto;
}
}
@media (max-width: 1259px) and (min-width: 1005px) {
.alignable {
@media (max-width: 1514px) and (min-width: 1005px) {
.root {
width: 1005px;
margin: auto;
}
}
@media (max-width: 1514px) and (min-width: 1260px) {
.alignable {
width: 1260px;
}
}
@media (max-width: 1769px) and (min-width: 1515px) {
.alignable {
.root {
width: 1515px;
margin: auto;
}
}
@media (min-width: 1770px) {
.alignable {
.root {
width: 1770px;
margin: auto;
}
}

View File

@ -9,6 +9,13 @@ import styles from './CollectionPage.css';
import CollectionPageHOC from './editorialWorkflow/CollectionPageHOC';
class DashboardPage extends React.Component {
static propTypes = {
collection: ImmutablePropTypes.map.isRequired,
collections: ImmutablePropTypes.orderedMap.isRequired,
dispatch: PropTypes.func.isRequired,
entries: ImmutablePropTypes.list,
};
componentDidMount() {
const { collection, dispatch } = this.props;
if (collection) {
@ -30,7 +37,7 @@ class DashboardPage extends React.Component {
}
return <div className={styles.alignable}>
return <div className={styles.root}>
{entries ?
<EntryListing collection={collection} entries={entries}/>
:
@ -39,12 +46,6 @@ class DashboardPage extends React.Component {
</div>;
}
}
DashboardPage.propTypes = {
collection: ImmutablePropTypes.map.isRequired,
collections: ImmutablePropTypes.orderedMap.isRequired,
dispatch: PropTypes.func.isRequired,
entries: ImmutablePropTypes.list,
};
/*
* Instead of checking the publish mode everywhere to dispatch & render the additional editorial workflow stuff,

View File

@ -15,11 +15,22 @@ import EntryEditor from '../components/EntryEditor/EntryEditor';
import EntryPageHOC from './editorialWorkflow/EntryPageHOC';
class EntryPage extends React.Component {
constructor(props) {
super(props);
this.createDraft = this.createDraft.bind(this);
this.handlePersistEntry = this.handlePersistEntry.bind(this);
}
static propTypes = {
addMedia: PropTypes.func.isRequired,
boundGetMedia: PropTypes.func.isRequired,
changeDraft: PropTypes.func.isRequired,
collection: ImmutablePropTypes.map.isRequired,
createDraftFromEntry: PropTypes.func.isRequired,
createEmptyDraft: PropTypes.func.isRequired,
discardDraft: PropTypes.func.isRequired,
entry: ImmutablePropTypes.map,
entryDraft: ImmutablePropTypes.map.isRequired,
loadEntry: PropTypes.func.isRequired,
persistEntry: PropTypes.func.isRequired,
removeMedia: PropTypes.func.isRequired,
slug: PropTypes.string,
newEntry: PropTypes.bool.isRequired,
};
componentDidMount() {
if (!this.props.newEntry) {
@ -45,13 +56,13 @@ class EntryPage extends React.Component {
this.props.discardDraft();
}
createDraft(entry) {
createDraft = entry => {
if (entry) this.props.createDraftFromEntry(entry);
}
};
handlePersistEntry() {
handlePersistEntry = () => {
this.props.persistEntry(this.props.collection, this.props.entryDraft);
}
};
render() {
const {
@ -75,23 +86,6 @@ class EntryPage extends React.Component {
}
}
EntryPage.propTypes = {
addMedia: PropTypes.func.isRequired,
boundGetMedia: PropTypes.func.isRequired,
changeDraft: PropTypes.func.isRequired,
collection: ImmutablePropTypes.map.isRequired,
createDraftFromEntry: PropTypes.func.isRequired,
createEmptyDraft: PropTypes.func.isRequired,
discardDraft: PropTypes.func.isRequired,
entry: ImmutablePropTypes.map,
entryDraft: ImmutablePropTypes.map.isRequired,
loadEntry: PropTypes.func.isRequired,
persistEntry: PropTypes.func.isRequired,
removeMedia: PropTypes.func.isRequired,
slug: PropTypes.string,
newEntry: PropTypes.bool.isRequired,
};
function mapStateToProps(state, ownProps) {
const { collections, entryDraft } = state;
const collection = collections.get(ownProps.params.name);

View File

@ -10,6 +10,11 @@ import styles from '../CollectionPage.css';
export default function CollectionPageHOC(CollectionPage) {
class CollectionPageHOC extends CollectionPage {
static propTypes = {
dispatch: PropTypes.func.isRequired,
isEditorialWorkflow: PropTypes.bool.isRequired,
unpublishedEntries: ImmutablePropTypes.map,
};
componentDidMount() {
const { dispatch, isEditorialWorkflow } = this.props;
@ -24,24 +29,20 @@ export default function CollectionPageHOC(CollectionPage) {
if (!isEditorialWorkflow) return super.render();
return (
<div className={styles.alignable}>
<UnpublishedListing
<div>
<div className={styles.root}>
<UnpublishedListing
entries={unpublishedEntries}
handleChangeStatus={updateUnpublishedEntryStatus}
handlePublish={publishUnpublishedEntry}
/>
/>
</div>
{super.render()}
</div>
);
}
}
CollectionPageHOC.propTypes = {
dispatch: PropTypes.func.isRequired,
isEditorialWorkflow: PropTypes.bool.isRequired,
unpublishedEntries: ImmutablePropTypes.map,
};
function mapStateToProps(state) {
const publish_mode = state.config.get('publish_mode');
const isEditorialWorkflow = (publish_mode === EDITORIAL_WORKFLOW);