Adding correct comment ordering

diff --git a/server/src/actions/comment.rs b/server/src/actions/comment.rs
index ceedf2945eb27a99a985303acc4ca812cefbb230..93e808a4400d54f2c8221319c35777153016cf0b 100644 (file)
--- a/server/src/actions/comment.rs
+++ b/server/src/actions/comment.rs
@@ -103,6 +103,7 @@ impl Comment {
   pub fn from_post(conn: &PgConnection, post: &Post) -> Result<Vec<Self>, Error> {
     use schema::community::dsl::*;
     Comment::belonging_to(post)
+      .order_by(comment::published.desc())
       .load::<Self>(conn) 
   }
 }

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

diff --git a/ui/src/main.css b/ui/src/main.css
index cb2d53d44a851e65d39fd73999e4b27bdd362d84..30fbc8dcc184a6e6b088c60de0359b96e76ae4a7 100644 (file)
--- a/ui/src/main.css
+++ b/ui/src/main.css
@@ -1,3 +1,14 @@
+
+
+
 .pointer {
   cursor: pointer;
 }
+
+.upvote:hover {
+ color: var(--info);
+}
+
+.downvote:hover {
+  color: var(--danger);
+}