Vulcan/packages/nova-base-components/lib/posts/PostsItem.jsx

85 lines
2.5 KiB
React
Raw Normal View History

import React, { PropTypes, Component } from 'react';
import { Button } from 'react-bootstrap';
import moment from 'moment';
2016-05-22 15:23:30 +09:00
import { ModalTrigger } from "meteor/nova:core";
2016-03-30 10:52:40 +09:00
2016-04-14 10:12:35 +09:00
class PostsItem extends Component {
2016-02-18 21:53:44 +09:00
renderCategories() {
return this.props.post.categoriesArray ? <Telescope.components.PostsCategories post={this.props.post} /> : "";
}
2016-02-18 21:53:44 +09:00
renderCommenters() {
return this.props.post.commentersArray ? <Telescope.components.PostsCommenters post={this.props.post}/> : "";
}
2016-02-18 21:53:44 +09:00
renderActions() {
2016-02-25 21:05:53 +09:00
2016-02-25 21:32:13 +09:00
const component = (
<ModalTrigger title="Edit Post" component={<a className="posts-action-edit">Edit</a>}>
<Telescope.components.PostsEditForm post={this.props.post}/>
</ModalTrigger>
2016-02-25 21:32:13 +09:00
);
2016-02-25 21:05:53 +09:00
2016-02-18 21:53:44 +09:00
return (
2016-02-19 10:12:08 +09:00
<div className="post-actions">
{Users.can.edit(this.context.currentUser, this.props.post) ? component : ""}
2016-02-19 10:12:08 +09:00
</div>
2016-02-18 21:53:44 +09:00
)
}
2016-02-18 21:53:44 +09:00
render() {
const post = this.props.post;
let postClass = "posts-item";
2016-04-26 09:12:38 +09:00
if (post.sticky) postClass += " posts-sticky";
2016-03-24 16:19:46 +09:00
2016-03-24 16:03:30 +09:00
// console.log(post)
// console.log(post.user)
2016-02-18 21:53:44 +09:00
return (
2016-03-24 16:19:46 +09:00
<div className={postClass}>
2016-02-18 21:53:44 +09:00
<div className="posts-item-vote">
<Telescope.components.Vote post={post} currentUser={this.context.currentUser}/>
2016-03-24 16:03:30 +09:00
</div>
2016-02-18 21:53:44 +09:00
{post.thumbnailUrl ? <Telescope.components.PostsThumbnail post={post}/> : null}
2016-03-27 18:17:20 +09:00
<div className="posts-item-content">
2016-03-24 16:03:30 +09:00
<h3 className="posts-item-title">
<a className="posts-item-title-link" href={Posts.getLink(post)} target={Posts.getLinkTarget(post)}>{post.title}</a>
2016-03-24 16:03:30 +09:00
{this.renderCategories()}
</h3>
<div className="posts-item-meta">
{post.user? <div className="posts-item-user"><Telescope.components.UsersAvatar user={post.user} size="small"/><Telescope.components.UsersName user={post.user}/></div> : null}
<div className="posts-item-date">{moment(post.postedAt).fromNow()}</div>
<div className="posts-item-comments"><a href={Posts.getPageUrl(post)}>{post.commentCount}&nbsp;comments</a></div>
2016-05-03 23:53:45 +07:00
{(this.context.currentUser && this.context.currentUser.isAdmin) ?<Telescope.components.PostsStats post={post} />:null}
2016-03-24 16:03:30 +09:00
{this.renderActions()}
</div>
2016-03-27 16:32:29 +09:00
2016-03-24 16:03:30 +09:00
</div>
2016-02-18 21:53:44 +09:00
{this.renderCommenters()}
2016-03-24 16:03:30 +09:00
2016-02-18 21:53:44 +09:00
</div>
)
}
};
2016-04-14 10:12:35 +09:00
PostsItem.propTypes = {
post: React.PropTypes.object.isRequired
}
2016-04-14 10:12:35 +09:00
PostsItem.contextTypes = {
currentUser: React.PropTypes.object
};
2016-04-14 10:12:35 +09:00
module.exports = PostsItem;
export default PostsItem;