travis and prettify

client/src/app/core/services/choice.service.ts

@@ -1,7 +1,11 @@
 import { Injectable } from '@angular/core';
 import { OpenSlidesComponent } from '../../openslides.component';
 import { MatDialog } from '@angular/material';
-import { ChoiceDialogComponent, ChoiceDialogOptions, ChoiceAnswer } from '../../shared/components/choice-dialog/choice-dialog.component';
+import {
+    ChoiceDialogComponent,
+    ChoiceDialogOptions,
+    ChoiceAnswer
+} from '../../shared/components/choice-dialog/choice-dialog.component';
 
 /**
  * A service for prompting the user to select a choice.
@@ -25,7 +29,11 @@ export class ChoiceService extends OpenSlidesComponent {
      * @param choices The available choices
      * @returns an answer {@link ChoiceAnswer}
      */
-    public async open(title: string, choices: ChoiceDialogOptions, multiSelect: boolean = false): Promise<ChoiceAnswer> {
+    public async open(
+        title: string,
+        choices: ChoiceDialogOptions,
+        multiSelect: boolean = false
+    ): Promise<ChoiceAnswer> {
         const dialogRef = this.dialog.open(ChoiceDialogComponent, {
             minWidth: '250px',
             data: { title: title, choices: choices, multiSelect: multiSelect }

client/src/app/shared/components/choice-dialog/choice-dialog.component.html

@@ -1,8 +1,14 @@
 <h2 mat-dialog-title>{{ data.title | translate }}</h2>
 <div class="scrollmenu">
-    <mat-radio-group #radio name="choice" *ngIf="!data.multiSelect" class="choice-radio-group" [(ngModel)]="selectedChoice">
+    <mat-radio-group
+        #radio
+        name="choice"
+        *ngIf="!data.multiSelect"
+        class="choice-radio-group"
+        [(ngModel)]="selectedChoice"
+    >
         <mat-radio-button class="choice-button" *ngFor="let choice of data.choices" [value]="choice.id">
-            {{ getChoiceTitle(choice)  | translate}}
+            {{ getChoiceTitle(choice) | translate }}
         </mat-radio-button>
     </mat-radio-group>
 

client/src/app/shared/components/choice-dialog/choice-dialog.component.spec.ts

@@ -1,4 +1,4 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { async, TestBed } from '@angular/core/testing';
 
 // import { ChoiceDialogComponent } from './choice-dialog.component';
 import { E2EImportsModule } from 'e2e-imports.module';
@@ -18,9 +18,9 @@ describe('ChoiceDialogComponent', () => {
         /*fixture = TestBed.createComponent(PromptDialogComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();*/
-});
+    });
 
-/*it('should create', () => {
+    /*it('should create', () => {
     expect(component).toBeTruthy();
 });*/
 });

client/src/app/shared/components/choice-dialog/choice-dialog.component.ts

