fix tests and weird angular compiler issues with app service.

Also fix deprecated mat slider on change event

src/cypress/tsconfig.json

@@ -2,7 +2,7 @@
   "extends": "../tsconfig.json",
   "include": ["**/*.ts"],
   "compilerOptions": {
-    "sourceMap": false,
+    "sourceMap": true,
     "types": ["cypress"]
   }
 }

src/src/app/app.component.ts

@@ -1,5 +1,4 @@
-import { Component, ViewChild, AfterViewInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
+import { Component, ViewChild, AfterViewInit, ChangeDetectorRef } from '@angular/core';
-import { AppService } from './services/app.service';
 import { NavService } from './services/nav.service';
 import { StorageService } from './services/storage.service';
 import { Observable } from 'rxjs';
@@ -10,6 +9,7 @@ import { SubscriberBase } from './common/subscriber-base';
 import { MatSnackBar } from '@angular/material/snack-bar';
 import { HelpModalComponent } from './components/help-modal/help-modal.component';
 import { MatDialog } from '@angular/material/dialog';
+import { AppService } from './services/app.service';
 
 @Component({
   selector: 'app-root',

src/src/app/components/add-to-page-modal/add-to-page-modal.component.ts

@@ -2,8 +2,8 @@ import { Component, Inject, ViewChild } from '@angular/core';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { MatSelectionList } from '@angular/material/list';
 import { UntypedFormBuilder, UntypedFormGroup } from '@angular/forms';
-import { AppService } from '../../services/app.service';
 import { CardItem } from '../../models/card-state';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-add-to-page-modal-modal',

src/src/app/components/card.component.ts

@@ -2,10 +2,10 @@ import { EventEmitter, Output, Input, ElementRef, Component } from '@angular/cor
 import { Observable } from 'rxjs';
 import { MatDialog } from '@angular/material/dialog';
 import { SubscriberBase } from '../common/subscriber-base';
-import { AppService } from 'src/app/services/app.service';
 import { MoveDirection } from '../common/move-direction';
 import { AddToPageModalComponent } from '../components/add-to-page-modal/add-to-page-modal.component';
 import { CardItem } from '../models/card-state';
+import { AppService } from '../services/app.service';
 
 @Component({
   template: '',

src/src/app/components/note/edit-modal/note-edit-modal.component.ts

@@ -8,8 +8,8 @@ import { MatChipInputEvent } from '@angular/material/chips';
 import { UUID } from 'angular2-uuid';
 
 import { NoteItem } from 'src/app/models/note-state';
-import { AppService } from 'src/app/services/app.service';
 import { CardItem } from 'src/app/models/card-state';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-note-edit-modal',

src/src/app/components/note/note-card.component.ts

@@ -1,11 +1,11 @@
-import { Component, ViewChild, ElementRef, Input, OnInit } from '@angular/core';
+import { Component, ViewChild, ElementRef, Input } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
-import { NoteEditModalComponent } from './edit-modal/note-edit-modal.component';
+import { CardComponent } from '../card.component';
-import { CardComponent } from '../../components/card.component';
+import { BibleReference } from 'src/app/common/bible-reference';
-import { AppService } from '../../services/app.service';
+import { NoteItem } from 'src/app/models/note-state';
-import { BibleReference } from '../../common/bible-reference';
+import { AppService } from 'src/app/services/app.service';
-import { NoteItem } from '../../models/note-state';
 import { OkCancelModalComponent, OkCancelResult } from '../ok-cancel-modal/ok-cancel-modal.component';
+import { NoteEditModalComponent } from './edit-modal/note-edit-modal.component';
 
 @Component({
   selector: 'app-note-card',

src/src/app/components/page-edit-modal/page-edit-modal.component.ts

@@ -1,8 +1,8 @@
 import { Component, Inject } from '@angular/core';
 import { UntypedFormGroup, UntypedFormBuilder } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
-import { AppService } from '../../services/app.service';
 import { SavedPage } from 'src/app/models/page-state';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-page-edit-modal',

src/src/app/components/passage/passage-card.component.ts

@@ -1,13 +1,13 @@
 import { Component, OnInit, ElementRef, ViewChild, ChangeDetectionStrategy } from '@angular/core';
 import { MatDialog } from '@angular/material/dialog';
-import { StrongsModalComponent } from '../strongs/modal/strongs-modal.component';
 import { NoteItem } from 'src/app/models/note-state';
 import { CardComponent } from 'src/app/components/card.component';
 import { BibleReference, Overlap } from 'src/app/common/bible-reference';
-import { AppService } from 'src/app/services/app.service';
 import { Paragraph, BiblePassageResult } from 'src/app/models/passage-state';
 import { CardItem } from 'src/app/models/card-state';
 import { isNullOrUndefined } from 'src/app/common/helpers';
+import { AppService } from 'src/app/services/app.service';
+import { StrongsModalComponent } from '../strongs/modal/strongs-modal.component';
 
 @Component({
   selector: 'app-passage-card',

src/src/app/components/saved-page-card/saved-page-card.component.ts

@@ -1,7 +1,6 @@
 import { Component, Input, OnInit } from '@angular/core';
 import { CdkDragDrop } from '@angular/cdk/drag-drop';
 import { MatDialog } from '@angular/material/dialog';
-import { AppService } from '../../services/app.service';
 import { Observable } from 'rxjs';
 import { SavedPage } from 'src/app/models/page-state';
 import { CardIcons, CardItem, CardType, DataReference } from 'src/app/models/card-state';
@@ -12,6 +11,7 @@ import { HashTable } from 'src/app/common/hashtable';
 import { SubscriberBase } from 'src/app/common/subscriber-base';
 import { getFromCardCache } from 'src/app/common/card-cache-operations';
 import { NoteItem } from 'src/app/models/note-state';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-saved-page-card',

src/src/app/components/settings/settings.component.html

@@ -122,13 +122,7 @@
       ><input
         matSliderThumb
         [(ngModel)]="cardFontSize"
-        (change)="
+        (valueChange)="cardFontSizeChanged($event)"
-          cardFontSizeChanged({
-            source: ngSliderThumb,
-            parent: ngSlider,
-            value: ngSliderThumb.value
-          })
-        "
         #ngSliderThumb="matSliderThumb"
       />
     </mat-slider>

src/src/app/components/settings/settings.component.ts

@@ -1,7 +1,6 @@
 import { Component } from '@angular/core';
 import { MatSlideToggleChange } from '@angular/material/slide-toggle';
 import { MatSelectChange } from '@angular/material/select';
-import { MatSliderChange } from '@angular/material/slider';
 import { MatSnackBar } from '@angular/material/snack-bar';
 import { MatDialog } from '@angular/material/dialog';
 
@@ -15,13 +14,13 @@ import { DisplaySettings } from 'src/app/models/app-state';
 import { CardFonts } from 'src/app/constants';
 
 import { NavService } from 'src/app/services/nav.service';
-import { AppService } from 'src/app/services/app.service';
 
 import { OkCancelModalComponent, OkCancelResult } from '../ok-cancel-modal/ok-cancel-modal.component';
 import { PageEditModalComponent } from 'src/app/components/page-edit-modal/page-edit-modal.component';
 import { NoteEditModalComponent } from 'src/app/components/note/edit-modal/note-edit-modal.component';
 import { SavedPage } from 'src/app/models/page-state';
 import { Overlap } from 'src/app/common/bible-reference';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-settings',
@@ -155,8 +154,8 @@ export class SettingsComponent extends SubscriberBase {
     this.appService.changeCardFontFamily(evt.value);
   }
 
-  cardFontSizeChanged(evt: MatSliderChange) {
+  cardFontSizeChanged(evt: number) {
-    this.appService.changeCardFontSize(evt.value);
+    this.appService.changeCardFontSize(evt);
   }
 
   //#endregion

src/src/app/components/strongs/card/strongs-card.component.ts

@@ -2,8 +2,8 @@ import { Component, ElementRef, ViewChild, OnInit, ChangeDetectionStrategy } fro
 import { MatDialog } from '@angular/material/dialog';
 import { StrongsModalComponent } from '../modal/strongs-modal.component';
 import { CardComponent } from 'src/app/components/card.component';
-import { AppService } from 'src/app/services/app.service';
 import { BibleReference } from 'src/app/common/bible-reference';
+import { AppService } from 'src/app/services/app.service';
 import { StrongsResult } from 'src/app/models/strongs-state';
 
 @Component({

src/src/app/components/strongs/modal/strongs-modal.component.ts

@@ -1,10 +1,10 @@
 import { Component, Inject, ChangeDetectionStrategy } from '@angular/core';
 import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { Observable } from 'rxjs';
-import { AppService } from 'src/app/services/app.service';
 import { BibleReference } from 'src/app/common/bible-reference';
 import { CardItem } from 'src/app/models/card-state';
 import { StrongsResult } from 'src/app/models/strongs-state';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-strongs-modal',

src/src/app/components/verse-picker-modal/verse-picker-modal.component.ts

@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
-import { AppService } from 'src/app/services/app.service';
 import { MatDialogRef } from '@angular/material/dialog';
 import { Book, BibleReference } from 'src/app/common/bible-reference';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-verse-picker',

src/src/app/components/words/words-card.component.ts

@@ -2,8 +2,8 @@ import { Component, ElementRef, ViewChild, ChangeDetectionStrategy } from '@angu
 import { MatDialog } from '@angular/material/dialog';
 import { BibleReference } from 'src/app/common/bible-reference';
 import { CardComponent } from 'src/app/components/card.component';
-import { AppService } from 'src/app/services/app.service';
 import { WordLookupResult } from 'src/app/models/words-state';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-words-card',

src/src/app/pages/notes-admin/notes-admin.page.ts

@@ -1,10 +1,10 @@
 import { Component, OnInit } from '@angular/core';
-import { AppService } from '../../services/app.service';
-import { NavService } from '../../services/nav.service';
-import { SubscriberBase } from '../../common/subscriber-base';
 import { CardItem, CardType } from 'src/app/models/card-state';
 import { NoteEditModalComponent } from 'src/app/components/note/edit-modal/note-edit-modal.component';
 import { MatDialog } from '@angular/material/dialog';
+import { SubscriberBase } from 'src/app/common/subscriber-base';
+import { AppService } from 'src/app/services/app.service';
+import { NavService } from 'src/app/services/nav.service';
 
 @Component({
   selector: 'app-notes-admin',

src/src/app/pages/saved-pages-admin/saved-pages-admin.page.ts

@@ -1,7 +1,7 @@
 import { Component, OnInit } from '@angular/core';
-import { AppService } from '../../services/app.service';
+import { SubscriberBase } from 'src/app/common/subscriber-base';
-import { NavService } from '../../services/nav.service';
+import { AppService } from 'src/app/services/app.service';
-import { SubscriberBase } from '../../common/subscriber-base';
+import { NavService } from 'src/app/services/nav.service';
 
 @Component({
   selector: 'app-saved-pages-admin',

src/src/app/pages/search/search.page.ts

@@ -3,12 +3,12 @@ import { ActivatedRoute, Router, NavigationEnd } from '@angular/router';
 import { UntypedFormControl } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
 import { MatAutocompleteTrigger, MatAutocomplete } from '@angular/material/autocomplete';
-import { AppService } from '../../services/app.service';
 import { NavService } from '../../services/nav.service';
 import { SubscriberBase } from '../../common/subscriber-base';
 import { VersePickerModalComponent } from '../../components/verse-picker-modal/verse-picker-modal.component';
 import { CardItem, CardType } from 'src/app/models/card-state';
 import { getFromCardCache } from 'src/app/common/card-cache-operations';
+import { AppService } from 'src/app/services/app.service';
 
 @Component({
   selector: 'app-search-page',

src/src/app/services/app-state-reducer.spec.ts

@@ -20,6 +20,7 @@ import {
   removeSavedPageAction,
   saveNoteAction,
   savePageAction,
+  setUserAction,
   updateAutoCompleteAction,
   updateCardAction,
   updateCardFontFamilyAction,
@@ -545,7 +546,7 @@ describe('AppService Reducer', () => {
       providerId: 'asdfasf',
     };
 
-    const testState = newUserAction(user).handle(preState);
+    const testState = setUserAction(user).handle(preState);
 
     expect(testState.user).toBe(user, 'Should set the user');
   });

src/src/app/services/migration0to1.service.ts

@@ -2,13 +2,13 @@ import { Injectable } from '@angular/core';
 import { AngularFireDatabase, AngularFireObject } from '@angular/fire/compat/database';
 import { DataSnapshot } from '@angular/fire/compat/database/interfaces';
 import { UUID } from 'angular2-uuid';
-import { AppService } from './app.service';
 import { Overlap } from '../common/bible-reference';
 import { Settings, User } from '../models/app-state';
 import { SavedPage } from '../models/page-state';
 import { CardType, DataReference } from '../models/card-state';
 import { StorageService } from './storage.service';
 import { Storable, StorableType } from '../common/storable';
+import { AppService } from './app.service';
 
 @Injectable({
   providedIn: 'root',

src/src/app/services/storage.service.ts

@@ -5,7 +5,6 @@ import { DataSnapshot } from '@angular/fire/compat/database/interfaces';
 
 import { SubscriberBase } from '../common/subscriber-base';
 import { IStorable, StorableType, UserVersion } from '../common/storable';
-import { AppService } from './app.service';
 import { MigrationVersion0to1 } from './migration0to1.service';
 
 import { User, Settings, AppState } from '../models/app-state';
@@ -14,6 +13,7 @@ import { SavedPage } from '../models/page-state';
 import { isNullOrUndefined } from '../common/helpers';
 import { DataReference } from '../models/card-state';
 import { createSelector } from 'reselect';
+import { AppService } from './app.service';
 
 /**
  * This class handles all the storage needs of the application.  It handles both

src/tsconfig.app.json

@@ -5,11 +5,6 @@
     "outDir": "./out-tsc/app",
     "types": []
   },
-  "files": [
+  "files": ["src/main.ts", "src/polyfills.ts"],
-    "src/main.ts",
+  "include": ["src/**/*.d.ts"],
-    "src/polyfills.ts"
-  ],
-  "include": [
-    "src/**/*.d.ts"
-  ]
 }

src/tsconfig.json

@@ -16,6 +16,7 @@
     "lib": ["es2018", "dom"]
   },
   "angularCompilerOptions": {
-    "strictTemplates": true,
+    "strictTemplates": true
-  }
+  },
+  "include": ["src/**/*.ts"]
 }

src/tsconfig.spec.json

@@ -3,16 +3,8 @@
   "extends": "./tsconfig.json",
   "compilerOptions": {
     "outDir": "./out-tsc/spec",
-    "types": [
+    "types": ["jasmine"]
-      "jasmine"
-    ]
   },
-  "files": [
+  "files": ["src/test.ts", "src/polyfills.ts"],
-    "src/test.ts",
+  "include": ["src/**/*.spec.ts", "src/**/*.d.ts"]
-    "src/polyfills.ts"
-  ],
-  "include": [
-    "src/**/*.spec.ts",
-    "src/**/*.d.ts"
-  ]
 }