[ADF-5146] Upgrade to Angular 10 (#5834)

* remove useless module

* upgrade to angular 8

* upgrade material to v8

* upgrade adf libs

* migrate demo shell to v8

* upgrade to angular 9

* upgrade material to v9

* remove hammer

* upgrade nx

* upgrade datetime picker

* upgrade flex layout

* update core api

* remove entry components

* code fixes

* upgrade testbed usage

* code fixes

* remove unnecessary core-js from tests

* upgrade CLI

* ts config fixes

* fix builds

* fix testing config

* compile fixes

* fix demo shell dev setup

* fix core tests

* fix card view import

* upgrade nx

* disable smart builds for now

* remove fdescribe

* restore smart builds

* fix issues

* unify tsconfigs and fix newly found issues

* fix configuration and cleanup package scripts

* improved production build from the same config

* use ADF libs directly instead of node_modules

* disable smart build

* single app configuration (angular)

* fix core build

* fix build scripts

* lint fixes

* fix linting setup

* fix linting rules

* various fixes

* disable affected libs for unit tests

* cleanup insights package.json

* simplify smart-build

* fix content tests

* fix tests

* test fixes

* fix tests

* fix test

* fix tests

* disable AppExtensionsModule (monaco example)

* remove monaco extension module

* upgrade bundle check rules

* fix insights tests and karma config

* fix protractor config

* e2e workaround

* upgrade puppeteer and split linting and build

* reusable resources config

* update protractor config

* fix after rebase

* fix protractor config

* fix e2e tsconfig

* update e2e setup

* Save demoshell artifact on S3 and remove travis cache

* Push the libs on S3 and fetch before releasing it

* Add deps

* Add dependencies among libs and run only affected unit test and build

* fix the travis stage name

* fix after renaming dev to demoshell

* force the order of the projects

* remove unused dependencies

* fix content e2e script

* exit codes fix

* add extra exit codes to core e2e

* postinstall hook and package cleanup

* cleanup packages

* remove deprecated code and dependency on router

* improve bundle analyzer script

* minor code fixes

* update spec

* fix code after rebase

* upgrade protractor after rebase

* fix e2e mapping lib

* Update tsconfig.e2e.json

* update e2e tsconfig

* fix angular config

* fix protractor runs

* cache dist folder for libs

* update material selectors for dropdowns

* selector fixes

* remove duplicated e2e that have unit tests already

* fix login selector

* fix e2e

* fix test

* fix import issues

* fix selector

* cleanup old monaco extension files

* cleanup demo shell login

* add protractor max retries

* disable customisations of protractor

* fix login validation

* fix after rebase

* fix after rebase, disable latest versions of libs

* Hide the report tab and rollback the localstorage

* rename protractor config back to js

* restore lint as part of build

* cleanup code

* do not copy anything to node_modules on dist test

* fix unit tests

* config fixes

* fix code

* fix code after rebase

* fix tests

* remove existing words from spellcheck

* remove useless directive decorators

* update package.json after rebase

* add js-api back

* code fixes

* add missing export

* update configs

* fix code

* try fix the sso login test

* fix

* remove puppeteer unit

* fix e2e script

* fix

* make provider easy

* fix routes module before upgrade

* fix unit tests

* upgrade angular cli

* upgrade to angular 10

Co-authored-by: maurizio vitale <maurizio.vitale@alfresco.com>
Co-authored-by: Eugenio Romano <eugenio.romano@alfresco.com>
Co-authored-by: Eugenio Romano <eromano@users.noreply.github.com>

lib/core/layout/components/header/header.component.spec.ts

@@ -20,7 +20,7 @@ import { HeaderLayoutComponent } from './header.component';
 import { setupTestBed } from '../../../testing/setup-test-bed';
 import { CoreTestingModule } from '../../../testing/core.testing.module';
 import { By } from '@angular/platform-browser';
-import { LayoutModule } from '../..';
+import { SidenavLayoutModule } from '../../layout.module';
 import { Component } from '@angular/core';
 import { MaterialModule } from './../../../material.module';
 import { TranslateModule } from '@ngx-translate/core';
@@ -189,7 +189,7 @@ describe('HeaderLayoutComponent', () => {
             imports: [
                 TranslateModule.forRoot(),
                 CoreTestingModule,
-                LayoutModule,
+                SidenavLayoutModule,
                 MaterialModule
             ],
             declarations: [HeaderLayoutTesterComponent]

lib/core/layout/components/layout-container/layout-container.component.ts

@@ -16,7 +16,7 @@
  */
 
 import { Component, Input, ViewChild, OnInit, OnDestroy, ViewEncapsulation, OnChanges, SimpleChanges } from '@angular/core';
-import { MatSidenav } from '@angular/material';
+import { MatSidenav } from '@angular/material/sidenav';
 import { sidenavAnimation, contentAnimation } from '../../helpers/animations';
 import { Direction } from '@angular/cdk/bidi';
 
@@ -43,7 +43,7 @@ export class LayoutContainerComponent implements OnInit, OnDestroy, OnChanges {
     /** Layout text orientation 'ltr' | 'rtl' */
     @Input() direction: Direction = 'ltr';
 
-    @ViewChild(MatSidenav) sidenav: MatSidenav;
+    @ViewChild(MatSidenav, { static: true }) sidenav: MatSidenav;
 
     sidenavAnimationState: any;
     contentAnimationState: any;

lib/core/layout/components/sidenav-layout/sidenav-layout.component.spec.ts

@@ -111,7 +111,7 @@ describe('SidenavLayoutComponent', () => {
             removeListener: () => {}
         };
 
-        mediaMatcher = TestBed.get(MediaMatcher);
+        mediaMatcher = TestBed.inject(MediaMatcher);
         spyOn(mediaMatcher, 'matchMedia').and.callFake((mediaQuery) => {
             mediaQueryList.originalMediaQueryPassed = mediaQuery;
             spyOn(mediaQueryList, 'addListener').and.callThrough();
@@ -258,7 +258,7 @@ describe('Template transclusion', () => {
     });
 
     beforeEach(() => {
-        mediaMatcher = TestBed.get(MediaMatcher);
+        mediaMatcher = TestBed.inject(MediaMatcher);
         spyOn(mediaMatcher, 'matchMedia').and.callFake(() => {
             spyOn(mediaQueryList, 'addListener').and.stub();
             spyOn(mediaQueryList, 'removeListener').and.stub();

lib/core/layout/components/sidenav-layout/sidenav-layout.component.ts

@@ -71,15 +71,20 @@ export class SidenavLayoutComponent implements OnInit, AfterViewInit, OnDestroy
     /** Emitted when the menu toggle and the collapsed/expanded state of the sideNav changes. */
     @Output() expanded = new EventEmitter<boolean>();
 
-    @ContentChild(SidenavLayoutHeaderDirective) headerDirective: SidenavLayoutHeaderDirective;
-    @ContentChild(SidenavLayoutNavigationDirective) navigationDirective: SidenavLayoutNavigationDirective;
-    @ContentChild(SidenavLayoutContentDirective) contentDirective: SidenavLayoutContentDirective;
+    @ContentChild(SidenavLayoutHeaderDirective)
+    headerDirective: SidenavLayoutHeaderDirective;
+
+    @ContentChild(SidenavLayoutNavigationDirective)
+    navigationDirective: SidenavLayoutNavigationDirective;
+
+    @ContentChild(SidenavLayoutContentDirective)
+    contentDirective: SidenavLayoutContentDirective;
 
     private menuOpenStateSubject: BehaviorSubject<boolean>;
     public menuOpenState$: Observable<boolean>;
 
-    @ViewChild('container') container: any;
-    @ViewChild('emptyTemplate') emptyTemplate: any;
+    @ViewChild('container', { static: true }) container: any;
+    @ViewChild('emptyTemplate', { static: true }) emptyTemplate: any;
 
     mediaQueryList: MediaQueryList;
     _isMenuMinimized;