fix: lint

src/_styles.scss

@@ -5,7 +5,7 @@
 }
 
 $green: #0ad06f;
-$light_green: #d1fff7;
+$light-green: #d1fff7;
 $odd: #cee9f0;
 $even: #c8ddf0;
 $blue: #007fff;

src/app/app.component.scss

@@ -3,9 +3,13 @@
   border: 1px solid #ccc;
   overflow: hidden;
 
-  & button {
+  .active {
+    background-color: #ccc;
+  }
+
+  button {
     background-color: inherit;
-    border: none;
+    border: 0;
     cursor: pointer;
     float: left;
     outline: none;
@@ -15,15 +19,11 @@
     &:hover {
       background-color: #ddd;
     }
-
-    &.active {
-      background-color: #ccc;
-    }
   }
 }
 
 .tabcontent {
-  border-top: none;
+  border-top: 0;
 }
 
 .tabcontent:not(.active) {

src/app/list-composition/list-composition.component.html

@@ -267,6 +267,6 @@
   ></mat-row>
 </mat-table>
 
-<button id="goTop" mat-icon-button color="primary" (click)="goTop()">
+<button class="go-top" mat-icon-button color="primary" (click)="goTop()">
   <fa-icon [icon]="faAngleUp" size="4x"></fa-icon>
 </button>

src/app/list-composition/list-composition.component.scss

@@ -1 +1 @@
-@import '../list/list.component.scss';
+@import '../list/list.component';

src/app/list-composition/list-composition.component.ts

@@ -47,6 +47,7 @@ export class ListCompositionComponent
     'size',
     'rank',
   ];
+
   displayedFichier = new BehaviorSubject([]);
   sortFichier: Sort;
   expandedElement: Composition;

src/app/list-fichier/list-fichier.component.html

@@ -279,6 +279,6 @@
   ></mat-row>
 </mat-table>
 
-<button id="goTop" mat-icon-button color="primary" (click)="goTop()">
+<button class="go-top" mat-icon-button color="primary" (click)="goTop()">
   <fa-icon [icon]="faAngleUp" size="4x"></fa-icon>
 </button>

src/app/list-fichier/list-fichier.component.scss

@@ -1 +1 @@
-@import '../list/list.component.scss';
+@import '../list/list.component';

src/app/list/list.component.scss

@@ -35,7 +35,7 @@
   display: flex;
   flex-direction: row;
 
