Remove useless components and fixes

src/app/components/creator/_dialogs/comment-export/comment-export.component.ts

 import { Component, OnInit } from '@angular/core';
 import { MatDialogRef } from '@angular/material';
-import { CommentCreatorPageComponent } from '../../comment-creator-page/comment-creator-page.component';
-import { Comment } from '../../../../models/comment';
+import { CommentPageComponent } from '../../../shared/comment-page/comment-page.component';
 
 @Component({
   selector: 'app-comment-export',
@@ -12,7 +11,7 @@ export class CommentExportComponent implements OnInit {
 
   exportType = 'comma';
 
-  constructor(public dialogRef: MatDialogRef<CommentCreatorPageComponent>) { }
+  constructor(public dialogRef: MatDialogRef<CommentPageComponent>) { }
 
   ngOnInit() {
   }

src/app/components/creator/comment-creator-page/comment-creator-page.component.html

-<app-comment-page></app-comment-page>

src/app/components/creator/comment-creator-page/comment-creator-page.component.spec.ts

-/* import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { CommentCreatorPageComponent } from './comment-creator-page.component';
-
-describe('CommentCreatorPageComponent', () => {
-  let component: CommentCreatorPageComponent;
-  let fixture: ComponentFixture<CommentCreatorPageComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ CommentCreatorPageComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CommentCreatorPageComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
-*/

src/app/components/creator/comment-creator-page/comment-creator-page.component.ts

-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-comment-creator-page',
-  templateUrl: './comment-creator-page.component.html',
-  styleUrls: ['./comment-creator-page.component.scss']
-})
-export class CommentCreatorPageComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-}

src/app/components/creator/creator-routing.module.ts

@@ -10,7 +10,7 @@ import { FeedbackBarometerPageComponent } from '../shared/feedback-barometer-pag
 import { ContentListComponent } from './content-list/content-list.component';
 import { StatisticComponent } from '../shared/statistic/statistic.component';
 import { ContentPresentationComponent } from './content-presentation/content-presentation.component';
