fedi/lemmy
1
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy.git synced 2024-11-11 10:33:06 +00:00
Code Issues Packages Projects Releases Wiki Activity

Adding correct comment ordering

Browse source
This commit is contained in:
Dessalines 2019-03-27 11:37:16 -07:00
parent d8d3ff6c95
commit fa3791e502
3 changed files with 20 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
server/src/actions/comment.rs
View file

@ -103,6 +103,7 @@ impl Comment {
pub fn from_post(conn: &PgConnection, post: &Post) -> Result<Vec<Self>, Error> { pub fn from_post(conn: &PgConnection, post: &Post) -> Result<Vec<Self>, Error> {
use schema::community::dsl::*; use schema::community::dsl::*;
Comment::belonging_to(post) Comment::belonging_to(post)
.order_by(comment::published.desc())
.load::<Self>(conn) .load::<Self>(conn)
} }
} }

15
ui/src/components/post.tsx
View file

@ -131,7 +131,7 @@ export class Post extends Component<any, State> {
commentsTree() { commentsTree() {
let nodes = this.buildCommentsTree(); let nodes = this.buildCommentsTree();
return ( return (
<div className="sticky-top"> <div className="">
<CommentNodes nodes={nodes} /> <CommentNodes nodes={nodes} />
</div> </div>
); );
@ -147,7 +147,7 @@ export class Post extends Component<any, State> {
} else if (op == UserOperation.GetPost) { } else if (op == UserOperation.GetPost) {
let res: PostResponse = msg; let res: PostResponse = msg;
this.state.post = res.post; this.state.post = res.post;
this.state.comments = res.comments.reverse(); this.state.comments = res.comments;
this.setState(this.state); this.setState(this.state);
} else if (op == UserOperation.CreateComment) { } else if (op == UserOperation.CreateComment) {
let res: CommentResponse = msg; let res: CommentResponse = msg;
@ -177,10 +177,11 @@ export class CommentNodes extends Component<CommentNodesProps, CommentNodesState
return ( return (
<div className="comments"> <div className="comments">
{this.props.nodes.map(node => {this.props.nodes.map(node =>
<div className="comment ml-2"> <div className={`comment ${node.comment.parent_id ? 'ml-4' : ''}`}>
<div className="float-left small font-weight-light"> <div className="float-left small text-center">
<div className="pointer">▲</div> <div className="pointer upvote">▲</div>
<div className="pointer">▼</div> <div>20</div>
<div className="pointer downvote">▼</div>
</div> </div>
<div className="details ml-4"> <div className="details ml-4">
<ul class="list-inline mb-0 text-muted small"> <ul class="list-inline mb-0 text-muted small">
@ -189,7 +190,7 @@ export class CommentNodes extends Component<CommentNodesProps, CommentNodesState
</li> </li>
<li className="list-inline-item"> <li className="list-inline-item">
<span>( <span>(
<span className="text-info"> 1300</span> <span className="text-info"> +1300</span>
<span> | </span> <span> | </span>
<span className="text-danger">-29</span> <span className="text-danger">-29</span>
<span> ) points</span> <span> ) points</span>

11
ui/src/main.css
View file

@ -1,3 +1,14 @@
.pointer { .pointer {
cursor: pointer; cursor: pointer;
} }
.upvote:hover {
color: var(--info);
}
.downvote:hover {
color: var(--danger);
}