feat(web): upgrade angular and fix lint issues

new-eden-social · Jun 20, 2019 · 45218c4 · 45218c4
1 parent 45a3d56
commit 45218c4
Show file tree

Hide file tree

Showing 89 changed files with 3,040 additions and 3,310 deletions.
diff --git a/web/.angular-cli.json b/web/.angular-cli.json
diff --git a/web/angular.json b/web/angular.json
@@ -141,7 +141,9 @@
         "lint": {
           "builder": "@angular-devkit/build-angular:tslint",
           "options": {
-            "tsConfig": [],
+            "tsConfig": [
+                "e2e/tsconfig.e2e.json"
+            ],
             "exclude": [
               "**/node_modules/**"
             ]

diff --git a/web/package.json b/web/package.json
@@ -21,67 +21,66 @@
     "serve:ssr": "node dist/server"
   },
   "dependencies": {
-    "@ctrl/ngx-emoji-mart": "^0.4.0",
-    "@angular/animations": "^6.0.9",
-    "@angular/cdk": "^6.3.3",
-    "@angular/common": "^6.0.9",
-    "@angular/core": "^6.0.9",
-    "@angular/forms": "^6.0.9",
-    "@angular/http": "^6.0.9",
-    "@angular/material": "^6.3.3",
-    "@angular/platform-browser": "^6.0.9",
-    "@angular/platform-browser-dynamic": "^6.0.9",
-    "@angular/platform-server": "^6.0.9",
-    "@angular/router": "^6.0.9",
-    "@ngrx/effects": "^6.0.1",
-    "@ngrx/router-store": "^6.0.1",
-    "@ngrx/store": "^6.0.1",
-    "@ngrx/store-devtools": "^6.0.1",
-    "@nguniversal/common": "^6.0.0",
-    "@nguniversal/express-engine": "^6.0.0",
-    "@nguniversal/module-map-ngfactory-loader": "^6.0.0",
-    "@types/socket.io": "^1.4.36",
+    "@ctrl/ngx-emoji-mart": "^0.17.0",
+    "@angular/animations": "^8.0.2",
+    "@angular/cdk": "^8.0.1",
+    "@angular/common": "^8.0.2",
+    "@angular/core": "^8.0.2",
+    "@angular/forms": "^8.0.2",
+    "@angular/http": "^7.2.15",
+    "@angular/material": "^8.0.1",
+    "@angular/platform-browser": "^8.0.2",
+    "@angular/platform-browser-dynamic": "^8.0.2",
+    "@angular/platform-server": "^8.0.2",
+    "@angular/router": "^8.0.2",
+    "@ngrx/effects": "^8.0.1",
+    "@ngrx/router-store": "^8.0.1",
+    "@ngrx/store": "^8.0.1",
+    "@ngrx/store-devtools": "^8.0.1",
+    "@nguniversal/common": "^7.1.1",
+    "@nguniversal/express-engine": "^7.1.1",
+    "@nguniversal/module-map-ngfactory-loader": "^7.1.1",
+    "@types/socket.io": "^2.1.2",
     "@types/socket.io-client": "^1.4.32",
     "angular2-moment": "^1.9.0",
-    "core-js": "^2.5.7",
-    "express": "^4.16.3",
-    "flux-standard-action": "^2.0.3",
+    "core-js": "^3.1.4",
+    "express": "^4.17.1",
+    "flux-standard-action": "^2.1.0",
     "hammerjs": "^2.0.8",
-    "moment": "^2.22.2",
-    "ngrx-store-localstorage": "^5.0.1",
-    "ngx-infinite-scroll": "^6.0.1",
-    "normalize.css": "^8.0.0",
-    "rxjs": "^6.2.2",
-    "rxjs-compat": "^6.2.2",
-    "socket.io-client": "^2.1.1",
-    "ts-loader": "^4.4.2",
-    "webpack": "^4.16.0",
-    "zone.js": "^0.8.26"
+    "moment": "^2.24.0",
+    "ngrx-store-localstorage": "^7.0.1",
+    "ngx-infinite-scroll": "^7.2.0",
+    "normalize.css": "^8.0.1",
+    "rxjs": "^6.5.2",
+    "socket.io-client": "^2.2.0",
+    "ts-loader": "^6.0.3",
+    "webpack": "^4.35.0",
+    "zone.js": "^0.9.1"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "^0.6.8",
-    "@angular/cli": "^6.0.8",
-    "@angular/compiler": "^6.0.9",
-    "@angular/compiler-cli": "^6.0.9",
-    "@angular/language-service": "^6.0.9",
-    "@types/jasmine": "^2.8.8",
-    "@types/node": "^10.5.2",
-    "codelyzer": "^4.4.2",
+    "@angular-devkit/build-angular": "^0.800.3",
+    "@angular/cli": "^8.0.3",
+    "@angular/compiler": "^8.0.2",
+    "@angular/compiler-cli": "^8.0.2",
+    "@angular/language-service": "^8.0.2",
+    "@types/jasmine": "^3.3.13",
+    "@types/node": "^12.0.8",
+    "codelyzer": "^5.1.0",
     "cz-conventional-changelog": "^2.1.0",
-    "jasmine-core": "^3.1.0",
+    "jasmine-core": "^3.4.0",
     "jasmine-spec-reporter": "^4.2.1",
-    "karma": "^2.0.4",
+    "karma": "^4.1.0",
     "karma-chrome-launcher": "^2.2.0",
-    "karma-cli": "^1.0.1",
-    "karma-coverage-istanbul-reporter": "^2.0.1",
+    "karma-cli": "^2.0.0",
+    "karma-coverage-istanbul-reporter": "^2.0.5",
     "karma-firefox-launcher": "^1.1.0",
-    "karma-jasmine": "^1.1.2",
-    "karma-jasmine-html-reporter": "^1.2.0",
-    "protractor": "^5.3.2",
-    "ts-node": "^7.0.0",
-    "tslint": "^5.10.0",
-    "typescript": "~2.7.0",
-    "webpack-command": "^0.4.1"
+    "karma-jasmine": "^2.0.1",
+    "karma-jasmine-html-reporter": "^1.4.2",
+    "protractor": "^5.4.2",
+    "ts-node": "^8.3.0",
+    "tslint": "^5.17.0",
+    "typescript": "~3.5.2",
+    "webpack-command": "^0.4.2"
   },
   "config": {
     "commitizen": {

diff --git a/web/src/app/about/about.component.ts b/web/src/app/about/about.component.ts
@@ -2,7 +2,7 @@ import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import { select, Store } from '@ngrx/store';
 import { IAppState } from '../app.store';
-import { Observable } from 'rxjs/Rx';
+import { Observable } from 'rxjs';
 import { map } from 'rxjs/internal/operators';
 
 @Component({

diff --git a/web/src/app/about/about.module.ts b/web/src/app/about/about.module.ts
@@ -1,13 +1,13 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { AboutComponent } from './about.component';
-import { MatButtonModule } from '@angular/material';
 import { RouterModule } from '@angular/router';
 import { EvebookComponent } from './evebook/evebook.component';
 import { LegalComponent } from './legal/legal.component';
 import { ApiComponent } from './api/api.component';
 import { OtherPartiesComponent } from './other-parties/other-parties.component';
 import { DonationsComponent } from './donations/donations.component';
+import { MatButtonModule } from '@angular/material/button';
 
 @NgModule({
   imports: [

diff --git a/web/src/app/app.module.ts b/web/src/app/app.module.ts
@@ -3,7 +3,6 @@ import { NgModule } from '@angular/core';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { RouterModule } from '@angular/router';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { MatProgressSpinnerModule, MatSnackBarModule } from '@angular/material';
 import { appRoutes } from './app.routes';
 import { AppComponent } from './app.component';
 import { NavbarModule } from './navbar/navbar.module';
@@ -21,6 +20,8 @@ import { PageNotFoundModule } from './page-not-found/page-not-found.module';
 import {TransferHttpCacheModule} from '@nguniversal/common';
 import { ProfileModule } from './profile/profile.module';
 import { AboutModule } from './about/about.module';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
+import { MatSnackBarModule } from '@angular/material/snack-bar';
 
 @NgModule({
   declarations: [

diff --git a/web/src/app/app.store.ts b/web/src/app/app.store.ts
@@ -34,17 +34,17 @@ import { ApiEffects } from './services/api.effects';
 import {FollowEffects} from './services/follow/follow.effects';
 
 export interface IAppState {
-  authentication?: IAuthenticationState,
-  search?: ISearchState,
-  character?: ICharacterState,
-  corporation?: ICorporationState,
-  alliance?: IAllianceState,
-  comment?: ICommentState,
-  post?: IPostState,
-  router?: RouterReducerState,
-  websocket?: IWebsocketState,
-  notification?: INotificationState,
-  api?: IApiState,
+  authentication?: IAuthenticationState;
+  search?: ISearchState;
+  character?: ICharacterState;
+  corporation?: ICorporationState;
+  alliance?: IAllianceState;
+  comment?: ICommentState;
+  post?: IPostState;
+  router?: RouterReducerState;
+  websocket?: IWebsocketState;
+  notification?: INotificationState;
+  api?: IApiState;
 }
 
 export function localStorage(reducer: ActionReducer<any>): ActionReducer<any> {

diff --git a/web/src/app/authentication/authentication.component.ts b/web/src/app/authentication/authentication.component.ts
@@ -51,10 +51,10 @@ export class AuthenticationComponent implements OnInit {
 
   ngOnInit() {
     this.activatedRoute.queryParams.subscribe((params: Params) => {
-      const accessToken = params['access_token'];
-      const refreshToken = params['refresh_token'];
-      const expiresIn = params['expires_in'];
-      const tokenType = params['token_type'];
+      const accessToken = params.access_token;
+      const refreshToken = params.refresh_token;
+      const expiresIn = params.expires_in;
+      const tokenType = params.token_type;
 
       this.store.dispatch(new AuthenticateCallback({
         accessToken,

diff --git a/web/src/app/authentication/authentication.module.ts b/web/src/app/authentication/authentication.module.ts
@@ -1,7 +1,7 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { AuthenticationComponent } from './authentication.component';
-import { MatProgressSpinnerModule } from '@angular/material';
+import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
 
 @NgModule({
   imports: [

diff --git a/web/src/app/hashtag/hashtag.component.html b/web/src/app/hashtag/hashtag.component.html
@@ -13,7 +13,7 @@ <h2>Posts for <strong>#{{ hashtag }}</strong></h2>
       <app-footer></app-footer>
     </div>
 
-    <app-loading class="wide" *ngIf="!(wall$ | async)"></app-loading>
+    <app-loading class="wide" *ngIf="(wall$ | async) === null"></app-loading>
 
     <div *ngIf="wall$ | async" class="wide" infiniteScroll (scrolled)="onScroll()">
       <app-post-list [showForm]="false" [postList]="wall$ | async"></app-post-list>

diff --git a/web/src/app/hashtag/hashtag.component.ts b/web/src/app/hashtag/hashtag.component.ts
@@ -1,5 +1,5 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
-import { Observable } from 'rxjs/Observable';
+import { Observable } from 'rxjs';
 import { DPostList } from '../services/post/post.dto';
 import { ActivatedRoute, Router } from '@angular/router';
 import { PostEffects } from '../services/post/post.effects';
@@ -23,7 +23,7 @@ export class HashtagComponent implements OnInit, OnDestroy {
 
   wall$: Observable<DPostList>;
 
-  page: number = 0;
+  page = 0;
   hashtag: string;
 
   constructor(
@@ -47,7 +47,7 @@ export class HashtagComponent implements OnInit, OnDestroy {
   ngOnInit() {
     this.route.params.subscribe(() => {
       this.page = 0;
-      this.hashtag = this.route.snapshot.params['hashtag'];
+      this.hashtag = this.route.snapshot.params.hashtag;
       this.wall$ = this.store.pipe(select('post', 'list', `hashtag:${this.hashtag}`));
       this.store.dispatch(new GetHashtag({
         hashtag: this.hashtag,

diff --git a/web/src/app/hashtag/hashtag.module.ts b/web/src/app/hashtag/hashtag.module.ts
@@ -4,7 +4,7 @@ import { HashtagComponent } from './hashtag.component';
 import { LoadingModule } from '../loading/loading.module';
 import { PostListModule } from '../post-list/post-list.module';
 import { FooterModule } from '../footer/footer.module';
-import { MatButtonModule } from '@angular/material';
+import { MatButtonModule } from '@angular/material/button';
 
 @NgModule({
   imports: [

diff --git a/web/src/app/home/home.component.html b/web/src/app/home/home.component.html
@@ -16,12 +16,12 @@
     <app-footer></app-footer>
   </div>
 
-  <app-loading class="wide" *ngIf="!(postList$ | async)"></app-loading>
+  <app-loading class="wide" *ngIf="(postList$ | async) === null"></app-loading>
 
   <div class="wide" *ngIf="postList$ | async" infiniteScroll (scrolled)="onScroll()">
     <app-post-list [postList]="postList$ | async"></app-post-list>
   </div>
 </div>
 
 <!--Not Authenticated -->
-<app-home-welcome *ngIf="!(authenticated$ | async)"></app-home-welcome>
+<app-home-welcome *ngIf="(authenticated$ | async) === null"></app-home-welcome>
diff --git a/web/src/app/home/home.component.ts b/web/src/app/home/home.component.ts
@@ -1,8 +1,8 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 
-import 'rxjs/add/operator/startWith';
-import 'rxjs/add/operator/map';
-import 'rxjs/add/operator/debounceTime';
+
+
+
 import { Observable } from 'rxjs';
 import { DPostList } from '../services/post/post.dto';
 import { select, Store } from '@ngrx/store';
@@ -60,7 +60,7 @@ export class HomeComponent implements OnInit, OnDestroy {
   ) {
     this.postList$ = this.store.pipe(select('post', 'list', 'latest'));
     this.authenticated$ = this.store.pipe(select('authentication', 'authenticated'));
-    this.websocketConnected$ = this.store.pipe(select('websocket', 'connected'))
+    this.websocketConnected$ = this.store.pipe(select('websocket', 'connected'));
   }
 
   ngOnDestroy() {

diff --git a/web/src/app/home/home.module.ts b/web/src/app/home/home.module.ts
@@ -2,10 +2,6 @@ import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { HomeComponent } from './home.component';
 import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import {
-  MatButtonModule, MatCardModule, MatIconModule, MatInputModule,
-  MatListModule,
-} from '@angular/material';
 import { HttpClientModule } from '@angular/common/http';
 import { HomeProfileModule } from './profile/profile.module';
 import { InfiniteScrollModule } from 'ngx-infinite-scroll';
@@ -16,6 +12,11 @@ import { RouterModule } from '@angular/router';
 import { FooterModule } from '../footer/footer.module';
 import { PostListModule } from '../post-list/post-list.module';
 import { LoadingModule } from '../loading/loading.module';
+import { MatCardModule } from '@angular/material/card';
+import { MatButtonModule } from '@angular/material/button';
+import { MatIconModule } from '@angular/material/icon';
+import { MatInputModule } from '@angular/material/input';
+import { MatListModule } from '@angular/material/list';
 
 @NgModule({
   imports: [

diff --git a/web/src/app/home/profile/profile.component.html b/web/src/app/home/profile/profile.component.html
@@ -28,6 +28,6 @@
   </div>
 </mat-card>
 
-<mat-card class="profile-card" *ngIf="!(character$ | async)">
+<mat-card class="profile-card" *ngIf="(character$ | async) === null">
   <app-loading></app-loading>
 </mat-card>