fix(): Migrate imports to new Typings from 4.8.1 to resolve #1385

Author: myspivey

src/auth/auth.module.ts

@@ -1,6 +1,4 @@
 import { NgModule, NgZone } from '@angular/core';
-import * as firebase from 'firebase/app';
-import 'firebase/auth';
 import { FirebaseApp, AngularFireModule } from 'angularfire2';
 import { AngularFireAuth } from './auth';
 

src/auth/auth.spec.ts

@@ -1,4 +1,5 @@
-import * as firebase from 'firebase/app';
+import { FirebaseApp as FBApp } from '@firebase/app-types';
+import { User } from '@firebase/auth-types';
 import { ReflectiveInjector, Provider } from '@angular/core';
 import { Observable } from 'rxjs/Observable'
 import { Subject } from 'rxjs/Subject'
@@ -19,16 +20,16 @@ function authSkip(auth: Observable<any>, count: number): Observable<any> {
   return skip.call(auth, 1);
 }
 
-const firebaseUser = <firebase.User> {
+const firebaseUser = <User> {
   uid: '12345',
   providerData: [{ displayName: 'jeffbcrossyface' }]
 };
 
 describe('AngularFireAuth', () => {
-  let app: firebase.app.App;
+  let app: FBApp;
   let afAuth: AngularFireAuth;
   let authSpy: jasmine.Spy;
-  let mockAuthState: Subject<firebase.User>;
+  let mockAuthState: Subject<User>;
 
   beforeEach(() => {
     TestBed.configureTestingModule({
@@ -42,11 +43,11 @@ describe('AngularFireAuth', () => {
       afAuth = _auth;
     })();
 
-    mockAuthState = new Subject<firebase.User>();
+    mockAuthState = new Subject<User>();
     spyOn(afAuth, 'authState').and.returnValue(mockAuthState);
     spyOn(afAuth, 'idToken').and.returnValue(mockAuthState);
-    afAuth.authState = mockAuthState as Observable<firebase.User>;
-    afAuth.idToken = mockAuthState as Observable<firebase.User>;
+    afAuth.authState = mockAuthState as Observable<User>;
+    afAuth.idToken = mockAuthState as Observable<User>;
   });
 
   afterEach(done => {
@@ -104,7 +105,7 @@ describe('AngularFireAuth', () => {
 
   it('should emit auth updates through idToken', (done: any) => {
     let count = 0;
-    
+
     // Check that the first value is null and second is the auth user
     const subs = afAuth.idToken.subscribe(user => {
       if (count === 0) {

src/auth/auth.ts

@@ -1,5 +1,4 @@
-import * as firebase from 'firebase/app';
-import 'firebase/auth';
+import { FirebaseAuth, User } from '@firebase/auth-types';
 import { Injectable, NgZone } from '@angular/core';
 import { Observable } from 'rxjs/Observable';
 import { observeOn } from 'rxjs/operator/observeOn';
@@ -15,12 +14,12 @@ export class AngularFireAuth {
   /**
    * Firebase Auth instance
    */
-  public readonly auth: firebase.auth.Auth;
+  public readonly auth: FirebaseAuth;
 
   /**
    * Observable of authentication state; as of 4.0 this is only triggered via sign-in/out
    */
-  public readonly authState: Observable<firebase.User|null>;
+  public readonly authState: Observable<User|null>;
 
   /**
    * Observable of the signed-in user's ID token; which includes sign-in, sign-out, and token refresh events
@@ -36,7 +35,7 @@ export class AngularFireAuth {
     });
     this.authState = observeOn.call(authState$, new ZoneScheduler(Zone.current));
 
-    const idToken$ = new Observable<firebase.User|null>(subscriber => {
+    const idToken$ = new Observable<User|null>(subscriber => {
       const unsubscribe = this.auth.onIdTokenChanged(subscriber);
       return { unsubscribe };
     }).switchMap(user => {
@@ -45,4 +44,4 @@ export class AngularFireAuth {
     this.idToken = observeOn.call(idToken$, new ZoneScheduler(Zone.current));
   }
 
-}
+}

src/core/angularfire2.spec.ts

@@ -1,4 +1,5 @@
-import * as firebase from 'firebase/app';
+
+import { Reference } from '@firebase/database-types';
 import { TestBed, inject, withModule, async } from '@angular/core/testing';
 import { ReflectiveInjector, Provider, PlatformRef, NgModule, Compiler, ApplicationRef, CompilerFactory } from '@angular/core';
 import { FirebaseApp, FirebaseAppConfig, AngularFireModule } from 'angularfire2';
@@ -9,9 +10,9 @@ import { BrowserModule } from '@angular/platform-browser';
 describe('angularfire', () => {
   let subscription:Subscription;
   let app: FirebaseApp;
-  let rootRef: firebase.database.Reference;
-  let questionsRef: firebase.database.Reference;
-  let listOfQuestionsRef: firebase.database.Reference;
+  let rootRef: Reference;
+  let questionsRef: Reference;
+  let listOfQuestionsRef: Reference;
   let defaultPlatform: PlatformRef;
 
   const APP_NAME = 'super-awesome-test-firebase-app-name';

src/core/angularfire2.ts

@@ -1,4 +1,3 @@
-import * as firebase from 'firebase/app';
 import { FirebaseAppConfigToken, FirebaseApp, _firebaseAppFactory } from './firebase.app.module';
 import { Injectable, InjectionToken, NgModule } from '@angular/core';
 import { Subscription } from 'rxjs/Subscription';

src/core/firebase.app.module.ts

@@ -1,18 +1,25 @@
 import { InjectionToken, } from '@angular/core';
 import { FirebaseAppConfig } from './';
-import * as firebase from 'firebase/app';
+import { firebase } from '@firebase/app';
+
+import { FirebaseApp as FBApp } from '@firebase/app-types';
+import { FirebaseAuth } from '@firebase/auth-types';
+import { FirebaseDatabase } from '@firebase/database-types';
+import { FirebaseMessaging } from '@firebase/messaging-types';
+import { FirebaseStorage } from '@firebase/storage-types';
+import { FirebaseFirestore } from '@firebase/firestore-types';
 
 export const FirebaseAppConfigToken = new InjectionToken<FirebaseAppConfig>('FirebaseAppConfigToken');
 
-export class FirebaseApp implements firebase.app.App {
+export class FirebaseApp implements FBApp {
   name: string;
   options: {};
-  auth: () => firebase.auth.Auth;
-  database: () => firebase.database.Database;
-  messaging: () => firebase.messaging.Messaging;
-  storage: () => firebase.storage.Storage;
+  auth: () => FirebaseAuth;
+  database: () => FirebaseDatabase;
+  messaging: () => FirebaseMessaging;
+  storage: () => FirebaseStorage;
   delete: () => Promise<any>;
-  firestore: () => firebase.firestore.Firestore;
+  firestore: () => FirebaseFirestore;
 }
 
 export function _firebaseAppFactory(config: FirebaseAppConfig, appName?: string): FirebaseApp {

src/database-deprecated/database.module.ts

@@ -1,6 +1,4 @@
 import { NgModule } from '@angular/core';
-import * as firebase from 'firebase/app';
-import 'firebase/database';
 import { AngularFireModule, FirebaseApp } from 'angularfire2';
 import { AngularFireDatabase } from './database';
 

src/database-deprecated/database.ts

@@ -1,5 +1,4 @@
-import * as firebase from 'firebase/app';
-import 'firebase/database';
+import { FirebaseDatabase } from '@firebase/database-types';
 import { Inject, Injectable } from '@angular/core';
 import { FirebaseAppConfigToken, FirebaseAppConfig, FirebaseApp } from 'angularfire2';
 import { FirebaseListFactory } from './firebase_list_factory';
@@ -15,8 +14,8 @@ export class AngularFireDatabase {
   /**
    * Firebase Database instance
    */
-  database: firebase.database.Database;
-  
+  database: FirebaseDatabase;
+
   constructor(public app: FirebaseApp) {
     this.database = app.database();
   }

src/database-deprecated/firebase_list_factory.spec.ts

@@ -1,8 +1,8 @@
-import * as firebase from 'firebase/app';
+import { DataSnapshot } from '@firebase/database-types';
 import { FirebaseApp, FirebaseAppConfig, AngularFireModule} from 'angularfire2';
-import { AngularFireDatabase, AngularFireDatabaseModule, FirebaseListObservable, 
-  FirebaseListFactory, onChildAdded, onChildChanged, onChildRemoved, onChildUpdated, 
-  FirebaseObjectFactory 
+import { AngularFireDatabase, AngularFireDatabaseModule, FirebaseListObservable,
+  FirebaseListFactory, onChildAdded, onChildChanged, onChildRemoved, onChildUpdated,
+  FirebaseObjectFactory
 } from 'angularfire2/database-deprecated';
 import { TestBed, inject } from '@angular/core/testing';
 import * as utils from './utils';
@@ -652,15 +652,15 @@ describe('FirebaseListFactory', () => {
       };
 
       it('should return an object value with a $key property', () => {
-        const unwrapped = utils.unwrapMapFn(snapshot as firebase.database.DataSnapshot);
+        const unwrapped = utils.unwrapMapFn(snapshot as DataSnapshot);
         expect(unwrapped.$key).toEqual(snapshot.ref.key);
       });
 
       it('should return an object value with a $value property if value is scalar', () => {
         const existsFn = () => { return true; }
-        const unwrappedValue5 = utils.unwrapMapFn(Object.assign(snapshot, { val: () => 5, exists: existsFn }) as firebase.database.DataSnapshot);
-        const unwrappedValueFalse = utils.unwrapMapFn(Object.assign(snapshot, { val: () => false, exists: existsFn }) as firebase.database.DataSnapshot);
-        const unwrappedValueLol = utils.unwrapMapFn(Object.assign(snapshot, { val: () => 'lol', exists: existsFn }) as firebase.database.DataSnapshot);
+        const unwrappedValue5 = utils.unwrapMapFn(Object.assign(snapshot, { val: () => 5, exists: existsFn }) as DataSnapshot);
+        const unwrappedValueFalse = utils.unwrapMapFn(Object.assign(snapshot, { val: () => false, exists: existsFn }) as DataSnapshot);
+        const unwrappedValueLol = utils.unwrapMapFn(Object.assign(snapshot, { val: () => 'lol', exists: existsFn }) as DataSnapshot);
 
         expect(unwrappedValue5.$key).toEqual('key');
         expect(unwrappedValue5.$value).toEqual(5);

src/database-deprecated/firebase_list_factory.ts

@@ -1,4 +1,4 @@
-import * as firebase from 'firebase/app';
+import * as database from '@firebase/database-types';
 import { ZoneScheduler } from 'angularfire2';
 import * as utils from './utils';
 import 'firebase/database';
@@ -92,7 +92,7 @@ export function FirebaseListFactory (
       }
 
       return queried;
-    }), (queryRef: firebase.database.Reference, ix: number) => {
+    }), (queryRef: database.Reference, ix: number) => {
       return firebaseListObservable(queryRef, { preserveSnapshot });
     })
     .subscribe(subscriber);
@@ -108,7 +108,7 @@ export function FirebaseListFactory (
  * asynchonous. It creates a initial array from a promise of ref.once('value'), and then starts
  * listening to child events. When the initial array is loaded, the observable starts emitting values.
  */
-function firebaseListObservable(ref: firebase.database.Reference | DatabaseQuery, {preserveSnapshot}: FirebaseListFactoryOpts = {}): FirebaseListObservable<any> {
+function firebaseListObservable(ref: database.Reference | DatabaseQuery, {preserveSnapshot}: FirebaseListFactoryOpts = {}): FirebaseListObservable<any> {
 
   const toValue = preserveSnapshot ? (snapshot => snapshot) : utils.unwrapMapFn;
   const toKey = preserveSnapshot ? (value => value.key) : (value => value.$key);