Added API to update document tree

This commit is contained in:
Jori Lallo
2016-06-25 22:27:44 -07:00
parent 7ea6eb5d28
commit a0649e6fd3
11 changed files with 182 additions and 30 deletions

View File

@ -56,4 +56,26 @@ router.post('atlases.list', auth(), pagination(), async (ctx) => {
};
});
router.post('atlases.updateNavigationTree', auth(), async (ctx) => {
let { id, tree } = ctx.request.body;
ctx.assertPresent(id, 'id is required');
const user = ctx.state.user;
const atlas = await Atlas.findOne({
where: {
id: id,
teamId: user.teamId,
},
});
if (!atlas) throw httpErrors.NotFound();
const newTree = await atlas.updateNavigationTree(tree);
ctx.body = {
data: await presentAtlas(atlas, true),
tree: newTree,
};
});
export default router;

View File

@ -46,6 +46,7 @@ router.post('documents.create', auth(), async (ctx) => {
atlas,
title,
text,
parentDocument,
} = ctx.request.body;
ctx.assertPresent(atlas, 'atlas is required');
ctx.assertPresent(title, 'title is required');
@ -61,7 +62,18 @@ router.post('documents.create', auth(), async (ctx) => {
if (!ownerAtlas) throw httpErrors.BadRequest();
let parentDocumentObj;
if (parentDocument && ownerAtlas.type === 'atlas') {
parentDocumentObj = await Document.findOne({
where: {
id: parentDocument,
atlasId: ownerAtlas.id,
},
});
}
const document = await Document.create({
parentDocumentId: parentDocumentObj.id,
atlasId: ownerAtlas.id,
teamId: user.teamId,
userId: user.id,
@ -69,6 +81,10 @@ router.post('documents.create', auth(), async (ctx) => {
text: text,
});
// TODO: Move to afterSave hook if possible with imports
ownerAtlas.addNodeToNavigationTree(document);
await ownerAtlas.save();
ctx.body = {
data: await presentDocument(document, true),
};

View File

@ -2,6 +2,7 @@ import {
DataTypes,
sequelize,
} from '../sequelize';
import _isEqual from 'lodash/isEqual';
import Document from './Document';
const allowedAtlasTypes = [['atlas', 'journal']];
@ -30,7 +31,11 @@ const Atlas = sequelize.define('atlas', {
// },
},
instanceMethods: {
async buildStructure() {
async getStructure() {
if (this.atlasStructure) {
return this.atlasStructure;
}
const getNodeForDocument = async (document) => {
const children = await Document.findAll({ where: {
parentDocumentId: document.id,
@ -39,28 +44,110 @@ const Atlas = sequelize.define('atlas', {
let childNodes = []
await Promise.all(children.map(async (child) => {
console.log(child.id)
childNodes.push(await getNodeForDocument(child));
}));
return {
name: document.title,
title: document.title,
id: document.id,
url: document.getUrl(),
children: childNodes,
};
}
const rootDocument = await Document.findOne({ where: {
parentDocumentId: null,
atlasId: this.id,
}});
const rootDocument = await Document.findOne({
where: {
parentDocumentId: null,
atlasId: this.id,
}
});
if (rootDocument) {
return await getNodeForDocument(rootDocument);
} else {
return; // TODO should create a root doc
}
},
async updateNavigationTree(tree) {
let nodeIds = [];
nodeIds.push(tree.id);
const rootDocument = await Document.findOne({
where: {
id: tree.id,
atlasId: this.id,
},
});
if (!rootDocument) throw new Error;
let newTree = {
id: tree.id,
title: rootDocument.title,
url: rootDocument.getUrl(),
children: [],
};
const getIdsForChildren = async (children) => {
const childNodes = [];
for (const child of children) {
const childDocument = await Document.findOne({
where: {
id: child.id,
atlasId: this.id,
},
});
if (!childDocument) throw new Error;
childNodes.push({
id: childDocument.id,
title: childDocument.title,
url: childDocument.getUrl(),
children: await getIdsForChildren(child.children),
})
nodeIds.push(child.id);
}
return childNodes;
};
newTree.children = await getIdsForChildren(tree.children);
const documents = await Document.findAll({
attributes: ['id'],
where: {
atlasId: this.id,
}
});
const documentIds = documents.map(doc => doc.id);
if (!_isEqual(nodeIds.sort(), documentIds.sort())) {
throw new Error('Invalid navigation tree');
}
this.atlasStructure = newTree;
await this.save();
return newTree;
},
async addNodeToNavigationTree(document) {
const newNode = {
id: document.id,
title: document.title,
url: document.getUrl(),
children: [],
}
const insertNode = (node) => {
if (document.parentDocumentId === node.id) {
node.children.push(newNode);
} else {
node.children = node.children.map(childNode => {
return insertNode(childNode);
})
}
return node;
};
this.atlasStructure = insertNode(this.atlasStructure);
}
}
});

View File

@ -33,7 +33,7 @@ export function presentAtlas(atlas, includeRecentDocuments=false) {
if (atlas.type === 'atlas') {
// Todo replace with `.atlasStructure`
data.structure = await atlas.buildStructure();
data.structure = await atlas.getStructure();
}
if (includeRecentDocuments) {

View File

@ -1,4 +1,5 @@
var React = require('react');
import history from 'utils/History';
import styles from './Tree.scss';
import classNames from 'classnames/bind';
@ -79,10 +80,10 @@ var Node = React.createClass({
{!this.props.rootNode && this.renderCollapse()}
<span
className={ cx(styles.nodeLabel, { rootLabel: this.props.rootNode }) }
onClick={() => {}}
onClick={() => { history.push(node.url) }}
onMouseDown={this.props.rootNode ? function(e){e.stopPropagation()} : undefined}
>
{node.name}
{ node.title }
</span>
</div>
{this.renderChildren()}

View File

@ -44,6 +44,7 @@ render((
<Route path="/atlas/:id/new" component={ DocumentEdit } onEnter={ requireAuth } newDocument={ true } />
<Route path="/documents/:id" component={ DocumentScene } onEnter={ requireAuth } />
<Route path="/documents/:id/edit" component={ DocumentEdit } onEnter={ requireAuth } />
<Route path="/documents/:id/new" component={ DocumentEdit } onEnter={ requireAuth } newChildDocument={ true } />
<Route path="/auth/slack" component={SlackAuth} />
</Route>

View File

@ -26,6 +26,10 @@ class DocumentEdit extends Component {
if (this.props.route.newDocument) {
store.atlasId = this.props.params.id;
store.newDocument = true;
} else if (this.props.route.newChildDocument) {
store.documentId = this.props.params.id;
store.newChildDocument = true;
store.fetchDocument();
} else {
store.documentId = this.props.params.id;
store.newDocument = false;
@ -44,7 +48,7 @@ class DocumentEdit extends Component {
// alert("Please add a title before saving (hint: Write a markdown header)");
// return
// }
if (store.newDocument) {
if (store.newDocument || store.newChildDocument) {
store.saveDocument();
} else {
store.updateDocument();

View File

@ -18,9 +18,11 @@ const parseHeader = (text) => {
const documentEditStore = new class DocumentEditStore {
@observable documentId = null;
@observable atlasId = null;
@observable parentDocument;
@observable title;
@observable text;
@observable newDocument;
@observable newChildDocument;
@observable preview;
@observable isFetching;
@ -35,9 +37,13 @@ const documentEditStore = new class DocumentEditStore {
const data = await client.post('/documents.info', {
id: this.documentId,
})
const { title, text } = data.data;
this.title = title;
this.text = text;
if (this.newDocument) {
const { title, text } = data.data;
this.title = title;
this.text = text;
} else {
this.parentDocument = data.data;
}
} catch (e) {
console.error("Something went wrong");
}
@ -51,7 +57,8 @@ const documentEditStore = new class DocumentEditStore {
try {
const data = await client.post('/documents.create', {
atlas: this.atlasId,
parentDocument: this.parentDocument && this.parentDocument.id,
atlas: this.atlasId || this.parentDocument.atlas.id,
title: this.title,
text: this.text,
})

View File

@ -3,7 +3,7 @@ import { observer } from 'mobx-react';
@observer
class SaveAction extends React.Component {
propTypes = {
static propTypes = {
onClick: React.PropTypes.func.isRequired,
disabled: React.PropTypes.bool,
}

View File

@ -30,6 +30,13 @@ class DocumentScene extends React.Component {
}
componentWillReceiveProps = (nextProps) => {
// Reload on url change
const oldId = this.props.params.id;
const newId = nextProps.params.id;
if (oldId !== newId) {
store.fetchDocument(newId);
}
// Scroll to anchor after loading, and only once
const { hash } = this.props.location;
@ -57,17 +64,10 @@ class DocumentScene extends React.Component {
);
}
// onClickNode = (node) => {
// this.setState({
// active: node
// });
// }
// handleChange = (tree) => {
// this.setState({
// tree: tree
// });
// }
handleChange = (tree) => {
console.log(tree);
store.updateNavigationTree(tree);
}
render() {
const doc = store.document;
@ -114,7 +114,7 @@ class DocumentScene extends React.Component {
{ store.isAtlas ? (
<div className={ styles.sidebar }>
<Tree
paddingLeft={20}
paddingLeft={10}
tree={ doc.atlas.structure }
onChange={this.handleChange}
isNodeCollapsed={this.isNodeCollapsed}

View File

@ -11,8 +11,8 @@ const store = new class DocumentSceneStore {
/* Computed */
@computed get isAtlas() {
console.log(this.document.atlas.type)
return this.document.atlas.type === 'atlas';
return this.document &&
this.document.atlas.type === 'atlas';
}
/* Actions */
@ -42,6 +42,20 @@ const store = new class DocumentSceneStore {
}
this.isFetching = false;
}
@action updateNavigationTree = async (tree) => {
this.isFetching = true;
try {
const res = await client.post('/atlases.updateNavigationTree', {
id: this.document.atlas.id,
tree: tree,
});
} catch (e) {
console.error("Something went wrong");
}
this.isFetching = false;
}
}();
export default store;