Allow comment/post upvoting from other pages.

- Fixes #355
- Votes now coming back for posts and comments on search page.

server/src/api/site.rs

@@ -19,6 +19,7 @@ pub struct Search {
   sort: String,
   page: Option<i64>,
   limit: Option<i64>,
+  auth: Option<String>,
 }
 
 #[derive(Serialize, Deserialize)]
@@ -313,6 +314,17 @@ impl Perform<SearchResponse> for Oper<Search> {
   fn perform(&self, conn: &PgConnection) -> Result<SearchResponse, Error> {
     let data: &Search = &self.data;
 
+    let user_id: Option<i32> = match &data.auth {
+      Some(auth) => match Claims::decode(&auth) {
+        Ok(claims) => {
+          let user_id = claims.claims.id;
+          Some(user_id)
+        }
+        Err(_e) => None,
+      },
+      None => None,
+    };
+
     let sort = SortType::from_str(&data.sort)?;
     let type_ = SearchType::from_str(&data.type_)?;
 
@@ -330,6 +342,7 @@ impl Perform<SearchResponse> for Oper<Search> {
           .show_nsfw(true)
           .for_community_id(data.community_id)
           .search_term(data.q.to_owned())
+          .my_user_id(user_id)
           .page(data.page)
           .limit(data.limit)
           .list()?;
@@ -338,6 +351,7 @@ impl Perform<SearchResponse> for Oper<Search> {
         comments = CommentQueryBuilder::create(&conn)
           .sort(&sort)
           .search_term(data.q.to_owned())
+          .my_user_id(user_id)
           .page(data.page)
           .limit(data.limit)
           .list()?;
@@ -364,6 +378,7 @@ impl Perform<SearchResponse> for Oper<Search> {
           .show_nsfw(true)
           .for_community_id(data.community_id)
           .search_term(data.q.to_owned())
+          .my_user_id(user_id)
           .page(data.page)
           .limit(data.limit)
           .list()?;
@@ -371,6 +386,7 @@ impl Perform<SearchResponse> for Oper<Search> {
         comments = CommentQueryBuilder::create(&conn)
           .sort(&sort)
           .search_term(data.q.to_owned())
+          .my_user_id(user_id)
           .page(data.page)
           .limit(data.limit)
           .list()?;

ui/src/components/post-listing.tsx

@@ -52,7 +52,6 @@ interface PostListingProps {
   post: Post;
   showCommunity?: boolean;
   showBody?: boolean;
-  viewOnly?: boolean;
   moderators?: Array<CommunityUser>;
   admins?: Array<UserView>;
 }
@@ -118,10 +117,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
     let post = this.props.post;
     return (
       <div class="listing col-12">
-        <div
+        <div className={`vote-bar mr-2 float-left small text-center`}>
-          className={`vote-bar mr-2 float-left small text-center ${this.props
-            .viewOnly && 'no-click'}`}
-        >
           <button
             disabled={!UserService.Instance.user}
             className={`btn p-0 ${

ui/src/components/search.tsx

@@ -12,6 +12,8 @@ import {
   SearchForm,
   SearchResponse,
   SearchType,
+  CreatePostLikeResponse,
+  CommentResponse,
 } from '../interfaces';
 import { WebSocketService } from '../services';
 import {
@@ -123,8 +125,6 @@ export class Search extends Component<any, SearchState> {
   render() {
     return (
       <div class="container">
-        <div class="row">
-          <div class="col-12">
         <h5>
           <T i18nKey="search">#</T>
         </h5>
@@ -138,8 +138,6 @@ export class Search extends Component<any, SearchState> {
         {this.noResults()}
         {this.paginator()}
       </div>
-        </div>
-      </div>
     );
   }
 
@@ -252,9 +250,10 @@ export class Search extends Component<any, SearchState> {
     return (
       <div>
         {combined.map(i => (
-          <div>
+          <div class="row">
+            <div class="col-12">
               {i.type_ == 'posts' && (
-              <PostListing post={i.data as Post} showCommunity viewOnly />
+                <PostListing post={i.data as Post} showCommunity />
               )}
               {i.type_ == 'comments' && (
                 <CommentNodes
@@ -301,6 +300,7 @@ export class Search extends Component<any, SearchState> {
                 </div>
               )}
             </div>
+          </div>
         ))}
       </div>
     );
@@ -308,45 +308,58 @@ export class Search extends Component<any, SearchState> {
 
   comments() {
     return (
-      <div>
+      <>
         {this.state.searchResponse.comments.map(comment => (
+          <div class="row">
+            <div class="col-12">
               <CommentNodes nodes={[{ comment: comment }]} locked noIndent />
-        ))}
             </div>
+          </div>
+        ))}
+      </>
     );
   }
 
   posts() {
     return (
-      <div>
+      <>
         {this.state.searchResponse.posts.map(post => (
-          <PostListing post={post} showCommunity viewOnly />
+          <div class="row">
-        ))}
+            <div class="col-12">
+              <PostListing post={post} showCommunity />
             </div>
+          </div>
+        ))}
+      </>
     );
   }
 
   // Todo possibly create UserListing and CommunityListing
   communities() {
     return (
-      <div>
+      <>
         {this.state.searchResponse.communities.map(community => (
-          <div>
+          <div class="row">
+            <div class="col-12">
               <span>
-              <Link to={`/c/${community.name}`}>{`/c/${community.name}`}</Link>
+                <Link
+                  to={`/c/${community.name}`}
+                >{`/c/${community.name}`}</Link>
               </span>
               <span>{` - ${community.title} - ${community.number_of_subscribers} subscribers`}</span>
             </div>
-        ))}
           </div>
+        ))}
+      </>
     );
   }
 
   users() {
     return (
-      <div>
+      <>
         {this.state.searchResponse.users.map(user => (
-          <div>
+          <div class="row">
+            <div class="col-12">
               <span>
                 <Link
                   className="text-info"
@@ -355,8 +368,9 @@ export class Search extends Component<any, SearchState> {
               </span>
               <span>{` - ${user.comment_score} comment karma`}</span>
             </div>
-        ))}
           </div>
+        ))}
+      </>
     );
   }
 
@@ -477,6 +491,30 @@ export class Search extends Component<any, SearchState> {
       }`;
       window.scrollTo(0, 0);
       this.setState(this.state);
+    } else if (op == UserOperation.CreateCommentLike) {
+      let res: CommentResponse = msg;
+      let found: Comment = this.state.searchResponse.comments.find(
+        c => c.id === res.comment.id
+      );
+      found.score = res.comment.score;
+      found.upvotes = res.comment.upvotes;
+      found.downvotes = res.comment.downvotes;
+      if (res.comment.my_vote !== null) {
+        found.my_vote = res.comment.my_vote;
+        found.upvoteLoading = false;
+        found.downvoteLoading = false;
+      }
+      this.setState(this.state);
+    } else if (op == UserOperation.CreatePostLike) {
+      let res: CreatePostLikeResponse = msg;
+      let found = this.state.searchResponse.posts.find(
+        c => c.id == res.post.id
+      );
+      found.my_vote = res.post.my_vote;
+      found.score = res.post.score;
+      found.upvotes = res.post.upvotes;
+      found.downvotes = res.post.downvotes;
+      this.setState(this.state);
     }
   }
 }

ui/src/components/user.tsx

@@ -18,6 +18,7 @@ import {
   BanUserResponse,
   AddAdminResponse,
   DeleteAccountForm,
+  CreatePostLikeResponse,
 } from '../interfaces';
 import { WebSocketService, UserService } from '../services';
 import {
@@ -307,7 +308,6 @@ export class User extends Component<any, UserState> {
                 post={i.data as Post}
                 admins={this.state.admins}
                 showCommunity
-                viewOnly
               />
             ) : (
               <CommentNodes
@@ -340,12 +340,7 @@ export class User extends Component<any, UserState> {
     return (
       <div>
         {this.state.posts.map(post => (
-          <PostListing
+          <PostListing post={post} admins={this.state.admins} showCommunity />
-            post={post}
-            admins={this.state.admins}
-            showCommunity
-            viewOnly
-          />
         ))}
       </div>
     );
@@ -1043,6 +1038,14 @@ export class User extends Component<any, UserState> {
       found.downvotes = res.comment.downvotes;
       if (res.comment.my_vote !== null) found.my_vote = res.comment.my_vote;
       this.setState(this.state);
+    } else if (op == UserOperation.CreatePostLike) {
+      let res: CreatePostLikeResponse = msg;
+      let found = this.state.posts.find(c => c.id == res.post.id);
+      found.my_vote = res.post.my_vote;
+      found.score = res.post.score;
+      found.upvotes = res.post.upvotes;
+      found.downvotes = res.post.downvotes;
+      this.setState(this.state);
     } else if (op == UserOperation.BanUser) {
       let res: BanUserResponse = msg;
       this.state.comments

ui/src/interfaces.ts

@@ -700,6 +700,7 @@ export interface SearchForm {
   sort: string;
   page?: number;
   limit?: number;
+  auth?: string;
 }
 
 export interface SearchResponse {

ui/src/services/WebSocketService.ts

@@ -255,6 +255,7 @@ export class WebSocketService {
   }
 
   public search(form: SearchForm) {
+    this.setAuth(form, false);
     this.subject.next(this.wsSendWrapper(UserOperation.Search, form));
   }