René's URL Explorer Experiment

Title: Adding AngularFireAnalytics, AngularFireRemoteConfig, and refactoring DI Tokens by jamesdaniels · Pull Request #2187 · angular/angularfire · GitHub

Open Graph Title: Adding AngularFireAnalytics, AngularFireRemoteConfig, and refactoring DI Tokens by jamesdaniels · Pull Request #2187 · angular/angularfire

X Title: Adding AngularFireAnalytics, AngularFireRemoteConfig, and refactoring DI Tokens by jamesdaniels · Pull Request #2187 · angular/angularfire

Description: Adding support for Firebase v7 added in 5.2.3 Adding AngularFireAnalytics and AngularFireRemoteConfig modules AddingScreenTrackingService and UserTrackingService which operate in conjunction with AngularFireAnalytics to track screen views and user identifiers respectively Cleaning up the injection token naming patterns, for semver they are aliases to the old ones TODO: address the Zone.js issues introduced rethink the Remote Config API, not in love test coverage docs add startWith support to AngularFireRemoteConfig export filterRemote(), filterFresh(), etc. pipes in @angular/fire/remote-config add distinctUntilChanged with a custom compare function to AngularFireRemoteConfig export Value as implements Partial in the .d.ts, so we don't break on minors generally clean up the types in RC fix the types if you are running older Firebase (this will make travis happy again) implement more of the router types in analytics (perhaps stop using _loadedConfig...) continue to test the robustness of analytics expand the test coverage fix the proxy in the SSR environment AngularFire "Lazy" Both AngularFireAnalytics and AngularFireRemoteConfig are of a design @davideast and I have been thinking about for a while; that we've been calling "AngularFire Lazy". These modules not only provide convenience observables and integrations with Angular, they also lazily load their respective Firebase modules and proxy the Firebase SDK (accounting for the aforementioned lazy-loading) and patch Zone.js. This allows you to use all of the methods available on the Firebase SDK while knowing that AngularFire has addressed Angular-compatibility. The only major difference is that anything in the vanilla Firebase SDK that isn't a promise now is. The use of a proxy means that we should not need to add support for new additions to the Firebase SDK for you to take advantage. Your feedback is wanted! We'll be bringing similar capabilities to the other modules in future releases 😄 @angular/fire/analytics AngularFireAnalyticsModule Provides AngularFireAnalytics and initializes ScreenTrackingService and UserTrackingService, if they were loaded. AngularFireAnalytics Lazy loads firebase/analytics and proxies firebase.analytics(). APP_VERSION and APP_NAME will be loaded into the Google Analytics, if they are provided. API updateConfig(options: {[key:string]: any}): Promise; // from firebase.analytics() proxy: logEvent(eventName: string, eventParams?: {[key: string]: any}, options?: analytics.AnalyticsCallOptions): Promise; setCurrentScreen(screenName: string, options?: analytics.AnalyticsCallOptions): Promise; setUserId(id: string, options?: analytics.AnalyticsCallOptions): Promise; setUserProperties(properties: analytics.CustomParams, options?: analytics.AnalyticsCallOptions): Promise; setAnalyticsCollectionEnabled(enabled: boolean): Promise; app: Promise; DI ANALYTICS_COLLECTION_ENABLED: boolean Globally disable Google Analytics collection by setting this to false. (default: true) APP_VERSION: string The application version to pass to Google Analytics. APP_NAME: string The application name to pass to Google Analytics. DEBUG_MODE: boolean Start Google Analytics in debug mode, so you can test your events in DebugView in the Firebase Console. (default: false) Also takes FIREBASE_OPTIONS and FIREBASE_APP_NAME like all other Modules. Usage @NgModule({ imports: [ AngularFireModule.initializeApp(environment.firebase), AngularFireAnalyticsModule ], providers: [ ScreenTrackingService, UserTrackingService, { provide: DEBUG_MODE, useFactory: isDevMode }, { provide: APP_NAME, useValue: 'my awesome web app' }, { provide: APP_VERSION, useValue: '0.0.0 (707e803)'} ] }) export class AppModule { } ... constructor(analytics: AngularFireAnalytics) { analytics.logEvent('custom_event', { ... }).then(() => { ... }); } ScreenTrackingService Logs screen views and tracks the current screen on Router NavigationEnd events. UserTrackingService Tracks the user's uid, if firebase/auth is loaded. @angular/fire/remote-config AngularFireRemoteConfigModule Provides AngularFireRemoteConfig AngularFireRemoteConfig Lazy loads firebase/remote-config, proxies firebase.remoteConfig(), and provides convenience observables & pipes for working with Remote Config. API interface ConfigTemplate {[key:string]: string|number|boolean} type Parameter extends remoteConfig.Value { key: string, fetchTimeMillis: number } class AngularFireRemoteConfig { changes: Observable; parameters: Observable; numbers: Observable<{[key:string]: number|undefined}> & {[key:string]: Observable}; booleans: Observable<{[key:string]: boolean|undefined}> & {[key:string]: Observable}; strings: Observable<{[key:string]: string|undefined}> & {[key:string]: Observable}; // from firebase.remoteConfig() proxy: activate: () => Promise; ensureInitialized: () => Promise; fetch: () => Promise; fetchAndActivate: () => Promise; getAll: () => Promise<{[key:string]: remoteConfig.Value}>; getBoolean: (key:string) => Promise; getNumber: (key:string) => Promise; getString: (key:string) => Promise; getValue: (key:string) => Promise; setLogLevel: (logLevel: remoteConfig.LogLevel) => Promise; settings: Promise; defaultConfig: Promise<{[key: string]: string | number | boolean}>; fetchTimeMillis: Promise; lastFetchStatus: Promise; } // Pipes for working with .changes and .parameters filterRemote: () => MonoTypeOperatorFunction filterFresh: (interval: number) => MonoTypeOperatorFunction budget: (interval: number) => MonoTypeOperatorFunction // map and scanToObject have several overloads // scanToObject is for use with .changes scanToObject: () => OperatorFunction // mapToObject is the same behavior are scanToObject but for use with .parameters, mapToObject: () => OperatorFunction DI DEFAULT_CONFIG: {[key:string]: string|number|boolean} Provide default values for Remote Config REMOTE_CONFIG_SETTINGS: remoteConfig.Settings Configure your remote config instance Also takes FIREBASE_OPTIONS and FIREBASE_APP_NAME like all other Modules. Usage @NgModule({ imports: [ AngularFireModule.initializeApp(environment.firebase), AngularFireRemoteConfigModule ], providers: [ { provide: DEFAULT_CONFIG, useValue: { enableAwesome: true } }, { provide: REMOTE_CONFIG_SETTINGS, useFactory: () => isDevMode() ? { minimumFetchIntervalMillis: 1 } : {} } ] }) export class AppModule { } ... constructor(remoteConfig: AngularFireRemoteConfig) { remoteConfig.changes.pipe( filterFresh(172_800_000), // ensure we have values from at least 48 hours ago first(), // scanToObject when used this way is similar to defaults // but most importantly smart-casts remote config values and adds type safety scanToObject({ enableAwesome: true, titleBackgroundColor: 'blue', titleFontSize: 12 }) ).subscribe(…); // all remote config values cast as strings remoteConfig.strings.subscribe(...) remoteConfig.booleans.subscribe(...); // as booleans remoteConfig.numbers.subscribe(...); // as numbers // convenience for observing a single string remoteConfig.strings.titleBackgroundColor.subscribe(...); remoteConfig.booleans.enableAwesome.subscribe(...); // boolean remoteConfig.numbers.titleBackgroundColor.subscribe(...); // number // however those may emit more than once as the remote config cache fires and gets fresh values from the server // you can filter it out of .changes for more control: remoteConfig.changes.pipe( filter(param => param.key === 'titleBackgroundColor'), map(param => param.asString()) // budget at most 800ms and return the freshest value possible in that time // our budget pipe is similar to timeout but won't error or abort the pending server fetch (it won't emit it, if the deadline is exceeded, but it will have been fetched so can use the freshest values on next subscription) budget(800), last() ).subscribe(...) // just like .changes, but scanned as into an array remoteConfig.parameters.subscribe(all => ...); // or make promisified firebase().remoteConfig() calls direct off AngularFireRemoteConfig // using our proxy remoteConfig.getAll().then(all => ...); remoteConfig.lastFetchStatus.then(status => ...); }

Open Graph Description: Adding support for Firebase v7 added in 5.2.3 Adding AngularFireAnalytics and AngularFireRemoteConfig modules AddingScreenTrackingService and UserTrackingService which operate in conjunction with A...

X Description: Adding support for Firebase v7 added in 5.2.3 Adding AngularFireAnalytics and AngularFireRemoteConfig modules AddingScreenTrackingService and UserTrackingService which operate in conjunction with A...

Opengraph URL: https://github.com/angular/angularfire/pull/2187

X: @github

direct link

Domain: github.com

Links:

Viewport: width=device-width