fix fontawesome bug, minor refactoring - #102

package.json

@@ -46,6 +46,7 @@
     "@angular/platform-server": "^8.2.14",
     "@angular/router": "^8.2.14",
     "@fortawesome/angular-fontawesome": "^0.5.0",
+    "@fortawesome/fontawesome-common-types": "^0.2.28",
     "@fortawesome/fontawesome-svg-core": "^1.2.27",
     "@fortawesome/free-brands-svg-icons": "^5.12.1",
     "@fortawesome/free-regular-svg-icons": "^5.13.0",

src/app/classroom/classroom.component.html

@@ -140,7 +140,6 @@ <h4 class="text-info">
       </div>
     </div>
   </div>
-  <app-rating [test]="activeTest.code" [question]="activeQuestionId"></app-rating>
 </div>
 <div class="mb-3 d-md-none" *ngIf="activeTest">
   <div class="container">

src/app/user/rating/rating.component.html

@@ -2,7 +2,7 @@
     <div class="container">
         <div class="row">
             <div class="col-12">
-                <p class="lead">Rate this question:</p>
+                <p class="lead" i18n>Rate this question:</p>
                 <span class="star text-warning" *ngFor="let star of stars; let i=index">
                     <fa-icon *ngIf="!star" [icon]="['far', 'star']" (click)="select(i)"></fa-icon>
                     <fa-icon *ngIf="star" [icon]="['fas', 'star']" (click)="select(i)"></fa-icon>
@@ -11,10 +11,10 @@
             <div class="col-12 col-sm-4 my-3" *ngIf="selected">
                 <form>
                     <div class="form-group">
-                        <label for="rating-comment">Tell us more (optional):</label>
+                        <label for="rating-comment" i18n>Tell us more (optional):</label>
                         <textarea id="rating-comment" class="form-control" name="comment" rows="3" placeholder="Let us know what you liked or we can improve..." [(ngModel)]="comment"></textarea>
                     </div>
-                    <button type="button" class="btn btn-primary btn-block" (click)="submit()">Submit</button>
+                    <button type="button" class="btn btn-primary btn-block" (click)="submit()" i18n>Submit</button>
                 </form>
             </div>
         </div>

src/app/user/rating/rating.component.scss

@@ -2,9 +2,5 @@
     .star {
         cursor: pointer;
         font-size: 2rem;
-
-        &.rated {
-            pointer-events: none;
-        }
     }
 }

src/app/user/rating/rating.component.ts

@@ -1,9 +1,9 @@
 import { Component, OnInit, Input } from '@angular/core';
 import { Rating } from '@/_models/rating';
+import { User } from '@/_models/user';
 import { AlertService, UserService } from '@/_services';
 import { I18n } from '@ngx-translate/i18n-polyfill';
 import { first } from 'rxjs/operators';
-import { User } from '@/_models';
 
 @Component({
   selector: 'app-rating',
@@ -33,36 +33,45 @@ export class RatingComponent implements OnInit {
         this.stars = [false, false, false, false, false];
     }
 
-  ngOnInit() {
-      this.getUserToken();
-  }
+    ngOnInit() {
+        this.getUserToken();
+    }
 
-  getUserToken() {
-      this.userService.getMyInfo()
-      .pipe(first())
-      .subscribe(
-        apiResponseUser => {
-            if (apiResponseUser.ok) return this.userToken = apiResponseUser.user.token;
-        },
-        error => {
-            this.alertService.error(this.i18n('API Service Unavailable') + '. ' + error.msg);
-        }
-      )
-  }
+    /**
+     * @function getUserToken
+     * @description Gets current user token for user to submit rating.
+     */
+    private getUserToken() {
+        this.userService.getMyInfo()
+        .pipe(first())
+        .subscribe(
+            apiResponseUser => {
+                if (apiResponseUser.ok) return this.userToken = apiResponseUser.user.token;
+            },
+            error => {
+                this.alertService.error(this.i18n('API Service Unavailable') + '. ' + error.msg);
+            }
+        )
+    }
 
-    select(selectedStar: number) {
+    /**
+     * @function select
+     * @param selectedStar Number
+     * @description Sets rating depending on selected star.
+     */
+    public select(selectedStar: number): Rating["score"] {
         for(let i = 0; i < this.stars.length; i++) {
-            if(i <= selectedStar) {
-                this.stars[i] = true;
-            } else {
-                this.stars[i] = false;
-            }
+            i <= selectedStar ? this.stars[i] = true : this.stars[i] = false;
         }
         this.selected = true;
         return this.score = selectedStar + 1;
     }
 
-    submit() {
+    /**
+     * @function submit
+     * @description Sends feedback post request and resets rating for next rating.
+     */
+    public submit() {
         this.userService.sendFeedback(
         this.rating = {
             test: this.test,
@@ -73,17 +82,21 @@ export class RatingComponent implements OnInit {
         .pipe(first())
         .subscribe(
             response => {
-                // console.log(response);
-                this.alertService.success(this.i18n('Thank you for your feedback'));
-                this.resetRating();
+                if (response.ok) {
+                    this.alertService.success(this.i18n('Thank you for your feedback'));
+                    this.resetRating();
+                }
             },
             error => {
                 this.alertService.error(this.i18n('API Service Unavailable') + '. ' + error.message);
             }
         );
     }
 
-    resetRating() {
+    /**
+     * @function resetRating
+     */
+    private resetRating() {
         for(let i = 0; i < this.stars.length; i++) {
             this.stars[i] = false;
         }