Read previous Vote on comment loading

Add vote service for HTTP find request to get users votes
Pass each vote to comment component

Proxy change: add /api/vote -> comment-service

proxy.conf.json

@@ -7,6 +7,14 @@
     },
 		"logLevel": "debug"
   },
+  "/api/vote": {
+    "target": "http://localhost:8088",
+    "secure": false,
+    "pathRewrite": {
+      "^/api": ""
+    },
+		"logLevel": "debug"
+  },
   "/api": {
     "target": "http://localhost:8080",
     "secure": false,

src/app/app.module.ts

@@ -14,6 +14,7 @@ import { CommentService } from './services/http/comment.service';
 import { DataStoreService } from './services/util/data-store.service';
 import { ContentService } from './services/http/content.service';
 import { ContentAnswerService } from './services/http/content-answer.service';
+import { VoteService } from './services/http/vote.service';
 import { WsConnectorService } from './services/websockets/ws-connector.service';
 import { UserActivationComponent } from './components/home/_dialogs/user-activation/user-activation.component';
 import { AuthenticationInterceptor } from './interceptors/authentication.interceptor';
@@ -84,6 +85,7 @@ export function initializeApp(appConfig: AppConfig) {
     MarkdownService,
     MarkedOptions,
     UserService,
+    VoteService,
     WsConnectorService,
     {
       provide: MatDialogRef,

src/app/components/shared/comment-list/comment-list.component.html

@@ -67,7 +67,7 @@
   </mat-menu>
 </div>
 
-<app-comment *ngFor="let current of showComments()" [comment]="current"></app-comment>
+<app-comment *ngFor="let current of showComments()" [comment]="current" [parseVote]="getVote(current)"></app-comment>
 
 <div *ngIf="comments.length < 1" fxLayout="row" fxLayoutAlign="center center" class="no-comments">
   <h4>{{ 'comment-page.no-comments' | translate }}</h4>

src/app/components/shared/comment-list/comment-list.component.ts

@@ -8,10 +8,12 @@ import { CreateCommentComponent } from '../_dialogs/create-comment/create-commen
 import { MatDialog } from '@angular/material';
 import { WsCommentServiceService } from '../../../services/websockets/ws-comment-service.service';
 import { User } from '../../../models/user';
+import { Vote } from '../../../models/vote';
 import { UserRole } from '../../../models/user-roles.enum';
 import { AuthenticationService } from '../../../services/http/authentication.service';
 import { Room } from '../../../models/room';
 import { RoomService } from '../../../services/http/room.service';
+import { VoteService } from '../../../services/http/vote.service';
 
 @Component({
   selector: 'app-comment-list',
@@ -38,6 +40,7 @@ export class CommentListComponent implements OnInit {
   favorite = 'favorite';
   correct = 'correct';
   currentFilter = '';
+  commentVoteMap = new Map<string, Vote>();
 
   constructor(private commentService: CommentService,
               private translateService: TranslateService,
@@ -45,13 +48,20 @@ export class CommentListComponent implements OnInit {
               protected langService: LanguageService,
               private authenticationService: AuthenticationService,
               private wsCommentService: WsCommentServiceService,
-              protected roomService: RoomService
+              protected roomService: RoomService,
+              protected voteService: VoteService
   ) {
     langService.langEmitter.subscribe(lang => translateService.use(lang));
   }
 
   ngOnInit() {
     this.roomId = localStorage.getItem(`roomId`);
+    const userId = this.authenticationService.getUser().id;
+    this.voteService.getByRoomIdAndUserID(this.roomId, userId).subscribe(votes => {
+      for (const v of votes) {
+        this.commentVoteMap.set(v.commentId, v);
+      }
+    });
     this.roomService.getRoom(this.roomId).subscribe( room => this.room = room);
     this.hideCommentsList = false;
     this.wsCommentService.getCommentStream(this.roomId).subscribe((message: Message) => {
@@ -92,6 +102,10 @@ export class CommentListComponent implements OnInit {
     }
   }
 
+  getVote(comment: Comment): Vote {
+    return this.commentVoteMap.get(comment.id);
+  }
+
   parseIncomingMessage(message: Message) {
     const msg = JSON.parse(message.body);
     const payload = msg.payload;

src/app/components/shared/comment/comment.component.ts

 import { Component, Input, OnInit } from '@angular/core';
 import { Comment } from '../../../models/comment';
+import { Vote } from '../../../models/vote';
 import { AuthenticationService } from '../../../services/http/authentication.service';
 import { ActivatedRoute } from '@angular/router';
 import { Location } from '@angular/common';
@@ -74,6 +75,11 @@ export class CommentComponent implements OnInit {
     }
   }
 
+  @Input()
+  set parseVote(vote: Vote) {
+    this.hasVoted = vote.vote;
+  }
+
   resetAnimationState(): void {
     this.animationState = '';
   }

src/app/models/vote.ts

 export class Vote {
-  private id: string;
-  private userId: string;
-  private commentId: string;
-  private vote: number;
+  id: string;
+  userId: string;
+  commentId: string;
+  vote: number;
 
   constructor(userId: string ,
               commentId: string,

src/app/services/http/vote.service.ts

+import { Injectable } from '@angular/core';
+import { Vote } from '../../models/vote';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+import { Observable } from 'rxjs';
+import { catchError, tap } from 'rxjs/operators';
+import { AuthenticationService } from './authentication.service';
+import { BaseHttpService } from './base-http.service';
+
+const httpOptions = {
+  headers: new HttpHeaders({})
+};
+
+@Injectable()
+export class VoteService extends BaseHttpService {
+  private apiUrl = {
+    base: '/api',
+    vote: '/vote',
+    find: '/find'
+  };
+
+  constructor(private http: HttpClient,
+              private authService: AuthenticationService) {
+    super();
+  }
+
+  getByRoomIdAndUserID(roomId: string, userId: string): Observable<Vote[]> {
+    const connectionUrl = `${this.apiUrl.base + this.apiUrl.vote + this.apiUrl.find}`;
+    return this.http.post<Vote[]>(connectionUrl, {
+      properties: {
+        userId: userId
+      },
+      externalFilters: {
+        roomId: roomId
+      }
+    }).pipe(
+      tap(() => ''),
+      catchError(this.handleError<Vote[]>(`get votes by roomid = ${roomId}`))
+    );
+  }
+}