-import { CommentCreatorPageComponent } from './comment-creator-page/comment-creator-page.component';
+import { CommentPageComponent } from '../shared/comment-page/comment-page.component';
 
 const routes: Routes = [
   {
@@ -45,7 +45,7 @@ const routes: Routes = [
   },
   {
     path: 'room/:roomId/comments',
-    component: CommentCreatorPageComponent,
+    component: CommentPageComponent,
     canActivate: [AuthenticationGuard],
     data: { roles: [UserRole.CREATOR] }
   },

src/app/components/creator/creator.module.ts

@@ -21,7 +21,6 @@ import { ContentCreatorComponent } from './content-creator/content-creator.compo
 import { ContentListComponent } from './content-list/content-list.component';
 import { ContentEditComponent } from './_dialogs/content-edit/content-edit.component';
 import { ContentPresentationComponent } from './content-presentation/content-presentation.component';
-import { CommentCreatorPageComponent } from './comment-creator-page/comment-creator-page.component';
 import { CommentExportComponent } from './_dialogs/comment-export/comment-export.component';
 
 @NgModule({
@@ -53,7 +52,6 @@ import { CommentExportComponent } from './_dialogs/comment-export/comment-export
     ContentListComponent,
     ContentEditComponent,
     ContentPresentationComponent,
-    CommentCreatorPageComponent,
     CommentExportComponent
   ],
   entryComponents: [

src/app/components/participant/comment-participant-page/comment-participant-page.component.html

-<app-comment-page></app-comment-page>

src/app/components/participant/comment-participant-page/comment-participant-page.component.spec.ts

-/*
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { CommentParticipantPageComponent } from './comment-participant-page.component';
-
-describe('CommentParticipantPageComponent', () => {
-  let component: CommentParticipantPageComponent;
-  let fixture: ComponentFixture<CommentParticipantPageComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ CommentParticipantPageComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CommentParticipantPageComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
-*/

src/app/components/participant/comment-participant-page/comment-participant-page.component.ts

-import { Component, OnInit } from '@angular/core';
-
-@Component({
-  selector: 'app-comment-participant-page',
-  templateUrl: './comment-participant-page.component.html',
-  styleUrls: ['./comment-participant-page.component.scss']
-})
-export class CommentParticipantPageComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit() {
-  }
-
-}

src/app/components/participant/participant-routing.module.ts

@@ -8,7 +8,7 @@ import { FeedbackBarometerPageComponent } from '../shared/feedback-barometer-pag
 import { ParticipantContentCarouselPageComponent } from './participant-content-carousel-page/participant-content-carousel-page.component';
 import { StatisticsPageComponent } from '../shared/statistics-page/statistics-page.component';
 import { StatisticComponent } from '../shared/statistic/statistic.component';
-import { CommentParticipantPageComponent } from './comment-participant-page/comment-participant-page.component';
+import { CommentPageComponent } from '../shared/comment-page/comment-page.component';
 
 const routes: Routes = [
   {
@@ -37,7 +37,7 @@ const routes: Routes = [
   },
   {
     path: 'room/:roomId/comments',
-    component: CommentParticipantPageComponent,
+    component: CommentPageComponent,
     canActivate: [AuthenticationGuard],
     data: { roles: [UserRole.PARTICIPANT] }
   },

src/app/components/participant/participant.module.ts

@@ -11,7 +11,6 @@ import { ParticipantContentCarouselPageComponent } from './participant-content-c
 import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
 import { HttpClient } from '@angular/common/http';
 import { TranslateHttpLoader } from '@ngx-translate/http-loader';
-import { CommentParticipantPageComponent } from './comment-participant-page/comment-participant-page.component';
 
 @NgModule({
   imports: [
@@ -33,8 +32,7 @@ import { CommentParticipantPageComponent } from './comment-participant-page/comm
     ContentTextParticipantComponent,
     HomeParticipantPageComponent,
     RoomParticipantPageComponent,
-    ParticipantContentCarouselPageComponent,
-    CommentParticipantPageComponent
+    ParticipantContentCarouselPageComponent
   ]
 })
 export class ParticipantModule {

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

@@ -4,53 +4,53 @@
   </mat-label>
   <input #searchBox placeholder="{{ 'comment-list-page.search' | translate }}"
     (input)="searchComments(searchBox.value)">
-  <button mat-icon-button class="searchBarButton close" *ngIf="searchBox.value || isIconHide"
-          (click)="hideCommentsList=false; searchBox.value=''; isIconHide=false">
+  <button mat-icon-button class="searchBarButton close" *ngIf="searchBox.value"
+          (click)="hideCommentsList=false; searchBox.value=''">
     <mat-icon>close</mat-icon>
   </button>
   <span class="fill-remaining-space"></span>
-  <button mat-icon-button class="searchBarButton" *ngIf="!searchBox.value && userRole === 1 && comments.length > 0 && !isIconHide"
+  <button mat-icon-button class="searchBarButton" *ngIf="!searchBox.value && userRole === 1 && comments.length > 0"
     [matTooltip]="'Export comments'" (click)="openExportDialog()">
     <mat-icon class="searchBarIcon" color="accent">cloud_download</mat-icon>
   </button>
 
-  <button mat-icon-button class="searchBarButton" *ngIf="!searchBox.value && !isIconHide"
+  <button mat-icon-button class="searchBarButton" *ngIf="!searchBox.value"
           color="accent" (click)="openSubmitDialog()">
     <mat-icon class="searchBarIcon">add_circle</mat-icon>
   </button>
 
-  <button mat-icon-button class="searchBarButton" *ngIf="!searchBox.value && !isIconHide"
+  <button mat-icon-button class="searchBarButton" *ngIf="!searchBox.value && comments.length > 0"
           color="accent" [matMenuTriggerFor]="filterMenu">
     <mat-icon class="searchBarIcon">sort</mat-icon>
   </button>
 
   <mat-menu #filterMenu="matMenu" xPosition="before">
     <div id="filterIcon">
-      <button mat-icon-button (focus)="hideCommentsList=true" (click)="filterMarkAsCorrect(); isIconHide=true">
-        <mat-icon color="primary">check_circle</mat-icon>
+      <button mat-icon-button (focus)="hideCommentsList=true" (click)="filterMarkAsCorrect()">
+        <mat-icon>check_circle</mat-icon>
       </button>
 
-      <button mat-icon-button (focus)="hideCommentsList=true" (click)="filterFavorite(); isIconHide=true">
-        <mat-icon color="primary">star</mat-icon>
+      <button mat-icon-button (focus)="hideCommentsList=true" (click)="filterFavorite()">
+        <mat-icon>star</mat-icon>
       </button>
 
-      <button mat-icon-button (focus)="hideCommentsList=true" (click)="filterMarkAsRead(); isIconHide=true">
-        <mat-icon color="primary">visibility</mat-icon>
+      <button mat-icon-button (focus)="hideCommentsList=true" (click)="filterMarkAsRead()">
+        <mat-icon>visibility</mat-icon>
       </button>
 
       <button mat-icon-button (focus)="hideCommentsList=false" (click)="sortVoteDesc()">
-        <mat-icon color="primary">keyboard_arrow_up</mat-icon>
+        <mat-icon>keyboard_arrow_up</mat-icon>
       </button>
 
       <button mat-icon-button (focus)="hideCommentsList=false" (click)="sortVote()">
-        <mat-icon color="primary">keyboard_arrow_down</mat-icon>
+        <mat-icon>keyboard_arrow_down</mat-icon>
       </button>
 
       <button mat-icon-button (focus)="hideCommentsList=false" (click)="sortTimeStamp()">
-        <mat-icon color="primary">remove</mat-icon>
+        <mat-icon>remove</mat-icon>
       </button>
       <button mat-icon-button *ngIf="userRole === 1" (focus)="hideCommentsList=false" (click)="deleteComments()">
-        <mat-icon color="primary">delete</mat-icon>
+        <mat-icon color="warn">delete</mat-icon>
       </button>
     </div>
   </mat-menu>

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

@@ -16,7 +16,7 @@ app-comment {
 input {
   box-sizing: border-box;
   padding: 0 10px 0 5px;
-  width: 50%;
+  width: 100%;
   background-color: var(--light);
   border: none;
   outline: none;

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

@@ -26,7 +26,6 @@ export class CommentListComponent implements OnInit {
   comments: Comment[];
   isLoading = true;
   hideCommentsList = false;
-  isIconHide: boolean;
   filteredComments: Comment[];
   userRole: UserRole;
 
@@ -171,7 +170,7 @@ export class CommentListComponent implements OnInit {
   }
 
   exportCsv(delimiter: string, date: string): void {
-    let exportComments = JSON.parse(JSON.stringify(this.comments));
+    const exportComments = JSON.parse(JSON.stringify(this.comments));
     let csv: string;
     let keyFields = '';
     let valueFields = '';