2018-08-08 05:08:44 +00:00
|
|
|
// @flow
|
|
|
|
import * as React from 'react';
|
2019-01-19 08:23:39 +00:00
|
|
|
import { Redirect } from 'react-router-dom';
|
|
|
|
import { observable } from 'mobx';
|
2019-04-18 02:11:23 +00:00
|
|
|
import { observer, inject } from 'mobx-react';
|
2018-08-08 05:08:44 +00:00
|
|
|
import { MoreIcon } from 'outline-icons';
|
|
|
|
|
|
|
|
import { newDocumentUrl } from 'utils/routeHelpers';
|
|
|
|
import Document from 'models/Document';
|
2019-04-18 02:11:23 +00:00
|
|
|
import CollectionsStore from 'stores/CollectionsStore';
|
2018-08-08 05:08:44 +00:00
|
|
|
import { DropdownMenu, DropdownMenuItem } from 'components/DropdownMenu';
|
|
|
|
|
|
|
|
type Props = {
|
|
|
|
label?: React.Node,
|
|
|
|
document: Document,
|
2019-04-18 02:11:23 +00:00
|
|
|
collections: CollectionsStore,
|
2018-08-08 05:08:44 +00:00
|
|
|
};
|
|
|
|
|
2019-01-19 08:23:39 +00:00
|
|
|
@observer
|
2018-08-08 05:08:44 +00:00
|
|
|
class NewChildDocumentMenu extends React.Component<Props> {
|
2019-01-19 08:23:39 +00:00
|
|
|
@observable redirectTo: ?string;
|
|
|
|
|
2019-01-19 09:31:34 +00:00
|
|
|
componentDidUpdate() {
|
|
|
|
this.redirectTo = undefined;
|
|
|
|
}
|
|
|
|
|
2018-08-08 05:08:44 +00:00
|
|
|
handleNewDocument = () => {
|
2019-04-18 02:11:23 +00:00
|
|
|
const { document } = this.props;
|
|
|
|
this.redirectTo = newDocumentUrl(document.collectionId);
|
2018-08-08 05:08:44 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
handleNewChild = () => {
|
2019-01-19 08:23:39 +00:00
|
|
|
const { document } = this.props;
|
2019-04-18 02:11:23 +00:00
|
|
|
this.redirectTo = newDocumentUrl(document.collectionId, document.id);
|
2018-08-08 05:08:44 +00:00
|
|
|
};
|
|
|
|
|
|
|
|
render() {
|
2019-01-26 13:01:33 +00:00
|
|
|
if (this.redirectTo) return <Redirect to={this.redirectTo} push />;
|
2019-01-19 08:23:39 +00:00
|
|
|
|
2019-04-18 02:11:23 +00:00
|
|
|
const { label, document, collections, ...rest } = this.props;
|
|
|
|
const collection = collections.get(document.collectionId);
|
2018-08-08 05:08:44 +00:00
|
|
|
|
|
|
|
return (
|
|
|
|
<DropdownMenu label={label || <MoreIcon />} {...rest}>
|
|
|
|
<DropdownMenuItem onClick={this.handleNewDocument}>
|
|
|
|
<span>
|
2019-04-18 02:11:23 +00:00
|
|
|
New document in{' '}
|
|
|
|
<strong>{collection ? collection.name : 'collection'}</strong>
|
2018-08-08 05:08:44 +00:00
|
|
|
</span>
|
|
|
|
</DropdownMenuItem>
|
2019-04-06 23:20:27 +00:00
|
|
|
<DropdownMenuItem onClick={this.handleNewChild}>
|
2019-12-19 05:00:36 +00:00
|
|
|
New nested document
|
2019-04-06 23:20:27 +00:00
|
|
|
</DropdownMenuItem>
|
2018-08-08 05:08:44 +00:00
|
|
|
</DropdownMenu>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
2019-04-18 02:11:23 +00:00
|
|
|
export default inject('collections')(NewChildDocumentMenu);
|