@@ -81,7 +81,7 @@ export class ChoiceDialogComponent {
      * For multiSelect: Activates/deactivates a multi-Choice option
      * @param choice
      */
-    public toggleChoice(choice: Identifiable) : void {
+    public toggleChoice(choice: Identifiable): void {
         const idx = this.selectedMultiChoices.indexOf(choice.id);
         if (idx < 0) {
             this.selectedMultiChoices.push(choice.id);

client/src/app/shared/components/head-bar/head-bar.component.html

@@ -1,13 +1,23 @@
-<mat-toolbar color="primary" [ngClass]="multiSelectMode ? 'multi-select' : '' " *ngIf="!vp.isMobile"></mat-toolbar>
+<mat-toolbar color="primary" [ngClass]="multiSelectMode ? 'multi-select' : ''" *ngIf="!vp.isMobile"></mat-toolbar>
-<mat-toolbar color="primary" [ngClass]="multiSelectMode ? 'multi-select' : '' " class="sticky-toolbar">
+<mat-toolbar color="primary" [ngClass]="multiSelectMode ? 'multi-select' : ''" class="sticky-toolbar">
     <div class="toolbar-left">
         <!-- Nav menu -->
-        <button mat-icon-button class="on-transition-fade" *ngIf="vp.isMobile && nav && !multiSelectMode" (click)='clickHamburgerMenu()'>
+        <button
+            mat-icon-button
+            class="on-transition-fade"
+            *ngIf="vp.isMobile && nav && !multiSelectMode"
+            (click)="clickHamburgerMenu()"
+        >
             <mat-icon>menu</mat-icon>
         </button>
 
         <!-- Exit / Back button -->
-        <button mat-icon-button class="on-transition-fade" *ngIf="!nav && !editMode && !multiSelectMode" (click)="onBackButton()">
+        <button
+            mat-icon-button
+            class="on-transition-fade"
+            *ngIf="!nav && !editMode && !multiSelectMode"
+            (click)="onBackButton()"
+        >
             <mat-icon>arrow_back</mat-icon>
         </button>
 
@@ -22,12 +32,12 @@
         </div>
     </div>
 
-    <!-- centered information slot-->
+    <!-- centered information slot -->
-    <div *ngIf="!multiSelectMode" class=spacer></div>
+    <div *ngIf="!multiSelectMode" class="spacer"></div>
     <div class="toolbar-centered on-transition-fade" *ngIf="multiSelectMode">
         <ng-content select=".central-info-slot"></ng-content>
     </div>
-    <div class=spacer></div>
+    <div class="spacer"></div>
 
     <div class="toolbar-right">
         <!-- Extra controls slot -->
@@ -36,24 +46,31 @@
         </div>
 
         <!-- Main action button - desktop -->
-        <button mat-mini-fab color="accent" class="on-transition-fade"
+        <button
-            *ngIf="mainButton && !editMode && !vp.isMobile && !multiSelectMode" (click)="sendMainEvent()">
+            mat-mini-fab
+            color="accent"
+            class="on-transition-fade"
+            *ngIf="mainButton && !editMode && !vp.isMobile && !multiSelectMode"
+            (click)="sendMainEvent()"
+        >
             <mat-icon>{{ mainButtonIcon }}</mat-icon>
         </button>
 
         <!-- Save button -->
-        <button mat-button *ngIf="editMode" (click)="save()">
+        <button mat-button *ngIf="editMode" (click)="save()"><strong translate class="upper">Save</strong></button>
-            <strong translate class="upper">Save</strong>
-        </button>
 
         <!-- Menu button slot -->
         <ng-content class="on-transition-fade" *ngIf="!editMode" select=".menu-slot"></ng-content>
     </div>
 </mat-toolbar>
 
-<!-- Main action button - mobile-->
+<!-- Main action button - mobile -->
 
-<button mat-fab class="head-button on-transition-fade"
+<button
-    *ngIf="mainButton && !editMode && vp.isMobile && !multiSelectMode" (click)=sendMainEvent()>
+    mat-fab
+    class="head-button on-transition-fade"
+    *ngIf="mainButton && !editMode && vp.isMobile && !multiSelectMode"
+    (click)="sendMainEvent()"
+>
     <mat-icon>{{ mainButtonIcon }}</mat-icon>
 </button>

client/src/app/site/agenda/components/agenda-list/agenda-list.component.html

@@ -1,32 +1,22 @@
-<os-head-bar [mainButton]="true" (mainEvent)=onPlusButton() [multiSelectMode]="isMultiSelect">
+<os-head-bar [mainButton]="true" (mainEvent)="onPlusButton()" [multiSelectMode]="isMultiSelect">
     <!-- Title -->
-    <div class="title-slot">
+    <div class="title-slot"><h2 translate>Agenda</h2></div>
-        <h2 translate>Agenda</h2>
-    </div>
     <!-- Menu -->
     <div class="menu-slot">
-        <button type="button" mat-icon-button [matMenuTriggerFor]="agendaMenu">
+        <button type="button" mat-icon-button [matMenuTriggerFor]="agendaMenu"><mat-icon>more_vert</mat-icon></button>
-            <mat-icon>more_vert</mat-icon>
-        </button>
     </div>
 
     <!-- Multiselect info -->
     <div class="central-info-slot">
-        <button mat-icon-button (click)="toggleMultiSelect()">
+        <button mat-icon-button (click)="toggleMultiSelect()"><mat-icon>arrow_back</mat-icon></button>
-            <mat-icon>arrow_back</mat-icon>
-        </button>
         <span>{{ selectedRows.length }}&nbsp;</span><span translate>selected</span>
     </div>
 
     <div class="extra-controls-slot on-transition-fade" *ngIf="isMultiSelect">
-        <button mat-icon-button (click)="deleteSelected()">
+        <button mat-icon-button (click)="deleteSelected()"><mat-icon>delete</mat-icon></button>
-            <mat-icon>delete</mat-icon>
-        </button>
     </div>
-
 </os-head-bar>
 
-
 <mat-table class="os-listview-table on-transition-fade" [dataSource]="dataSource" matSort>
     <ng-container matColumnDef="selector">
         <mat-header-cell *matHeaderCellDef mat-sort-header class="checkbox-cell"></mat-header-cell>
@@ -52,9 +42,7 @@
         <mat-header-cell *matHeaderCellDef mat-sort-header>Speakers</mat-header-cell>
         <mat-cell *matCellDef="let item">
             <button mat-icon-button (click)="onSpeakerIcon(item)">
-                <mat-icon
+                <mat-icon [matBadge]="item.speakerAmount > 0 ? item.speakerAmount : null" matBadgeColor="accent">
-                    [matBadge]="item.speakerAmount > 0 ? item.speakerAmount : null"
-                    matBadgeColor="accent">
                     mic
                 </mat-icon>
             </button>
@@ -62,8 +50,11 @@
     </ng-container>
 
     <mat-header-row *matHeaderRowDef="getColumnDefinition()"></mat-header-row>
-    <mat-row [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected': ''" (click)='selectItem(row, $event)'
+    <mat-row
-        *matRowDef="let row; columns: getColumnDefinition()"></mat-row>
+        [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
+        (click)="selectItem(row, $event)"
+        *matRowDef="let row; columns: getColumnDefinition()"
+    ></mat-row>
 </mat-table>
 <mat-paginator class="on-transition-fade" [pageSizeOptions]="[25, 50, 75, 100, 125]"></mat-paginator>
 
@@ -75,7 +66,7 @@
         </button>
     </div>
 
-    <div *ngIf="isMultiSelect" >
+    <div *ngIf="isMultiSelect">
         <div *osPerms="'agenda.can_manage'">
             <mat-divider></mat-divider>
             <button mat-menu-item (click)="setClosedSelected(true)">

client/src/app/site/assignments/assignment-list/assignment-list.component.html

@@ -1,9 +1,6 @@
-<os-head-bar plusButton=true (plusButtonClicked)=onPlusButton() [multiSelectMode]="isMultiSelect">
+<os-head-bar plusButton="true" (plusButtonClicked)="onPlusButton()" [multiSelectMode]="isMultiSelect">
     <!-- Title -->
-    <div class="title-slot">
+    <div class="title-slot"><h2 translate>Elections</h2></div>
-
-        <h2 translate>Elections</h2>
-    </div>
     <!-- Menu -->
     <div class="menu-slot">
         <button type="button" mat-icon-button [matMenuTriggerFor]="assignmentMenu">
@@ -13,25 +10,19 @@
 
     <!-- Multiselect info -->
     <div class="central-info-slot">
-        <button mat-icon-button (click)="toggleMultiSelect()">
+        <button mat-icon-button (click)="toggleMultiSelect()"><mat-icon>arrow_back</mat-icon></button>
-            <mat-icon>arrow_back</mat-icon>
-        </button>
         <span>{{ selectedRows.length }}&nbsp;</span><span translate>selected</span>
     </div>
 
     <div class="extra-controls-slot on-transition-fade" *ngIf="isMultiSelect">
-        <button mat-icon-button (click)="deleteSelected()">
+        <button mat-icon-button (click)="deleteSelected()"><mat-icon>delete</mat-icon></button>
-            <mat-icon>delete</mat-icon>
-        </button>
     </div>
-
 </os-head-bar>
 
-
 <mat-table class="os-listview-table on-transition-fade" [dataSource]="dataSource" matSort>
     <ng-container matColumnDef="selector">
-        <mat-header-cell *matHeaderCellDef mat-sort-header class="checkbox-cell" ></mat-header-cell>
+        <mat-header-cell *matHeaderCellDef mat-sort-header class="checkbox-cell"></mat-header-cell>
-        <mat-cell *matCellDef="let assignment" class="checkbox-cell" >
+        <mat-cell *matCellDef="let assignment" class="checkbox-cell">
             <mat-icon>{{ isSelected(assignment) ? 'check_circle' : '' }}</mat-icon>
         </mat-cell>
     </ng-container>
@@ -58,8 +49,11 @@
     </ng-container>
 
     <mat-header-row *matHeaderRowDef="getColumnDefintion()"></mat-header-row>
-    <mat-row [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected': ''" (click)='selectItem(row, $event)'
+    <mat-row
-        *matRowDef="let row; columns: getColumnDefintion()">
+        [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
+        (click)="selectItem(row, $event)"
+        *matRowDef="let row; columns: getColumnDefintion()"
+    >
     </mat-row>
 </mat-table>
 

client/src/app/site/mediafiles/components/mediafile-list/mediafile-list.component.html

@@ -5,7 +5,6 @@
     (mainEvent)="onMainEvent()"
     (saveEvent)="onSaveEditedFile()"
 >
-
     <!-- Title -->
     <div class="title-slot">
         <h2 *ngIf="!editFile" translate>Files</h2>
@@ -46,21 +45,16 @@
     </div>
     <!-- Multiselect info -->
     <div *ngIf="this.isMultiSelect" class="central-info-slot">
-        <button mat-icon-button (click)="toggleMultiSelect()">
+        <button mat-icon-button (click)="toggleMultiSelect()"><mat-icon>arrow_back</mat-icon></button>
-            <mat-icon >arrow_back</mat-icon>
-        </button>
         <span>{{ selectedRows.length }}&nbsp;</span><span translate>selected</span>
     </div>
 
     <div class="extra-controls-slot on-transition-fade" *ngIf="isMultiSelect">
-        <button mat-icon-button (click)="deleteSelected()">
+        <button mat-icon-button (click)="deleteSelected()"><mat-icon>delete</mat-icon></button>
-            <mat-icon>delete</mat-icon>
-        </button>
     </div>
 </os-head-bar>
 
 <mat-table class="os-listview-table on-transition-fade" [dataSource]="dataSource" matSort>
-
     <ng-container matColumnDef="selector">
         <mat-header-cell *matHeaderCellDef mat-sort-header class="checkbox-cell"></mat-header-cell>
         <mat-cell *matCellDef="let item" class="checkbox-cell">
@@ -114,8 +108,11 @@
     </ng-container>
 
     <mat-header-row *matHeaderRowDef="getColumnDefinition()"></mat-header-row>
-    <mat-row *matRowDef="let row; columns: getColumnDefinition()"
+    <mat-row
-        [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected': ''" (click)='selectItem(row, $event)'></mat-row>
+        *matRowDef="let row; columns: getColumnDefinition()"
+        [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
+        (click)="selectItem(row, $event)"
+    ></mat-row>
 </mat-table>
 
 <mat-paginator class="on-transition-fade" [pageSizeOptions]="[25, 50, 75, 100, 125]"></mat-paginator>

client/src/app/site/motions/components/motion-list/motion-list.component.html

@@ -1,8 +1,6 @@
-<os-head-bar [mainButton]="true" (mainEvent)=onPlusButton() [multiSelectMode]="isMultiSelect">
+<os-head-bar [mainButton]="true" (mainEvent)="onPlusButton()" [multiSelectMode]="isMultiSelect">
     <!-- Title -->
-    <div class="title-slot">
+    <div class="title-slot"><h2 translate>Motions</h2></div>
-        <h2 translate>Motions</h2>
-    </div>
 
     <!-- Menu -->
     <div class="menu-slot">
@@ -13,24 +11,17 @@
 
     <!-- Multiselect info -->
     <div class="central-info-slot">
-        <button mat-icon-button (click)="toggleMultiSelect()">
+        <button mat-icon-button (click)="toggleMultiSelect()"><mat-icon>arrow_back</mat-icon></button>
-            <mat-icon>arrow_back</mat-icon>
-        </button>
         <span>{{ selectedRows.length }}&nbsp;</span><span translate>selected</span>
     </div>
 </os-head-bar>
 
 <div class="custom-table-header on-transition-fade">
-    <button mat-button>
+    <button mat-button><span translate>SORT</span></button> <button mat-button><span translate>FILTER</span></button>
-        <span translate>SORT</span>
-    </button>
-    <button mat-button>
-        <span translate>FILTER</span>
-    </button>
 </div>
 
 <mat-table class="os-listview-table on-transition-fade" [dataSource]="dataSource" matSort>
-    <ng-container matColumnDef="selector" >
+    <ng-container matColumnDef="selector">
         <mat-header-cell *matHeaderCellDef mat-sort-header class="checkbox-cell"></mat-header-cell>
         <mat-cell *matCellDef="let motion" class="checkbox-cell">
             <mat-icon>{{ isSelected(motion) ? 'check_circle' : '' }}</mat-icon>
@@ -41,9 +32,7 @@
     <ng-container matColumnDef="identifier">
         <mat-header-cell *matHeaderCellDef mat-sort-header>Identifier</mat-header-cell>
         <mat-cell *matCellDef="let motion">
-            <div class="innerTable">
+            <div class="innerTable">{{ motion.identifier }}</div>
-                {{ motion.identifier }}
-            </div>
         </mat-cell>
     </ng-container>
 
@@ -52,25 +41,25 @@
         <mat-header-cell *matHeaderCellDef mat-sort-header>Title</mat-header-cell>
         <mat-cell *matCellDef="let motion">
             <div class="innerTable">
-                <span class="motion-list-title">{{ motion.title }}</span>
+                <span class="motion-list-title">{{ motion.title }}</span> <br />
-                <br>
+                <span class="motion-list-from"> <span translate>by</span> {{ motion.submitters }} </span> <br />
-                <span class="motion-list-from">
-                    <span translate>by</span>
-                    {{ motion.submitters }}
-                </span>
-                <br>
                 <!-- state -->
-                <mat-basic-chip [ngClass]="{
+                <mat-basic-chip
-                        'green': motion.state.css_class === 'success',
+                    [ngClass]="{
-                        'red': motion.state.css_class === 'danger',
+                        green: motion.state.css_class === 'success',
-                        'grey': motion.state.css_class === 'default',
+                        red: motion.state.css_class === 'danger',
-                        'lightblue': motion.state.css_class === 'primary' }">
+                        grey: motion.state.css_class === 'default',
+                        lightblue: motion.state.css_class === 'primary'
+                    }"
+                >
                     {{ motion.state.name | translate }}
                 </mat-basic-chip>
 
                 <!-- recommendation -->
-                <span *ngIf="motion.recommendation" >
+                <span *ngIf="motion.recommendation">
-                    <mat-basic-chip class="bluegrey">{{ motion.recommendation.recommendation_label | translate }}</mat-basic-chip>
+                    <mat-basic-chip class="bluegrey">{{
+                        motion.recommendation.recommendation_label | translate
+                    }}</mat-basic-chip>
                 </span>
             </div>
         </mat-cell>
@@ -80,9 +69,7 @@
     <ng-container matColumnDef="state">
         <mat-header-cell *matHeaderCellDef mat-sort-header>State</mat-header-cell>
         <mat-cell *matCellDef="let motion">
-            <div *ngIf='motion.category' class='small'>
+            <div *ngIf="motion.category" class="small"><mat-icon>device_hub</mat-icon>{{ motion.category }}</div>
-                <mat-icon>device_hub</mat-icon>{{ motion.category }}
-            </div>
         </mat-cell>
     </ng-container>
 
@@ -93,7 +80,8 @@
             <button mat-icon-button (click)="onSpeakerIcon(motion, $event)">
                 <mat-icon
                     [matBadge]="motion.agendaSpeakerAmount > 0 ? motion.agendaSpeakerAmount : null"
-                    matBadgeColor="accent">
+                    matBadgeColor="accent"
+                >
                     mic
                 </mat-icon>
             </button>
@@ -101,8 +89,12 @@
     </ng-container>
 
     <mat-header-row *matHeaderRowDef="getColumnDefinition()"></mat-header-row>
-    <mat-row [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected': ''" (click)='selectItem(row, $event)'
+    <mat-row
-        *matRowDef="let row; columns: getColumnDefinition()" class="lg">
+        [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
+        (click)="selectItem(row, $event)"
+        *matRowDef="let row; columns: getColumnDefinition()"
+        class="lg"
+    >
     </mat-row>
 </mat-table>
 
@@ -185,7 +177,11 @@
             <span translate>Export as CSV</span>
         </button>
         <mat-divider></mat-divider>
-        <button mat-menu-item class="red-warning-text" (click)="multiselectService.delete(selectedRows); toggleMultiSelect()">
+        <button
+            mat-menu-item
+            class="red-warning-text"
+            (click)="multiselectService.delete(selectedRows); toggleMultiSelect()"
+        >
             <mat-icon>delete</mat-icon>
             <span translate>Delete selected</span>
         </button>

client/src/app/site/motions/models/view-motion.ts

@@ -154,9 +154,7 @@ export class ViewMotion extends BaseViewModel {
     }
 
     public get possibleStates(): WorkflowState[] {
-        return this.workflow
+        return this.workflow ? this.workflow.states : null;
-            ? this.workflow.states
-            : null;
     }
 
     public get recommendation_id(): number {

client/src/app/site/motions/models/view-workflow.ts

@@ -34,7 +34,7 @@ export class ViewWorkflow extends BaseViewModel {
         return this.workflow ? this.workflow.name : null;
     }
 
-    public get states() : WorkflowState[] {
+    public get states(): WorkflowState[] {
         return this.workflow ? this.workflow.states : null;
     }
 

client/src/app/site/motions/services/motion-multiselect.service.spec.ts

@@ -11,10 +11,7 @@ describe('MotionMultiselectService', () => {
         });
     });
 
-    it('should be created', inject(
+    it('should be created', inject([MotionMultiselectService], (service: MotionMultiselectService) => {
-        [MotionMultiselectService],
-        (service: MotionMultiselectService) => {
         expect(service).toBeTruthy();
-        }
+    }));
-    ));
 });

client/src/app/site/motions/services/motion-multiselect.service.ts

@@ -120,7 +120,7 @@ export class MotionMultiselectService {
         const title = this.translate.instant('This will add the following submitters of all selected motions:');
         const selectedChoice = await this.choiceService.open(title, this.userRepo.getViewModelList(), true);
         if (selectedChoice) {
-            throw new Error("Not implemented on the server");
+            throw new Error('Not implemented on the server');
         }
     }
 
@@ -133,7 +133,7 @@ export class MotionMultiselectService {
         const title = this.translate.instant('This will remove the following submitters from all selected motions:');
         const selectedChoice = await this.choiceService.open(title, this.userRepo.getViewModelList(), true);
         if (selectedChoice) {
-            throw new Error("Not implemented on the server");
+            throw new Error('Not implemented on the server');
         }
     }
 

client/src/app/site/motions/services/workflow-repository.service.ts

@@ -69,12 +69,11 @@ export class WorkflowRepositoryService extends BaseRepository<ViewWorkflow, Work
         return wfList.find(workflow => workflow.id === workflow_id);
     }
 
-    public getAllWorkflowStates(): WorkflowState[]{
+    public getAllWorkflowStates(): WorkflowState[] {
         let states: WorkflowState[] = [];
         this.DS.getAll(Workflow).forEach(workflow => {
             states = states.concat(workflow.states);
-        })
+        });
         return states;
     }
-
 }

client/src/app/site/users/components/user-list/user-list.component.html

@@ -1,39 +1,25 @@
-<os-head-bar mainButton=true (mainEvent)=onPlusButton() [multiSelectMode]="isMultiSelect">
+<os-head-bar mainButton="true" (mainEvent)="onPlusButton()" [multiSelectMode]="isMultiSelect">
     <!-- Title -->
-    <div class="title-slot">
+    <div class="title-slot"><h2 translate>Participants</h2></div>
-        <h2 translate>Participants</h2>
-    </div>
 
     <!-- Menu -->
     <div class="menu-slot">
-        <button type="button" mat-icon-button [matMenuTriggerFor]="userMenu">
+        <button type="button" mat-icon-button [matMenuTriggerFor]="userMenu"><mat-icon>more_vert</mat-icon></button>
-            <mat-icon>more_vert</mat-icon>
-        </button>
     </div>
 
     <!-- Multiselect info -->
     <div class="central-info-slot">
-        <button mat-icon-button (click)="toggleMultiSelect()">
+        <button mat-icon-button (click)="toggleMultiSelect()"><mat-icon>arrow_back</mat-icon></button>
-            <mat-icon>arrow_back</mat-icon>
-        </button>
         <span>{{ selectedRows.length }}&nbsp;</span><span translate>selected</span>
     </div>
 
     <div class="extra-controls-slot on-transition-fade" *ngIf="isMultiSelect">
-        <button mat-icon-button (click)="deleteSelected()">
+        <button mat-icon-button (click)="deleteSelected()"><mat-icon>delete</mat-icon></button>
-            <mat-icon>delete</mat-icon>
-        </button>
     </div>
-
 </os-head-bar>
 
 <div class="custom-table-header on-transition-fade">
-    <button mat-button>
+    <button mat-button><span translate>SORT</span></button> <button mat-button><span translate>FILTER</span></button>
-        <span translate>SORT</span>
-    </button>
-    <button mat-button>
-        <span translate>FILTER</span>
-    </button>
 </div>
 
 <mat-table class="os-listview-table on-transition-fade" [dataSource]="dataSource" matSort>
@@ -54,12 +40,12 @@
     <ng-container matColumnDef="group">
         <mat-header-cell *matHeaderCellDef mat-sort-header>Group</mat-header-cell>
         <mat-cell *matCellDef="let user">
-            <div class='groupsCell'>
+            <div class="groupsCell">
                 <span *ngIf="user.groups.length > 0">
                     <mat-icon>people</mat-icon>
                     {{ user.groups }}
                 </span>
-                <br *ngIf="user.groups && user.structureLevel">
+                <br *ngIf="user.groups && user.structureLevel" />
                 <span *ngIf="user.structureLevel">
                     <mat-icon>flag</mat-icon>
                     {{ user.structure_level }}
@@ -80,8 +66,11 @@
     </ng-container>
 
     <mat-header-row *matHeaderRowDef="getColumnDefinition()"></mat-header-row>
-    <mat-row [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected': ''" (click)='selectItem(row, $event)'
+    <mat-row
-        *matRowDef="let row; columns: getColumnDefinition()">
+        [ngClass]="selectedRows.indexOf(row) >= 0 ? 'selected' : ''"
+        (click)="selectItem(row, $event)"
+        *matRowDef="let row; columns: getColumnDefinition()"
+    >
     </mat-row>
 </mat-table>
 

client/src/app/site/users/components/user-list/user-list.component.ts

@@ -45,7 +45,7 @@ export class UserListComponent extends ListViewBaseComponent<ViewUser> implement
         private router: Router,
         private route: ActivatedRoute,
         protected csvExport: CsvExportService,
-        private promptService: PromptService,
+        private promptService: PromptService
     ) {
         super(titleService, translate, matSnackBar);
 
@@ -133,7 +133,7 @@ export class UserListComponent extends ListViewBaseComponent<ViewUser> implement
      */
     public async setGroupSelected(add: boolean): Promise<void> {
         let content: string;
-        if (add){
+        if (add) {
             content = this.translate.instant('This will add the following groups to all selected users:');
         } else {
             content = this.translate.instant('This will remove the following groups from all selected users:');

client/src/app/site/users/services/user-repository.service.ts

@@ -116,11 +116,14 @@ export class UserRepositoryService extends BaseRepository<ViewUser, User> {
         const subject = this.translate.instant(this.configService.instant('users_email_subject'));
         const message = this.translate.instant(this.configService.instant('users_email_body'));
 
-        const response = await this.httpService.post<{count: Number; no_email_ids: number[]}>('/rest/users/user/mass_invite_email/', {
+        const response = await this.httpService.post<{ count: Number; no_email_ids: number[] }>(
+            '/rest/users/user/mass_invite_email/',
+            {
                 user_ids: user_ids,
                 subject: subject,
-                message: message,
+                message: message
-        });
+            }
+        );
         const numEmails = response.count;
         const noEmailIds = response.no_email_ids;
         let msg;
@@ -136,19 +139,26 @@ export class UserRepositoryService extends BaseRepository<ViewUser, User> {
             msg += ' ';
 
             if (noEmailIds.length === 1) {
-                msg += this.translate.instant('The user %user% has no email, so the invitation email could not be send.');
+                msg += this.translate.instant(
+                    'The user %user% has no email, so the invitation email could not be send.'
+                );
             } else {
-                msg += this.translate.instant('The users %user% have no email, so the invitation emails could not be send.');
+                msg += this.translate.instant(
+                    'The users %user% have no email, so the invitation emails could not be send.'
+                );
             }
 
             // This one builds a username string like "user1, user2 and user3" with the full names.
-            const usernames = noEmailIds.map(id => this.getViewModel(id)).filter(user => !!user).map(user => user.short_name);
+            const usernames = noEmailIds
+                .map(id => this.getViewModel(id))
+                .filter(user => !!user)
+                .map(user => user.short_name);
             let userString;
             if (usernames.length > 1) {
                 const lastUsername = usernames.pop();
                 userString = usernames.join(', ') + ' ' + this.translate.instant('and') + ' ' + lastUsername;
             } else {
-                userString = usernames.join(', ')
+                userString = usernames.join(', ');
             }
             msg = msg.replace('%user%', userString);
         }