diff --git a/frontend/components/Document/Document.js b/frontend/components/Document/Document.js index d50b3fb0c..9902fdfaf 100644 --- a/frontend/components/Document/Document.js +++ b/frontend/components/Document/Document.js @@ -1,4 +1,5 @@ import React, { PropTypes } from 'react'; +import { toJS } from 'mobx'; import { observer } from 'mobx-react'; import PublishingInfo from 'components/PublishingInfo'; @@ -50,10 +51,11 @@ class Document extends React.Component { return (
diff --git a/frontend/components/PublishingInfo/PublishingInfo.js b/frontend/components/PublishingInfo/PublishingInfo.js index e656926f2..a9b5f12ae 100644 --- a/frontend/components/PublishingInfo/PublishingInfo.js +++ b/frontend/components/PublishingInfo/PublishingInfo.js @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { PropTypes } from 'react'; import moment from 'moment'; import { Avatar } from 'rebass'; @@ -6,27 +6,45 @@ import { Flex } from 'reflexbox'; import styles from './PublishingInfo.scss'; -const PublishingInfo = (props) => { - return ( - - - - { props.name } published { moment(props.createdAt).fromNow() } - { props.createdAt !== props.updatedAt ? ( - -  and modified { moment(props.updatedAt).fromNow() } - - ) : null } - - - ); -}; +class PublishingInfo extends React.Component { + static propTypes = { + collaborators: PropTypes.object.isRequired, + createdAt: PropTypes.string.isRequired, + createdBy: PropTypes.object.isRequired, + updatedAt: PropTypes.string.isRequired, + updatedBy: PropTypes.object.isRequired, + }; -PublishingInfo.propTypes = { - avatarUrl: React.PropTypes.string.isRequired, - name: React.PropTypes.string.isRequired, - createdAt: React.PropTypes.string.isRequired, - updatedAt: React.PropTypes.string.isRequired, -}; + render() { + return ( + + + { this.props.collaborators.reverse().map(user => ( + + )) } + + + { this.props.createdBy.name } published { moment(this.props.createdAt).fromNow() } + { this.props.createdAt !== this.props.updatedAt ? ( + +  and + { this.props.createdBy.id !== this.props.updatedBy.id && + ` ${this.props.updatedBy.name} ` } + modified { moment(this.props.updatedAt).fromNow() } + + ) : null } + + + ); + } +} export default PublishingInfo; diff --git a/frontend/components/PublishingInfo/PublishingInfo.scss b/frontend/components/PublishingInfo/PublishingInfo.scss index bc1f0e282..d65d7673c 100644 --- a/frontend/components/PublishingInfo/PublishingInfo.scss +++ b/frontend/components/PublishingInfo/PublishingInfo.scss @@ -1,3 +1,8 @@ +.avatarLine { + flex-direction: row-reverse; + margin-right: 10px; +} + .user { margin-bottom: 30px; color: #ccc;