refactor(admin-ui): Enable TypeScript strict checks, fix errors

.gitignore

@@ -299,9 +299,6 @@ FakesAssemblies/
 .ntvs_analysis.dat
 node_modules/
 
-# Typescript v1 declaration files
-typings/
-
 # Visual Studio 6 build log
 *.plg
 

admin-ui/.gitignore

@@ -32,7 +32,6 @@
 npm-debug.log
 yarn-error.log
 testem.log
-/typings
 
 # System Files
 .DS_Store

admin-ui/src/app/catalog/catalog.routes.ts

@@ -1,5 +1,6 @@
 import { Route } from '@angular/router';
-
+import { BreadcrumbFunction } from '../core/components/breadcrumb/breadcrumb.component';
+import { DataService } from '../data/providers/data.service';
 import { ProductDetailComponent } from './components/product-detail/product-detail.component';
 import { ProductListComponent } from './components/product-list/product-list.component';
 
@@ -20,7 +21,7 @@ export const catalogRoutes: Route[] = [
     },
 ];
 
-export function productBreadcrumb(data, params, store) {
+export function productBreadcrumb(data: any, params: any, dataService: DataService) {
     return [
         {
             label: 'Products',

admin-ui/src/app/catalog/components/product-detail/product-detail.component.ts

@@ -17,7 +17,10 @@ export class ProductDetailComponent implements OnInit {
                 private route: ActivatedRoute) { }
 
     ngOnInit() {
-        this.product$ = this.dataService.product.getProduct(this.route.snapshot.paramMap.get('id')).single$;
+        const id = this.route.snapshot.paramMap.get('id');
+        if (id) {
+            this.product$ = this.dataService.product.getProduct(id).single$;
+        }
     }
 
 }

admin-ui/src/app/catalog/components/product-list/product-list.component.ts

@@ -4,6 +4,7 @@ import { Observable, Subject } from 'rxjs';
 import { map, takeUntil, tap } from 'rxjs/operators';
 import { DataService } from '../../../data/providers/data.service';
 import { GetProductList, GetProductListVariables } from '../../../data/types/gql-generated-types';
+import { QueryResult } from '../../../data/types/query-result';
 
 @Component({
     selector: 'vdr-products-list',
@@ -16,17 +17,17 @@ export class ProductListComponent implements OnInit, OnDestroy {
     totalItems: number;
     itemsPerPage = 25;
     currentPage = 1;
-    private productsQuery: QueryRef<GetProductList, GetProductListVariables>;
+    private productsQuery: QueryResult<GetProductList, GetProductListVariables>;
     private destroy$ = new Subject<void>();
 
     constructor(private dataService: DataService) { }
 
     ngOnInit() {
-        this.productsQuery = this.dataService.product.getProducts(this.itemsPerPage, 0).ref;
-        this.products$ = this.productsQuery.valueChanges.pipe(
+        this.productsQuery = this.dataService.product.getProducts(this.itemsPerPage, 0);
+        this.products$ = this.productsQuery.stream$.pipe(
             takeUntil(this.destroy$),
-            tap(val => { this.totalItems = val.data.products.totalItems; }),
-            map(val => val.data.products.items),
+            tap(val => { this.totalItems = val.products.totalItems; }),
+            map(val => val.products.items),
         );
     }
 
@@ -38,6 +39,6 @@ export class ProductListComponent implements OnInit, OnDestroy {
     getPage(pageNumber: number): void {
         const take = this.itemsPerPage;
         const skip = (pageNumber - 1) * this.itemsPerPage;
-        this.productsQuery.refetch({ skip, take });
+        this.productsQuery.ref.refetch({ skip, take });
     }
 }

admin-ui/src/app/core/components/breadcrumb/breadcrumb.component.spec.ts

@@ -5,6 +5,7 @@ import { Resolve, Router, Routes } from '@angular/router';
 import { RouterTestingModule } from '@angular/router/testing';
 import { Observable, of as observableOf } from 'rxjs';
 import { BehaviorSubject } from 'rxjs/BehaviorSubject';
+import { notNullOrUndefined } from '../../../../../../shared/shared-utils';
 import { DataService } from '../../../data/providers/data.service';
 import { BreadcrumbComponent, BreadcrumbLabelLinkPair } from './breadcrumb.component';
 
@@ -52,7 +53,7 @@ describe('BeadcrumbsComponent', () => {
                         path: 'resolved-function-child',
                         component: TestParentComponent,
                         data: {
-                            breadcrumb: data => data.foo,
+                            breadcrumb: (data: any) => data.foo,
                         },
                         resolve: { foo: FooResolver },
                         children: [leafRoute],
@@ -61,7 +62,7 @@ describe('BeadcrumbsComponent', () => {
                         path: 'params-child/:name',
                         component: TestParentComponent,
                         data: {
-                            breadcrumb: (data, params) => params['name'],
+                            breadcrumb: (data: any, params: any) => params['name'],
                         },
                         children: [leafRoute],
                     },
@@ -397,8 +398,9 @@ function getBreadcrumbLabels(fixture: ComponentFixture<TestComponent>): string[]
 function getBreadcrumbLinks(fixture: ComponentFixture<TestComponent>): string[] {
     return getBreadcrumbListItems(fixture)
         .map(el => el.querySelector('a'))
-        .filter(el => !!el)
-        .map(a => a.getAttribute('href'));
+        .filter(notNullOrUndefined)
+        .map(a => a.getAttribute('href'))
+        .filter(notNullOrUndefined);
 }
 
 // tslint:disable component-selector

admin-ui/src/app/data/client-state/client-resolvers.ts

@@ -17,7 +17,7 @@ export type ResolverContext = {
 
 export type ResolverDefinition = {
     Mutation: {
-        [name: string]: GraphQLFieldResolver<any, ResolverContext>;
+        [name: string]: GraphQLFieldResolver<any, ResolverContext, any>;
     },
 };
 

admin-ui/src/app/data/providers/product-data.service.ts

@@ -13,7 +13,7 @@ export class ProductDataService {
             .query<GetProductList, GetProductListVariables>(GET_PRODUCT_LIST, { take, skip, languageCode: LanguageCode.en });
     }
 
-    getProduct(id: ID): QueryResult<GetProductById> {
+    getProduct(id: ID): QueryResult<GetProductById, GetProductByIdVariables> {
         const stringId = id.toString();
         return this.baseDataService.query<GetProductById, GetProductByIdVariables>(GET_PRODUCT_BY_ID, {
             id: stringId,

admin-ui/tsconfig.json

@@ -1,22 +1,25 @@
 {
-    "compileOnSave": false,
-    "compilerOptions": {
-        "baseUrl": "./",
-        "outDir": "./dist/out-tsc",
-        "sourceMap": true,
-        "declaration": false,
-        "moduleResolution": "node",
-        "emitDecoratorMetadata": true,
-        "experimentalDecorators": true,
-        "target": "es5",
-        "skipLibCheck": true,
-        "typeRoots": [
-            "node_modules/@types"
-        ],
-        "lib": [
-            "es2017",
-            "dom",
-            "esnext.asynciterable"
-        ]
-    }
+  "compileOnSave": false,
+  "compilerOptions": {
+    "baseUrl": "./",
+    "outDir": "./dist/out-tsc",
+    "sourceMap": true,
+    "declaration": false,
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "strict": true,
+    "strictPropertyInitialization": false,
+    "target": "es5",
+    "skipLibCheck": true,
+    "typeRoots": [
+      "node_modules/@types",
+      "./typings"
+    ],
+    "lib": [
+      "es2017",
+      "dom",
+      "esnext.asynciterable"
+    ]
+  }
 }

admin-ui/typings/merge-graphql-schemas.d.ts

@@ -0,0 +1,6 @@
+declare module 'merge-graphql-schemas' {
+    import * as MergeGraphqlSchemas from 'merge-graphql-schemas';
+
+    export function fileLoader(fileGlob: string): any;
+    export function mergeTypes(types: any[], options?: any): any;
+}

shared/shared-utils.ts

@@ -0,0 +1,7 @@
+/**
+ * Predicate with type guard, used to filter out null or undefined values
+ * in a filter operation.
+ */
+export function notNullOrUndefined<T>(val: T | undefined | null): val is T {
+    return val !== undefined && val !== null;
+}