-  & .clear-btn {
+  .clear-btn {
     align-items: center;
     display: flex;
     margin: auto;
@@ -71,7 +71,7 @@ mat-row {
   min-height: 0 !important;
 }
 
-.example-detail-row td.mat-cell {
+.example-detail-row .mat-cell {
   border-bottom-style: unset !important;
 }
 
@@ -83,11 +83,11 @@ mat-row {
   border-bottom-width: 0;
 }
 
-#goTop {
+.go-top {
   display: flex;
   margin: auto;
 
-  & ::ng-deep.fa-angle-up {
+  ::ng-deep.fa-angle-up {
     color: $blue;
   }
 }
@@ -97,18 +97,18 @@ mat-row {
 }
 
 .sorted {
-  background-color: $light_green !important;
+  background-color: $light-green !important;
 }
 
 @include media('800px') {
   .filters {
     flex-direction: column;
 
-    & ::ng-deep.mat-form-field-flex {
+    ::ng-deep.mat-form-field-flex {
       flex-direction: row;
     }
 
-    & .filter-item .mat-form-field {
+    .filter-item .mat-form-field {
       width: 90vw;
     }
   }

src/app/services/data.service.ts

@@ -7,7 +7,7 @@ import * as JSZip from 'jszip';
 
 import {DropboxService} from './dropbox.service';
 import {UtilsService} from './utils.service';
-import {Composition, Fichier} from '../utils/model';
+import {Composition, Fichier, File} from '../utils/model';
 import {ToastService} from './toast.service';
 import {Dropbox} from '../utils/dropbox';
 
@@ -27,7 +27,7 @@ export class DataService {
 
   loadsList<T>(
     table: Dexie.Table<T, number>,
-    file: Dexie.Table<any, number>,
+    file: Dexie.Table<File, number>,
     dropboxFile: string,
     isCompilation: boolean
   ): void {
@@ -47,7 +47,7 @@ export class DataService {
           table,
           file,
           fileNameToDownload,
-          'Download ' + dropboxFile,
+          `Download ${dropboxFile}`,
           isCompilation
         );
       } else if (!fileNameToDownload && storedName) {
@@ -63,7 +63,7 @@ export class DataService {
             table,
             file,
             fileNameToDownload,
-            'Update ' + dropboxFile,
+            `Update ${dropboxFile}`,
             isCompilation
           );
         } else {
@@ -87,7 +87,7 @@ export class DataService {
       .bulkAdd(data)
       .then(lastKey => {
         console.log(`Done adding ${data.length} datas`);
-        console.log('Last data id was: ' + lastKey);
+        console.log(`Last data id was: ${lastKey}`);
         return lastKey;
       })
       .catch(Dexie.BulkError, e => {
@@ -116,7 +116,7 @@ export class DataService {
 
   downloadsList<T>(
     table: Dexie.Table<T, number>,
-    fileTable: Dexie.Table<any, number>,
+    fileTable: Dexie.Table<File, number>,
     fileName: string,
     resultMessage: string,
     isCompilation: boolean
@@ -127,7 +127,7 @@ export class DataService {
     return this.dropboxService
       .downloadFile(fileName)
       .then((content: string) => {
-        this.toast.open('File downloaded: ' + fileName);
+        this.toast.open(`File downloaded: ${fileName}`);
         return zip.loadAsync(content);
       })
       .then(content => zip.file(Object.keys(content.files)[0]).async('string'))
@@ -136,7 +136,7 @@ export class DataService {
           // Parse file
           const dataList = this.parseData(dataFromFile, isCompilation);
           const t1 = performance.now();
-          console.log('Call took ' + (t1 - t0) / 1000 + ' seconds');
+          console.log(`Call took ${(t1 - t0) / 1000} seconds`);
           return dataList;
         } else {
           return [];

src/app/services/dexie.service.ts

@@ -1,15 +1,15 @@
 import {Injectable} from '@angular/core';
 import Dexie from 'dexie';
-import {Composition, Fichier} from '../utils/model';
+import {Composition, Fichier, File} from '../utils/model';
 
 @Injectable({
   providedIn: 'root',
 })
 export class DexieService extends Dexie {
   compositionTable: Dexie.Table<Composition, number>;
   fichierTable: Dexie.Table<Fichier, number>;
-  fileComposition: Dexie.Table<any, number>;
-  fileFichier: Dexie.Table<any, number>;
+  fileComposition: Dexie.Table<File, number>;
+  fileFichier: Dexie.Table<File, number>;
 
   constructor() {
     super('NgMusic');

src/app/services/dropbox.service.ts

@@ -2,14 +2,14 @@ import {Injectable} from '@angular/core';
 import * as Dropbox from 'dropbox';
 
 import {UtilsService} from './utils.service';
-import {Dropbox as DropboxConstante} from '../utils/dropbox';
+import {Dropbox as DropboxConstant} from '../utils/dropbox';
 
 @Injectable({providedIn: 'root'})
 export class DropboxService {
   constructor(private serviceUtils: UtilsService) {}
 
   getDbx(): Dropbox.Dropbox {
-    return new Dropbox.Dropbox({accessToken: DropboxConstante.DROPBOX_TOKEN});
+    return new Dropbox.Dropbox({accessToken: DropboxConstant.DROPBOX_TOKEN});
   }
 
   listFiles(folder: string): Promise<Dropbox.files.ListFolderResult> {
@@ -23,7 +23,7 @@ export class DropboxService {
   }
 
   getPath(fileName: string): string {
-    return DropboxConstante.DROPBOX_FOLDER + fileName;
+    return DropboxConstant.DROPBOX_FOLDER + fileName;
   }
 
   uploadFile(
@@ -33,9 +33,9 @@ export class DropboxService {
     const pathFile = this.getPath(fileName);
     return this.getDbx()
       .filesDeleteV2({path: pathFile})
-      .then(() => {
-        return this.getDbx().filesUpload({path: pathFile, contents: fichier});
-      })
+      .then(() =>
+        this.getDbx().filesUpload({path: pathFile, contents: fichier})
+      )
       .catch(err => this.serviceUtils.handlePromiseError(err));
   }
 
@@ -50,7 +50,7 @@ export class DropboxService {
       .catch(err => this.serviceUtils.handlePromiseError(err));
   }
 
-  downloadFile(fileName: string): Promise<any> {
+  downloadFile(fileName: string): Promise<unknown> {
     return this.getDbx()
       .filesDownload({path: this.getPath(fileName)})
       .then((response: any) => {
@@ -60,9 +60,7 @@ export class DropboxService {
             fileReader.abort();
             reject(new DOMException('Problem parsing input file.'));
           };
-          fileReader.onload = () => {
-            return resolve(fileReader.result.toString());
-          };
+          fileReader.onload = () => resolve(fileReader.result.toString());
           fileReader.readAsBinaryString(response.fileBlob);
         });
       })

src/app/services/utils.service.ts

@@ -13,7 +13,7 @@ export class UtilsService {
     if (error.response) {
       message = error.response.error;
     } else if (error.error && error.error.errors) {
-      message = 'Status ' + error.status + ': ' + error.error.errors.join(', ');
+      message = `Status ${error.status}: ${error.error.errors.join(', ')}`;
     } else if (error.error) {
       message = error.error;
     } else if (error.message) {
@@ -27,7 +27,7 @@ export class UtilsService {
   static encodeQueryUrl(query: string): string {
     return encodeURIComponent(query).replace(
       /[!'()*]/g,
-      c => '%' + c.charCodeAt(0).toString(16)
+      c => `%${c.charCodeAt(0).toString(16)}`
     );
   }
 
@@ -45,8 +45,7 @@ export class UtilsService {
   }
 
   handlePromiseError(error: any): Promise<any> {
-    console.log('handlePromiseError');
-    console.error('error', error);
+    console.error('handlePromiseError', error);
     this.toast.open(UtilsService.getErrorMessage(error));
     return new Promise<any>(resolve => {
       resolve(undefined);

src/app/utils/dropbox.ts

@@ -1,6 +1,7 @@
 export class Dropbox {
   static readonly DROPBOX_TOKEN =
     'G-_ZeiEAvB0AAAAAAAANQd4IMHRr7Y9aTvAiivg-8LImbDKmo9pdu95_SIioW3lR';
+
   static readonly DROPBOX_FOLDER = '/XML/';
   static readonly DROPBOX_COMPOSITION_FILE = 'final';
   static readonly DROPBOX_FICHIER_FILE = 'fichier';

src/app/utils/model.ts

@@ -87,3 +87,8 @@ export class Dropdown {
     this.code = code;
   }
 }
+
+export class File {
+  id?: number;
+  filename: string;
+}

src/app/utils/title.pipe.ts

@@ -8,7 +8,10 @@ const unicodeWordMatch =
   name: 'title',
 })
 export class TitlePipe implements PipeTransform {
-  transform(value: any, replaceUnderscore?: boolean): any {
+  transform(
+    value: unknown | string,
+    replaceUnderscore?: boolean
+  ): unknown | string {
     if (!value) {
       return value;
     }

src/app/utils/utils.ts

@@ -100,15 +100,15 @@ export class Utils {
       return items;
     }
     const val = value.toLowerCase();
-    return items.filter(item => {
-      return fields.some(field => {
+    return items.filter(item =>
+      fields.some(field => {
         let it = item[field];
         if (it) {
           it = typeof it === 'string' ? it.toLowerCase() : it.toString();
           return it.includes(val);
         }
-      });
-    });
+      })
+    );
   }
 
   static paginate<T>(list: T[], page: PageEvent): T[] {

src/main.ts

@@ -10,4 +10,4 @@ if (environment.production) {
 
 platformBrowserDynamic()
   .bootstrapModule(AppModule)
-  .catch(err => console.log(err));
+  .catch(err => console.error(err));